Porqué Considerar un Rediseño de Sitios Web - Consejos y Recomendaciones

Es 2018. Para muchos de nosotros en todo el mundo, el nuevo año marca un nuevo comienzo. Nuevos objetivos, nuevas ideas y, para algunas empresas, un nuevo diseño de sitio web para reemplazar el anterior.

Los sitios web se renuevan por todo tipo de razones, lamentablemente, muchas empresas no se dan cuenta de que su sitio web necesita una actualización. En un escenario aún peor, las empresas rivales pueden obtener una ventaja competitiva mejorando su sitio web, impulsando sus conversiones, mientras que las suyas pueden estar quedándose atrás.

¿Tu sitio web es culpable de alguno de estos? Si es así, ¡quizás sea hora de rediseñar!

• La empresa tiene una identidad, pero el sitio web no la refleja.
• Algunos enlaces están rotos, lo que hace que el usuario abandone el flujo de conversión.
• Los usuarios intentan comunicarse con usted, pero lo encuentran difícil.
• El sitio web en general se siente desactualizado, lo que deja a los usuarios impresionado.
• La usabilidad es pobre. Los usuarios tienen dificultades para navegar por el sitio web.
• La IU es confusa e inconsistente. Los usuarios siguen cometiendo errores.

Echemos un vistazo a lo que se puede hacer para solucionar esto.

Un sitio de comercio electrónico que no se ha actualizado durante mucho tiempo, mostrando su edad

Constructores de sitios web: plagado de peligros

Los nuevos negocios tienden a comenzar con simples constructores de sitios web como Wix, Weebly o Squarespace. Estas herramientas simplifican el proceso de diseño de un sitio web utilizando editores WYSIWYG (“lo que ve es lo que obtienes”) de arrastrar y soltar, y alojamiento gratuito, pero estas herramientas rara vez son lo suficientemente sofisticadas como para que los sitios web se destaquen entre la multitud.

Durante las primeras etapas de un nuevo negocio, cuando los fondos son escasos, tiene sentido teórico usar un creador de sitios web. El enfoque de “hosting incluido, sin código requerido” ayuda a las empresas a establecer una presencia en línea sin gastar demasiado tiempo y dinero. Sin embargo, esto viene con un montón de peligros ocultos: peligros que tienden a revelarse en la peor oportunidad (por ejemplo, cuando el sitio web necesita expandir su oferta).

Con los creadores de sitios web, las funciones se limitan a lo que ofrece el servicio, y como resultado de este enfoque directo y directo para configurar un sitio web, cualquier oportunidad de expansión puede verse gravemente restringida más adelante. Aquí hay una trampa de ejemplo de la que pueden caer las empresas cuando operan un creador de sitios web por sí mismas, en un esfuerzo por reducir los costos de diseño y desarrollo:

Un negocio de eCommerce usa un constructor de sitios web (o CMS con un tema gratuito) → El cliente configura un sitio web de una página solo para decir “¡Hola, somos [nombre de la empresa] y estamos aquí!” → Luego, el cliente desea agregar productos solo para darse cuenta de que no es posible.

A menudo, las empresas no piensan en lo que podría suceder si las necesidades de su sitio web se vuelven más complejas y se ven atrapadas en el camino. Además de eso, factores importantes como la optimización del motor de búsqueda (SEO), SSL (que afecta la clasificación y la seguridad) y la facilidad de uso del móvil (que afecta la clasificación y las conversiones) pueden terminar siendo descuidados.

Como experto, ahí es donde entras.

Un diseñador experto no debe pasar por alto estas consideraciones importantes y debe crear un sitio web que sea a prueba de futuro, ahorrando tiempo y dinero a largo plazo.

En resumen, el mejor rediseño del sitio web es uno que no tiene por qué suceder.

Constructores de Sitios Web vs Contratar a un Diseñador

Incluso sitios web diseñados por diseñadores expertospueden comenzar a cultivar malas hierbas si se deja abatir durante demasiado tiempo. Debido a un enfoque en otros aspectos del negocio, a veces la hoja de ruta para la versión 2 nunca llega; por ejemplo, a veces consideraciones importantes como SSL no eran consideraciones importantes en ese momento. De cualquier manera, todas las empresas deben buscar rediseñar su sitio web de vez en cuando, especialmente cuando hay inquietudes de los clientes.

