5 lugares inesperados para inyectar personalidad en su sitio

La personalidad transforma un sitio básico en uno atractivo y entretenido. Es lo que convence a los que visitan por primera vez de que sigan haciendo clic y a los que repiten para que vuelvan. Sin embargo, una vez que hayas añadido personalidad en todos los lugares obvios – como tu copia, visuales, fuentes y combinación de colores – puede que no sepas qué más personalizar.

Si ese es el caso, mira estos cinco lugares donde puedes darle un poco de personalidad a tu sitio.

La página de error

Ya sea por su culpa o la de ellos, los visitantes de su sitio estarán comprensiblemente un poco consternados cuando se les muestre una página de error. Pero con una útil, visualmente convincente, incluso divertida página 404 o 500, puede hacerles olvidar su consternación y construir su marca en el proceso.

Busquemos algunas páginas de error bien diseñadas para inspirarnos.

Cada detalle de las 500 páginas de GitHub es genial. Primero, la ilustración transmite perfectamente la personalidad de GitHub: estrafalaria, poco convencional, no demasiado seria. A medida que mueves el ratón, la ilustración cambia en respuesta – un bonito pedazo de codificación.

La copia también está en marca, del “¡¡Oops!!!” con no uno sino tres signos de exclamación y la útil sugerencia en la parte inferior.

La página 404 de la Musa está igualmente bien ejecutada. Es difícil no sonreírle al lastimoso cachorro, y su explicación (“La dirección que ingresaste es inválida, o tal vez me la comí”) es bastante linda.

En lugar de presentar simplemente enlaces a varias secciones del sitio, dice, “Tenemos algunas grandes sugerencias sobre dónde ir desde aquí!”

Incluso la NASA ha creado una página de errores creativos. Ya que una variedad de audiencias usan el sitio, desde niños hasta profesionales, fue prudente mantener el mensaje lúdico y temático del espacio sin exagerar. (El porno espacial tampoco hace daño.)

La FAQ

Las páginas de preguntas frecuentes tienden a ser un poco secas. Es comprensible: necesitan comunicar mucha información de la forma más clara, concisa y práctica posible.

Sin embargo, si puedes hacer eso y al mismo tiempo poner algo de personalidad, tus visitantes te lo agradecerán.

Casper tiene una de las mejores páginas de preguntas frecuentes que he visto. Hay cinco temas principales, cada uno con su propia y adorable ilustración. Esto hace que leer sobre la “mezcla especial de tres tipos de espuma” de un colchón Casper sea más divertido que aburrido.

Para animar su centro de apoyo, el competidor de Squarespace, Jimdo, usó iconos descriptivos. Esta técnica de diseño no sólo hace que encontrar la sección correcta sea intuitivo, sino que también está en consonancia con lo visual que es el resto del sitio de Jimdo.

Product Hunt usó un enfoque diferente. El estilo de la FAQ de Product Hunt es relativamente tradicional (aunque mantiene el aspecto general del sitio), pero hay personalidad en la copia.

Por ejemplo, la primera pregunta es: “¿Qué está pasando aquí?” Esto responde a “¿Qué es la caza de productos?” de una manera más humana. También hay algunas preguntas del huevo de pascua, como, “¿Dónde están mis llaves?”

Product Hunt es un sitio moderado por el usuario con contenido generado por el usuario, y como tal, es muy comunal. Un FAQ genérico se sentiría extrañamente formal.

El pop-up

Las ventanas emergentes de los sitios tienen una muy mala reputación. Sin embargo, si le das a tus visitantes algo de valor (un código de descuento, una guía gratuita, un boletín informativo genial, etc.), entonces no son malos en absoluto.

Y también son otra oportunidad para mostrar la personalidad de tu marca.

Mira este pop-up de Stick in a Box, un servicio de suscripción de cecina. Los chicos de Stick in a Box son tontos sin disculparse (su compañía se llama Stick in a Box, después de todo). Este pop-up es definitivamente tonto.

Deny Designs, una compañía de muebles y decoración, está atrayendo a un público totalmente diferente: Mujeres de 16 a 28 años.

Su pop-up está perfectamente adaptado a este público, desde la copia de cortesía (nota: “ideas que son totalmente bailables” y “mejores”) hasta los colores atrevidos y los pulgares jóvenes. Cuando navegas por el resto del sitio, encontrarás este enfoque de gran energía y amabilidad repetido en todas partes.

Greatist, un sitio de fitness y salud, usó una estrategia diferente. Su popup es relativamente claro: una línea y dos botones. No sólo la foto está bien estilizada y es temáticamente consistente, sino que la simplicidad de la pregunta implica que volverse más saludable es simple.

