A muchos les parece que el diseñador es un artista caprichoso que inspira eternamente una mirada lánguida a la distancia y, a veces, ofrece discursos sinceros al cliente sobre la violación de toda su idea, porque "es este verde el que simboliza la armonía, y dos tonos más oscuros, como sugiere el cliente, ya respeto al medio ambiente ". Pero no, este es un estereotipo.
El diseño es principalmente una solución a un problema específico. Por ejemplo, el cliente se enfrenta a la tarea de aumentar la conversión del sitio, lo que significa que el diseñador hará todo lo posible para satisfacer al cliente. Si el cliente necesita un sitio memorable que despierte la confianza del usuario, el diseñador resolverá este problema de manera diferente al anterior.
En este artículo hablaremos sobre las etapas de preparación del diseño y los principios generales de trabajar con el componente visual del sitio.
El diseño no es una ola del pincel y no un vuelo de creatividad, es principalmente análisis.
Como cualquier proyecto, el trabajo comienza con la definición de la tarea principal del producto de diseño. ¿Qué necesita el cliente del sitio? Aumentar las ventas? ¿Más confianza de marca? Reconocimiento?
Cuando el cliente ha decidido la tarea principal y el diseñador comprende aproximadamente la esencia del trabajo, comienza la segunda etapa: trabajar con el público objetivo (más CA). Con mayor frecuencia, el público objetivo se determinó en la etapa de análisis y diseño, pero también es importante que el diseñador dibuje un retrato de un usuario típico, y cuanto más preciso sea el retrato, mejor será el producto final.
Veamos un ejemplo de trabajo con Asia Central. Imagine que un cliente vende ropa para niños en Internet. Conocemos su producto, sus fortalezas y debilidades, y llegamos a la conclusión de que el representante típico de Asia Central para este producto es una mujer casada, Irina, tiene unos 30 años, sus ingresos son ligeramente superiores al promedio, tiene una educación superior. Lo más probable es que, antes del nacimiento del bebé, la joven madre tuviera una carrera. Irina está de baja por maternidad y está comprometida con un niño. ¿Qué es importante para ella? Creemos que la salud y el bienestar familiar de un niño significa que el producto estará interesado en la calidad del material y el nivel de servicio. ¿Qué le interesa a Irina? Irina lee blogs de otras madres día y noche, tal vez ella misma comparte su experiencia en Internet. Ella está interesada en su hijo: cómo se desarrolla, cómo ve el mundo. La última pregunta es ¿qué podemos darle a Irina que otros no puedan?
Por lo tanto, nos estamos acercando sin problemas al análisis competitivo. El diseñador definitivamente observará los sitios de los competidores, lo que es malo para ellos y, lo más importante, lo que es bueno para ellos y cómo puede mejorarlo en casa. ¿Por qué Irina elegirá nuestro sitio, y no el sitio de un competidor? El análisis de los competidores es minucioso y detallado, desde el concepto creativo de la marca hasta el color y la disposición de los botones e íconos en la pantalla.
Cuando el diseñador se prescribe todo por sí mismo para que el producto pueda conquistar a Irina y quitarlo de otros sitios, comienza la siguiente etapa: compilar una tabla de lodo. Esta palabra compleja solo significa que el diseñador está lanzando el concepto del sitio, definido con colores, fuentes y la forma en que se presenta la información. ¿Será un sitio vibrante con colores vivos e ilustraciones pegadizas? Es poco probable, porque recordamos que Irina aprecia la calidad del producto, y puede asustarse por la abundancia de flores e inscripciones llamativas, como un intento de derrochar y "chupar" un producto de mala calidad. Recordamos que Irina tiene prisa y no tiene prisa, Irina también es inteligente y sabe cómo analizar, leerá cuidadosamente y buscará una captura. Probablemente, nuestro diseñador imaginario en esta situación elegirá colores pastel, quizás motivos de acuarela, ya que en los libros para niños, la fuente será neutral, lo que permitirá a Irina recibir información fácilmente. Las ilustraciones serán brillantes y tranquilas, probablemente llenas de ternura y afecto. Le recordamos que todo esto es solo una situación imaginaria para explicarle la esencia del trabajo. Desafortunadamente, no hay soluciones inequívocas en el diseño, y no podemos darle un principio estricto de trabajar con uno u otro público objetivo.
Al mismo tiempo, el diseñador está inspirado. Como verdadero artista, el diseñador observa el trabajo de sus colegas en sitios especiales y toma decisiones interesantes. Es decir, roba ideas. Estos pueden ser sitios con temas similares, pueden tener un enfoque completamente diferente, pero cualquier solución interesante e inusual puede darle al sitio un punto culminante y se convertirá en el factor por el cual Irina no irá a un competidor y comprará nuestro producto. Pero si lees hasta este punto, te frotas las manos y decides que solo copias el sitio que te gusta y vives feliz para siempre, nos apresuramos a molestarte, lo más probable es que simplemente no funcione. En otro sitio, el usuario principal no es Irina, sino Svetlana, y aquí hay una historia completamente diferente. No, el diseñador simplemente toma nota de los detalles y los ajusta cuidadosamente en su proyecto.
Además, el diseñador procede al trabajo directo en programas especiales. De hecho, el trabajo incluye un dibujo completo de cada página única en el sitio. Por supuesto, la mayoría de las veces va a la página principal, porque esto es lo primero que ve el usuario y es aquí donde se forma su actitud hacia el producto. Esto se convertirá en el concepto de diseño de todo el sitio.
Cualquier bloque, cualquier detalle del diseño debe tener un significado. Un diseñador es una persona tan loca que constantemente se pregunta: ¿por qué estoy haciendo esto? ¿Por qué estoy oscureciendo el botón? ¿Por qué estoy usando esta foto y no otra? ¿Por qué en el pie de página pongo el ícono VK primero, luego el FB, y solo entonces OK, y no en un orden diferente? Y si la respuesta no aparece, es mejor abandonar inmediatamente la decisión, porque, sin embargo, el diseño no es una imagen, ya que existen criterios de evaluación claros.
¿Has escuchado la palabra KPI? Por lo tanto, no se aplica a ninguna obra de arte; por ejemplo, es estúpido decir que la obra maestra de Miguel Ángel ha aumentado la asistencia a la Capilla Sixtina y es una herramienta eficaz para atraer a nuevas personas. Pero para el diseño, la mayoría de las veces hay KPI muy específicos y, por lo tanto, el trabajo puede y debe evaluarse.
Existe una gran cantidad de literatura sobre diseño web con reglas y principios interminables. De hecho, todo depende del sitio y la tarea específicos, pero hay varias reglas generales:
1. El principio de contraste
Esto se aplica a todos los elementos del sitio. Cuanto más bajo es el contraste, más difícil se percibe y separa la información. Debido al contraste, puede resaltar algunos detalles y ahogar otros, crear una jerarquía de páginas web y enfocar al usuario en los elementos más importantes.
2. El principio de énfasis
Este artículo está estrechamente relacionado con el anterior. La colocación adecuada de los acentos es una garantía de la efectividad del sitio. Lo principal aquí no es dejarse llevar, sino comprender claramente en qué poner énfasis, porque si se destaca todo, se perderá toda la idea.
3. El principio de uniformidad y repetición de elementos.
Este principio parece obvio, pero requiere una mención por separado. La repetición de elementos y la gama de colores, el método de alineación, el tamaño de fuente, el espaciado de línea, la sangría y el ángulo de curvatura de ángulo: todo esto crea la misma uniformidad que facilita al usuario trabajar con el sitio y confunde si se viola este principio. Por ejemplo, lee un artículo en un sitio de información y sabe que la flecha hacia atrás en la parte inferior de la página lo enviará de regreso a la página principal. Ahora imagine que no está leyendo un artículo, pero está viendo todos los artículos de una sección, desea volver a la página principal, pero no encuentra la flecha hacia atrás. O lo encuentras, pero no en otro lugar. Solo está desconcertado, irritado e incluso puede provocar que te vayas a un sitio de la competencia más conveniente.
4. Alineación en rejillas modulares.
Este elemento suena aterrador, pero de hecho es solo el principio de alinear y dividir la página en bloques. Una cuadrícula modular es una herramienta que ayuda a alinear los bloques entre sí y organizarlos de manera uniforme y limpia. A continuación se muestra un ejemplo típico de uso de una pila modular para alinear elementos:
5. El principio de facilidad de percepción de la información.
Este párrafo resume, por así decirlo, todo lo que discutimos anteriormente. El hombre es una criatura conservadora y trata todas las innovaciones con precaución y actitud negativa de antemano, especialmente cuando los cambios no se incluyeron en sus planes. Existen las formas habituales de obtener información, por ejemplo, la mayoría de las veces los usuarios leen la página de izquierda a derecha de arriba a abajo. No haga que el usuario se pierda en el flujo de información y realice acciones innecesarias.
Además, una persona es una criatura perezosa, y demasiada información textual puede confundir a cualquier usuario. Compare dos formas de enviar el mismo texto:
Este ejemplo muestra claramente cómo el diseño del texto afecta la percepción. Por alguna razón, es más fácil para nosotros leer el texto en el segundo caso, aunque el texto y su volumen son los mismos aquí y allá.
Por supuesto, en los sitios que reciben bonos de Internet y rompen todos los registros de KPI, puede ver una violación de casi todos estos principios, pero aquí es donde radica el progreso. El diseñador monitorea constantemente las nuevas tendencias en digital y experimenta con diferentes soluciones.
Un diseñador no trabaja solo, sino en estrecha colaboración con equipos de diseñadores, diseñadores de diseño y programadores, porque cualquier especialista puede tener una buena idea, y recordamos que cada pequeña cosa puede ser crucial para el éxito de su futuro sitio.