Vamos a hablar sobre las principales razones por las que un sitio web puede necesitar un rediseño y la estrategia que debe tomar al modernizar los sitios web por esos motivos.

Un sitio B2B que no se ha actualizado durante 10 años, mostrando su edad

Branding (o cambio de marca)

El cambio de marca generalmente viene con un nuevo diseño de sitio web; sin embargo, esto debería extenderse más allá de un nuevo logotipo. Dado que la marca se trata de comunicarse con el público, también se debe considerar el tono de voz (piense en la copia del sitio web, las secciones de preguntas frecuentes o la atención al cliente en línea).

La marca es la forma en que una empresa desea retratarse (por ejemplo, útil, casual o confiable), por lo que el alcance del rediseño de un sitio web depende de cuánto desea reimaginarse la empresa. Una institución financiera cuyos clientes experimenten problemas de confianza se beneficiaría de un cambio de marca que se vea y suene confiable, por ejemplo.

Independientemente de si está mejorando una marca existente o creando una nueva desde cero, esto es lo que debe tener en cuenta:

• ¿Los colores te hacen sentir de cierta manera?
• ¿Las imágenes / fotografías hacen que el usuario sienta algo?
• ¿La estética visual general satisface a los usuarios?
• ¿Es la página de destinouna copia atractiva?
• ¿Es útil la copia de Preguntas frecuentes?
• ¿El tono general de la voz retrata quién es el negocio?
• ¿El sitio web necesita alguna funcionalidad adicional, como el chat en vivo?

Y, lo que es más importante, ¿hay alguna investigación de usuario / cliente que pueda utilizar para construir la base del rediseño de su sitio web? Si no, entonces esta es tu primera tarea.

Mozilla, antes y después de su rediseño y cambio de marca

Funcionalidad extendida

El rediseño de un sitio web suele estar justificado cuando hay demanda de nuevos rasgos por parte de los clientes. Las empresas innovadoras están constantemente creando nuevos productos (tanto en línea como fuera de línea), que requieren nuevas características que ayudan a los usuarios a experimentar mejor esos productos. Las empresas más pequeñas, por otro lado, podrían estar buscando expandir sus negocios con el marketing de contenidos, para lo cual necesitarán un blog o generarán ingresos a través de una tienda de comercio electrónico. De cualquier manera, un rediseño a menudo va más allá de pequeños cambios cosméticos y cambio de marca.

A veces, la “característica” es desconocida, envuelta en misterio. El cliente sabe que algo no está funcionando (bajas conversiones, insatisfacción del cliente, etcétera), pero no está seguro de por qué. A veces, la característica es solo unas pocas mejoras de UX: el producto en sí está bien, pero fundamentalmente, la experiencia del usuario del sitio web es defectuosa.

En cualquier caso, debe usar análisis de sitios web para comprender mejor a los usuarios.

Rediseño con datos

Al igual que con la marca, el UX debe ser impulsado por el user research. Herramientas de análisis de sitios web como Google Analytics y herramientas de mapas de calor como Hotjar y CrazyEgg pueden ayudarte a identificar áreas críticas que pueden necesitar un replanteamiento o incluso características completas que podrían faltar.

Analytics te dirá todo lo que necesitas saber sobre tus usuarios: cuánto tiempo pasan en determinadas páginas web, si están convirtiendo o no, dónde están abandonando el flujo de conversión, qué dispositivo usaron, de dónde vienen, datos demográficos del usuario, flujo de comportamiento; la gran cantidad de datos es literalmente interminable.

Estos datos no solo se pueden utilizar para medir el éxito del rediseño de un sitio web , pero también puede probar qué áreas del sitio web se quedan cortas en términos de UX. Si el cliente aún no sabe qué es lo que le falta, puedes usar analíticas de sitios web para sugerir cualquier cosa, desde mejoras hasta ideas completas de productos, y luego elaborar una hoja de ruta para ver cómo podría ser el rediseño. El rediseño de un sitio web requiere planificación.