Casper recibe su segundo grito por su impresionante popup. Aunque es fácil frustrarse con los popups por interrumpir la experiencia de navegación, este es demasiado divertido para ser molesto. Me gusta especialmente la conexión de la ardilla con las ideas de regalos más “locas”.

Este ejemplo del Arsenal es muy simple, pero te hace sentir como un miembro del equipo con sus chistes internos y su tono de macho a propósito.

Finalmente, este pop-up de salida del portafolio de Brad S. Knutson es uno de los mejores que he visto en un sitio web personal. Knutson sabe claramente que está hablando con un cierto subconjunto de personas, de ahí el conocido meme de Internet.

El icono de carga

El icono de carga es definitivamente un área subutilizada cuando se trata de inyectar personalidad. Pero si te quedas con un molinete o una barra normal, estarás perdiendo la oportunidad de entretener a tus visitantes mientras esperan.

Mientras el rastreador de Santa Claus de Google se carga, un sonriente Santa te saluda. Una vez que entras en el sitio, ves lo cerca que está el diseño de la interfaz de usuario de esta ilustración. Es una buena manera de hacer que el viaje se sienta continuo.

La aerolínea europea Ryanair actualiza el icono de carga circular añadiendo un avión, lo que es un bonito guiño a la función del sitio. Y los colores del icono están tomados de los colores de la marca Ryanair.

Mira el sitio de la Cocina Digital para otra variación genial. “Espera la grandeza”, el lema de la agencia, aparece en un fondo totalmente negro. A medida que el sitio se carga, un velo gris se quita del eslogan para revelar un colorido montaje de campañas pasadas.

Este dispositivo de carga une todo lo más importante de DK: su trabajo, su lema y su filosofía de diseño. Para cuando entras en el sitio, ya estás preparado para trabajar con la agencia (o para ella).

El Charles es otra agencia digital; sin embargo, su página de carga es mucho más sutil. Esta elección tiene sentido cuando se experimenta el sitio de The Charles. Definitivamente es mínimo y tiene una configuración de una página, amplio espacio en blanco, y texto negro y descarnado.

Si usas la página de carga de Digital Kitchen para The Charles, los visitantes se sentirán desconcertados por la transición.

La página del equipo

Mostrar a tus visitantes la gente que está detrás de la página web es una gran manera de crear una auténtica conexión. Pero recuerda, esta página necesita ser igual, si no más, de marca que las otras.

Así que aunque técnicamente sea “sobre ti”, asegúrate de describir tu equipo, misión, historia, etc. en un estilo que sea coherente con el resto del sitio.

Kickstarter tiene una fantástica página de “Equipo”. Puedes literalmente filtrar a los empleados por sus intereses, desde poesía a Dungeon & Dragones. Esto tiene todo el sentido, considerando que Kickstarter está diseñado para financiar proyectos de pasión. La función de filtrado también es agradable porque recuerda a la sección de Descubrimiento de Kickstarter, que te permite navegar por las campañas en vivo por categoría.

Cuando se pasa el cursor sobre los empleados individuales, se aprende cuántos proyectos han respaldado, junto con su categoría favorita. Es una forma sutil pero efectiva de demostrar que el equipo de Kickstarter come su propio alimento para perros (es decir, usa su propio producto).

Kittie’s Cakes, una pequeña panadería en Ohio, también tiene una bien ejecutada página de “Historia”. Tiene un diseño estilo libro de recortes; no sólo añade un factor de belleza, sino que va con los clásicos productos de panadería americana que ofrece Kittie’s.

Las fotos de los dueños, Mollie y Kelly, y el anuncio sobre su historia compartida, dan a esta página aún más personalidad.

Por último, mira la página “Acerca de” de Munchery. La imagen del encabezado es un collage de los empleados de Munchery siendo tontos: una forma divertida de mostrar la cultura de la compañía sin usar mucho de los bienes raíces.

La copia en esta página refuerza la vibración íntima y amistosa. Por ejemplo, una sección dice: “Estás sobrecomprometido, bajo la cafeína y la bandeja de entrada cero parece una broma cruel. En algún momento, tienes que averiguar qué hay para cenar”.

Algunas cosas son mejores con moderación, pero cuando se trata de tu sitio, la personalidad no es una de ellas. Cuanto más atractivo, entretenido y vivo se sienta, más les gustará a sus visitantes.

¿Cómo has inyectado más personalidad en tu diseño web? Comparte tus ideas en los comentarios!

Este artículo fue escrito originalmente por Aja Frost para Sitepoint.

admin

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Publicar un comentario