Si estás tratando con un sitio web que no utiliza análisis de sitios web, entonces su primera llamada a la acción es instalar los antes mencionados Google Analytics (informes siempre gratuitos, increíblemente detallados) Una vez que haya identificado las áreas de preocupación con Google Analytics, el siguiente paso en el proceso de diseño es la prueba de usabilidad. Herramientas como Hotjar y CrazyEggte mostrarán exactamente dónde están haciendo clic los usuarios, e incluso puede ver cómo se comportan los usuarios en el sitio web con repeticiones de sesiones. Si has identificado páginas web con poca conversión con Google Analytics, estas grabaciones de usuario te mostrarán por qué.

Cualquier otra decisión de diseño se basa en conjeturas fundadas (en el mejor de los casos).

Cuando hayas terminado con tu investigación, puedes crear mapas de viaje del cliente para resaltar cómo se están convirtiendo la mayoría de los usuarios. Este es un activo bastante interesante que se puede compartir en toda la empresa e informa a todo el equipo sobre el papel que deben desempeñar en el flujo de conversión fuera del sitio web (redes sociales, servicio al cliente, etc.).

Mejor aún, puedes ayudar a los clientes a familiarizarse con los análisis, para que ellos mismos puedan medir cualquier éxito o falla o realizar su propia investigación de usuarios para futuros emprendimientos. Siempre es una victoria cuando el cliente puede tomar el volante de ahí en adelante.

Rediseño de Blog

Como se mencionó anteriormente, las empresas en etapa inicial buscarán iniciar un blog para expandir su alcance. En este escenario, el sitio web ha comenzado a adquirir visitantes y ahora la compañía cree que está lista para ampliar su alcance aún más con el marketing de contenidos.

En algunos casos (o en muchos casos, en realidad), un blog es el activo de marketing más grande que tiene una empresa. Un blog les brinda a las empresas la oportunidad de impulsar su marca, informar a los usuarios sobre actualizaciones y nuevos productos, y atraer a su público objetivo con contenido relevante.

Dicho esto, en este día y edad, es realmente difícil llamar la atención del lector por una cantidad de tiempo considerable. Si bien parte de esto se debe al contenido en sí mismo, el UX deficiente suele ser el culpable, lo que provoca que los usuarios presionen el botón Atrás y prueben con un competidor.

Lamentablemente, esa es la desventaja del contenido gratuito: los usuarios abandonarán felizmente una página web si el UX no es óptimo. Un gran diseñador debe saber cómo mejorar la legibilidad y la legibilidad, eliminar las distracciones visuales e insertar CTAs en niveles altos de puntos de conversión.

Los diseñadores también deberían usar análisis de sitios web para mejorar el contenido UX — para averiguar donde los usuarios dejan de leer y por qué– y luego tomar decisiones de diseño basadas en datos basadas en eso. Al abordar un rediseño donde las nuevas características requieren un CMS, una vez más, es importante asegurarse de que el cliente pueda tomar el volante fácilmente después.

Rediseño de Comercio Electrónico

El diseño de comercio electrónico es uno de los aspectos más complicados de UX para dominar y también requiere un diseñador con experiencia en diseño basado en datos. Considere esto: Según este estudio, las tiendas de comercio electrónico sufren una tasa de abandono del carrito del 69.23% (en promedio). Donde se gastaron $ 738 mil millones de dólares en comercio electrónico en los EE. UU. Y Europa, se estima que $ 260 mil millones de eso se pudieron recuperar a través de un mejor flujo y diseño de pago. Para una tienda de comercio electrónico, el flujo de salida es el aspecto más crítico, y un diseñador que puede identificar dónde los usuarios abandonan es un designer que puede mejorarlo.

Aquí hay algunas cosas a considerar:

• ¿El sitio web infunde confianza y seguridad?
• ¿El sitio web tiene un certificado SSL válido?
• ¿Los formularios de pago están bien etiquetados y son fáciles de usar?
• ¿Los campos de entrada muestran el tipo de teclado correcto?
• ¿El usuario puede buscar, en caso de que no encuentren lo que están buscando?
• ¿Está forzando a los usuarios a registrarse cuando prefieren visitar como invitado?

eBay, antes y después de su rediseño

Manejando el lado comercial

Algunos aspectos del negocio (como la atención al cliente) pueden tener enormes gastos generales si el proceso no es lo suficientemente eficiente, por lo que se actualizan los sitios web con servicios integrados como Intercom o Kayako no solo puede proporcionar una mejor experiencia para los usuarios, sino también ayudar a las empresas a reducir los costos de soporte al cliente y las cargas de trabajo. Cuando se aproxime al rediseño de un sitio web, pregunte al cliente cuáles son sus mayores desafíos como equipo/organización.

Responsive Design and Usability

En resumen, los sitios web receptivos son aquellos que se adaptan a prácticamente cualquier tamaño de pantalla, desde el móvil al escritorio. El tráfico móvil superó el tráfico de escritorio en el año 2015, e incluso Google comenzó a favorecer a los sitios web optimizados para dispositivos móviles en sus resultados de búsqueda. Aunque la mayoría de los sitios web son técnicamente receptivos, algunos pocos no están lo suficientemente optimizados.

Dado que el 57% de los usuarios de Internet dicen que no recomendarían un negocio con un sitio web móvil mal diseñado, el diseño receptivo es un gran negocio, y el objetivo los diseñadores necesitan hacer mucho más que “hacer que todo encaje”. Esto es lo que debes tener en cuenta:

• ¿Los objetivos tap son lo suficientemente grandes (al menos 44px de altura)?
• ¿Los objetivos tap están disponibles para los pulgares, o están fuera de su alcance?
• ¿El sitio web móvil está “recortado” para simplificar?
• ¿El sitio web se carga rápidamente en las conexiones 3G?
• En general, ¿cómo calificarías la usabilidad móvil?

Notificaciones de copyright obsoletas y enlaces rotos

Algunos pueden considerar este menor (y tal vez en términos relativos, lo es), pero los avisos de derechos de autor desactualizados, los enlaces rotos y los errores de ortografía indican que el sitio web ha sido abandonado o que se ha tomado una pequeña cantidad de cuidado. Estas cositas son especialmente importantes para las empresas SaaS porque los usuarios quieren saber que el servicio al que se están suscribiendo se mejora constantemente (es normal que los usuarios vean el aviso de copyright en el pie de página del sitio web para ver cuándo se actualizó por última vez). En términos generales, un sitio web antiguo hará que los usuarios se pregunten si ya está activo.

Es bastante fácil arreglar estas cosas, así que considérelas como “en primer lugar”.

En el caso de enlaces rotos, puede usar una extensión gratuita de Chrome como Comprobar mis enlaces para localizar enlaces rotos en una página web, o Grammarly para identificar los errores de ortografía.

Requerimientos técnicos

Según HubSpot, el 82% de los visitantes abandonan sitios que no son seguros.

Los requisitos técnicos son características que no se enfrentan al usuario; sin embargo, pueden afectar al usuario de manera drástica. SSL, por ejemplo, una capa de seguridad requerida para las tiendas de comercio electrónico (pero recomendada para todos los sitios web), les dice a los clientes que sus datos confidenciales son seguros.

Las mejoras de los códigos front-end y back-end harán que el sitio web sea más rápido (o al menos, feel más rápido), y la simplicidad del diseño en sí mismo juega un papel importante en eso (diseños simples = menos código). Para los sitios web que se rediseñan, no querrá descuidar esto.

Conclusión

El diseño trata sobre la solución de problemas los clientes quieren saber cómo los diseñadores les facilitarán la vida o cómo aumentarán los ingresos de sus negocios.

Una lista de habilidades no le dice al cliente por qué debería contratar a dicho diseñador. Los diseñadores harían un gran servicio a los clientes al comunicar por qué un rediseño del sitio web es necesario para el negocio de sus clientes, destacando lo que el resultado final logrará.

• ¿Su marca es un poco obsoleta?
• ¿La IU causa confusión entre los usuarios?
• ¿El UX hace que los usuarios abandonen el flujo de conversión?
• ¿La usabilidad (móvil o de otro tipo) hace que los usuarios presionen el botón Atrás?
• ¿Se ve horrible en todas las cuentas?
• ¿Cómo ayudarían las mejoras del sitio web a dicho negocio?

Cuando sabes lo que hay que rediseñar, y el cliente lo sabe también, la hoja de ruta para el rediseño ya tiene una base excelente y metas mensurables.

Este articulo fue escrito por Daniel Schwarz. Originalmente publicado en Toptal.

Diseño Web Brutalista, Diseño Web Minimalista y el Futuro del Web UX

¿Los sitios web se están volviendo más caóticos, desordenados y sin refinar? ¿Se están rompiendo las reglas del buen diseño? ¿La web se está poniendo fea? ¿Es esta una nueva tendencia?

Si eres como la mayoría de los diseñadores y prestas mucha atención a lo que está sucediendo, has escuchado la palabra brutalismo siendo lanzada por un tiempo. Los sitios web brutalistas se están alejando de las interfaces fáciles de usar que durante mucho tiempo han sido las mejores prácticas de la industria y en su lugar se centran en sitios HTML imperfectos y codificados a mano. Parece que los diseñadores están quitando las reglas de UX tal como las conocemos, dejando todo sintiéndose un poco caótico.

Los principios del diseño elegante y contemporáneo son tan comunes que apenas pensamos en ellos como una elección estilística. El diseño web “bueno” generalmente significa uno que obedece las reglas del minimalismo. Interfaces limpias, simples y ordenadas — pero esto no siempre ha sido el caso. Dejemos que retroceda el reloj unas décadas.

El nacimiento de la web

El diseño web ha recorrido un largo camino desde 1991 cuando se publicó el primer sitio web. La revolución de Internet comenzó con sus primeros sitios web basados ​​exclusivamente en texto utilizando la primera generación de HTML.

El primer "diseño" de sitio web que comenzó a funcionar el 6 de agosto de 1991.

Luego llegó Flash con todos esos sitios animados y locos que todos seguramente recuerdan. El desarrollo de CSS (hojas de estilo en cascada) llegó, proporcionando a los diseñadores web incluso más control sobre las mejoras como el color de fondo, el tamaño del texto y los estilos de texto en el código. JavaScript nos dio menús desplegables, navegación avanzada y formularios web con verificación de errores.

Al principio, nadie sabía lo que realmente significaba el “diseño web”, y los pioneros de la web establecían patrones de diseño por prueba y error. La era primitiva del diseño web usaba diseños que prestaban poca atención a la semántica formal y a la accesibilidad, y optaban más por la estética que por la estructura.

Sitio web de Google - 1998

Para construir y estructurar sus diseños, los diseñadores se basaron en gran medida en elementos HTML como tablas, tablas anidadas y archivos espaciadores invisibles de 1 píxel, lo que les brindó la capacidad de crear diseños más complicados de varias columnas. Hizo algunas interfaces bastante aburridas.

Sitio web de CNN.com - 2000

Sitio web de Enron - 2004

A mediados de la década de 2000, los sitios web nacieron con un pensamiento más cuidadoso detrás de su estructura. La navegación estaba en la parte superior de su navegador, y las categorías se colocaron en una barra izquierda. Las páginas web se mantuvieron cortas y angostas, con contenido distribuido en muchas páginas para no forzar a los usuarios a desplazarse. Los diseñadores aprendieron lo que funcionó y comenzaron a construir mejores sitios, estableciendo estándares y mejores prácticas en el camino.

Con más y más opciones de diseño vino una mezcla de IU ruidosas repleta de imágenes y texto en todas partes. Algunos diseñadores disciplinados, sin embargo, todavía optaron por el minimalismo.

La estética minimalista

Las tendencias de diseño van y vienen; sin embargo, el minimalismo es un lenguaje de diseño que ha estado presente en el tiempo. Es una filosofía de diseño que se centra en la simplificación de la forma, lograda mediante el uso de los elementos más simples y más esenciales en un diseño.

El minimalismo no es exclusivo del diseño web. Piensa en todos los elementos a tu alrededor que abarcan ese ideal de diseño; es fácil conectar diseños minimalistas con Nest, Apple, Herman Miller y muchos otros que han inspirado a muchos [diseñadores minimalistas] (https://www.toptal.com/designers/digital).

Nest presenta un diseño de producto simple y discreto

Un estilo elegante y minimalista es la tarjeta de visita de Apple

¿Qué hace que el diseño de Herman Miller siga siendo excelente hoy? Son simplemente objetos bien diseñados con un aspecto atemporal. Sus diseños se sientan muy bien en las casas e interiores contemporáneos, todavía se sienten frescos y modernos en la actualidad. Muchas de sus piezas están diseñadas con un aspecto minimalista y no pueden vincularse a una moda específica. Ellos todavía soportan la prueba del tiempo.

Los diseños minimalistas de uno de los diseñadores gráficos más reconocidos de su época, Josef Müller-Brockmann, son muy similares a los de Herman. Miller: atemporal. Müller-Brockmann abrazó y dominó el minimalismo durante las décadas de 1940 y 1950 bajo la forma del estilo de diseño suizo.

Cualquier decoración extraña o superflua fue eliminada de su diseño gráfico; cada elemento en sus diseños tenía un propósito. El pensamiento de diseño detrás de este enfoque es lo que hace que los diseños digitales minimalistas funcionen muy bien hoy en día.

Diseño de tipografía y póster limpio y moderno de Josef Muller Brockmann

Cómo se estableció el minimalismo en la era digital

La historia siempre encuentra una forma de alcanzarnos. Como lo hizo en el diseño de impresión, el minimalismo y la filosofía detrás de él se adaptaron al diseño web y otros artefactos digitales. Piensa en cómo se veían los sitios web hace solo un par de años con sus botones brillantes, líneas y párrafos de texto, todo gritando por atención.

Luego vino la tendencia skeuomorphic donde los diseñadores diseñaron elementos que imitaban objetos de la vida real en el espacio digital. ¿Recuerdas el relleno de cuero en iCal de Apple?

Los diseños mínimos son en realidad intencionales. Es un enfoque de diseño que elimina todo lo innecesario y se centra en los elementos que se supone que atraen la atención máxima — poniendo énfasis en el contenido.

Concentrarse en la fortaleza del núcleo de una agencia digital usando tres palabras simples - Convoy

Este diseño minimalista de comercio electrónico pone énfasis en la prenda, eliminando todas las distracciones innecesarias. - Chylak Clothing

Sin desorden adicional, los usuarios se enfocan en los elementos clave de la interfaz de usuario con el diseño de app minimalista de Investr's.

Las ventajas del diseño minimalista

El enfoque de diseño minimalista atrapado por muchas más razones que simplemente su aspecto. Nuestra mayor comprensión de los comportamientos de los usuarios, los procesos de pensamiento de diseño y el aumento de procesos de diseño de primer contenido han ayudado a hacer avanzar este pensamiento. El reciente crecimiento masivo de usuarios móviles ha sido un fuerte punto de aceleración hacia el minimalismo, con un mayor enfoque en UX y usabilidad.

Ahora que los usuarios acceden a Internet en cualquier momento, los diseñadores de productos deben enfocarse en proporcionar lo que es absolutamente esencial en el contexto del momento: el las cosas correctas de la manera correcta y en el momento adecuado, donde el diseño se reduce a sus características más fundamentales.

El uso del móvil ahora representa más de la mitad de todas las visitas web, y esta tasa solo aumentará. El diseño receptivo ha cambiado las reglas del juego y ha obligado a los diseñadores a “pensar diferente”. Hoy más que nunca, el diseño receptivo o adaptativo es una necesidad en el mundo de los dispositivos móviles, donde un enfoque de diseño minimalista es de crucial importancia.

Para el usuario promedio, el minimalismo parece ser lo más fácil de diseñar. Lograr un equilibrio perfecto utilizando la menor cantidad de contenido visual y concentrándonos únicamente en los elementos fundamentales con la máxima elegancia es realmente muy, muy difícil.

El futuro del minimalismo

Deberíamos pensar en el minimalismo como un concepto atemporal, irradiando elegancia y sofisticación, en lugar de una tendencia real o una simple fase de aprobación. Aunque atemporal y clásico, evolucionará y mejorará, como ya hemos visto desde su implementación a principios del siglo XX.

Por ejemplo, Diseño material de Google fue una de las primeras grandes evoluciones en el enfoque de diseño “plano” inspirado en el minimalismo. Los diseñadores de Google mantuvieron las cosas simples y minimalistas, pero mejoraron su lenguaje de diseño con el uso de efectos de sombras y los conceptos de movimiento y profundidad. El material abarca el diseño plano con un giro específico: imita los materiales del mundo real.

Sitio web de las guías de diseño para Material Design - Google

• 
• 
• 

La desventaja del minimalismo

Al igual que con otros elementos en la vida, siempre tenemos que mirar los pros y los contras. Muchos argumentan que los sitios web de hoy en día carecen de sabor y en su mayoría son todos iguales. Ya sabes, una gran imagen de héroe o video con texto superpuesto, una fila de iconos con texto, etc. Cualquiera puede tomar un par de minutos de su tiempo y llegar a 10 sitios que se parecen mucho entre sí. ¿Es este el reflejo de nuestro comportamiento y preferencias en línea en constante cambio?

La consistencia del diseño y el diseño para el comportamiento común del usuario es extremadamente importante en todos los diseños, pero no podemos olvidar el valor de ser únicos. ¿Nos hemos vuelto perezosos o es que hemos desviado nuestros pensamientos de la singularidad hacia una estrategia de experiencia del usuario más efectiva?

Bien ejecutado, pero carente de originalidad. Imagen de gran héroe de producto, texto y miniaturas con texto.

Brutalismo en el diseño web

“En su robustez y falta de preocupación para parecer cómodo o fácil, el brutalismo puede verse como una reacción de una generación más joven a la ligereza, el optimismo y la frivolidad del omnipresente diseño web minimalista de hoy”.

Algunos lo aman, otros lo odian, y muchos otros simplemente no lo entienden: sitios web brutalistas.

Toma Craigslist como ejemplo. Craigslist tiene que ser considerado el “abuelo” de los sitios web brutalistas. No es estéticamente agradable y nunca se presentaría en www.awwwards.com. Texto negro, enlaces azules, fondo blanco. No es lindo. No tiene que ser porque funciona — y funciona realmente bien. Encuentra lo que necesita para comprar o vender sin ningún tipo de alboroto o confusión, y sin partes móviles extrañas.

Craigslist es una masa de enlaces azules. Un esqueleto, una interfaz de usuario funcional.

Desde su fundación en 1996, Craigslist ha mantenido su popularidad a pesar de — o tal vez debido a — su diseño extremadamente utilitario. El diseño no ha cambiado de manera significativa en los últimos 20 años.

Tal vez inspirado por el ejemplo de Craigslist, el estilo brutalista está regresando. Los siguientes son excelentes ejemplos de diseños bien ejecutados que usan el estilo brutalista.

Purchase Design School muestra una galería de trabajo como una pila desordenada de tarjetas sobre un fondo granulado y degradado.

Konsept83 se inspiró en los comienzos de Internet en busca de inspiración.

Creative Show-off Utrecht usa colores vivos con un estilo de diseño brutalista.

Disposición de diseño brutalista no convencional en el sitio web de Slugz

Estos sitios web brutalistas se están poniendo de moda a lo grande. ¿Por qué estos sitios web de repente son tan populares? ¿Es porque algunos diseñadores se cansaron de la homogeneización de la web?

En los días en que el diseño de UX tiene una importancia primordial, donde el comportamiento del usuario y el enfoque de contenido primero es el rey, el UX en estos sitios es malo (intencionalmente). Contrariamente a los principios del minimalismo, estos diseños se enfrentan con collages de texto e imágenes donde el diseño está por todas partes (de nuevo, intencionalmente).

Una breve historia del brutalismo

El estilo de diseño brutalista no es nuevo. Una búsqueda rápida en Wikipedia le dirá que el estilo en realidad proviene de la arquitectura brutalista de la década de 1950 hasta mediados de la década de 1970. Es curioso que brutalismo haya sido seguido por el movimiento arquitectónico modernista donde minimalismo fue clave.

Le Corbusier fue uno de los mayores pioneros de este movimiento. Su carrera abarcó cinco décadas con edificios diseñados en Europa, Japón, India y América del Norte y del Sur.

El término proviene de la palabra francesa “brut” para “crudo”, ya que Le Corbusier describió su elección de material “béton brut”, concreto crudo. El diseño hiperfuncionalista parecía diseñado solo para proporcionar utilidad, no para agradar, como si estuviese dando la mano al modernismo.

“El brutalismo trata de hacer frente a una sociedad de producción masiva, y saca una poesía burda de las fuerzas confusas y poderosas que están trabajando. Hasta ahora, el brutalismo se ha discutido estilísticamente, mientras que su esencia es ética”. – Alison y Peter Smithson, “El Nuevo Brutalismo”, Diseño Arquitectónico (Abril de 1957)

Los diseños brutalistas rechazan rotundamente la apariencia, optando por la función sobre la forma. Los diseñadores brutalistas se enorgullecen de ejecutar diseños con el mínimo esfuerzo y los materiales más baratos disponibles, para lograr un resultado más honesto y antiburgués.

El 27 de abril de 1967, el complejo de viviendas urbanas de Safdie, conocido como Habitat 67, se inauguró en la Expo 67, la feria mundial que tiene lugar en Montreal.

Brutalismo en la era digital

Bloomberg ha adoptado el estilo a su manera para su sitio de noticias. El diseño es casi llamativo y se centra claramente en la funcionalidad sin procesar.

Página de inicio de Bloomberg

El brutalismo está haciendo un sólido regreso. Feo, crudo, sin diseños convencionales, efectos de suspense y adornos superficiales están en todas partes. Muchos puristas consideran que esta tendencia es dura, áspera, escabrosa, incómoda, conflictiva y cínica. Es. A propósito.

The Outline, una revista en línea, opta por un estilo brutalista chillón y brillante que desmiente su estilo editorial.

El brutalismo tiene un enfoque más primitivo al diseño y vuelve a centrar el núcleo del diseño web: su código. El brutalismo a menudo se representa como una tendencia de diseño “feo”, pero tenemos que mirar más allá de eso. La filosofía detrás del movimiento brutalista no es hacer que las cosas sean “feas”, sino crudas y sin adornos.

Podríamos decir que los sitios brutalistas de la actualidad se basan en la web DIY de los 90, centrándose en un enfoque de adentro hacia afuera en lugar de esconder la funcionalidad detrás de una fachada hermosa.

El diseño de la interfaz de usuario para el popular sitio para compartir en redes sociales Reddit es sin complejos cruda y cuadrada, repleta de tipografía web de finales de los 90, controles pesados no refinados y casi sin espacio para respirar de forma vertical.

Reddit apuesta por la funcionalidad, abarcando los enlaces azules brillantes de la web inicial.

El diseñador Pierre Buttin ha llevado el brutalismo a un nuevo extremo con una serie de aplicaciones móviles rediseñadas. En su último proyecto, titulado rediseños brutalistas, Buttin hace Facebook, Instagram, Twitter y otras aplicaciones populares en un estilo brutalista, con texto pesado diseños y diseños aplanados.

La aplicación móvil de Facebook rediseñada en estilo brutalista.

Estilo de diseño limpio y claro de Twitter, cambio brutalista.

Brutalismo vs. Minimalismo

El brutalismo y el minimalismo no deben verse comparativamente, sino como una nueva forma de ver las cosas y otro enfoque del diseño. El brutalismo es un impulso contra la homogeneización de los sitios y las aplicaciones actuales, pero antes los diseñadores incluso pueden comenzar a diseñar un sitio web utilizando el enfoque brutalista, primero deben saber qué reglas que van a romper.

El diseño convencional y minimalista no va a ser reemplazado por el brutalismo. Debemos considerar el brutalismo como una cultura de diseño que desafía el status quo, una cultura que está cansada de que le digan qué es “lo mejor”.

No hay ningún bien o mal al elegir entre estos estilos para su próximo proyecto. Sin embargo, antes de que se agote y diseñe su próximo sitio web o aplicación en un estilo de diseño brutalista, asegúrese de conocer a su audiencia. Asume el riesgo si crees que la compañía y tu audiencia lo apreciarán.

El diseño web brutal atrae la atención y el conocimiento de la marca está creciendo tremendamente rápido. Las reglas estan hechas para romperse. Atrévete a dejar que la web sea la web. Atrévete a destacar y ser un poco atrevido, aunque sea un poco raro.

Este articulo fue escrito por Pascal Potvin. Originalmente publicado en Toptal.