Ntas del curso:
Por que es importante definirlos?
- Evita duplicar componentes y procesos
- Elementos que necesitas para resolver el problema mas rapidamente
A medida que nuestro proyecto evoluciona los patrones evolucionan tambien, aunque el comportamiento y el objetivo final sea siempre el mismo. Por eso es tan importante establecer cuales son esos patrones desde el principio, porque de esta manera evitaremos duplicar componentes y procesos, ya que si hemos establecido los patrones core de nuestro producto y los tenemos documentados sera mucho mas simple ir a buscarlos y adaptarlos al problema que estamos intentando resolver.
Ademas cuando no establecemos desde el principio esos patrones clave se puede caer en la tentacion de ir improvisando con multiples formas de resolver un mismo problema, con el coste de mantenimiento de cada uno de esos elementos que ello conlleva.
Patrones funcionales:
- Mapa de patrones
Claridad en comportamientos generales y acciones a reforzar del producto.
Para comenzar: Tener claros los comportamientos generales y las acciones que queremos reforzar en nuestro producto.
Conocer a la clientela:
- Sus necesidades
- Sus metas
- Sus motivaciones.
Como cuando hacemos un “customer journey”
A veces perdemos la conexion entre los comportamientos y los patrones exactos a traves de los que se manifiestan; por eso es tan fundamental establecer un mapa, porque es el lugar en los que dejamos claros los aspectos claves de la plataforma y los relacionamos con los patrones y los componentes que los representan. No hace falta ir al detalle, pero si trabajar con los bloques mas relevantes.
- Aspectos claves del producto
- Patrones y componentes.
Ejemplo:
Las motivaciones de nuestros usuarios son:
- Analisis: Tablas, KPIS y graficas
- Exploracion: Buscadores, filtros e iconos
- Logros: etiquetas de estado, mensajes de aviso, descargas.
Cuales patrones funcionales representarian estos elementos?
Este mapa ayudara a relacionar cada elemento del sistema con uno de los patrones funcionales generales de la plataforma
- ASIGNAR ACCIONES.
Se puede entender el propósito de un patrón (lo que hace y lo que no), focalizandose en lo que hace el elemento en si y no en lo que es.
Se trata basicamente de encontrar acciones que describan el comportamiento para el que esta generado ese patron y de que le asignemos siempre un proposito sin que este sea especifico para un unico caso.
Ejemplo:
Nombre de header, podemos llamar a este elemento “imagen del header” pero hace que sea especifico en exceso y podemos acabar generando elementos muy parecidos para otros lugares de la pagina web. Es mejor si le asignamos el proposito que tiene a modo de accion, como puede ser: promocion de articulos.
De esta fomra tendremos como beneficio:
- La comprension del proposito del patron
- Generalizar los casos de usos
- Evitar duplicidades o patrones muy similares
- DIBUJAR LA ESTRUCTURA DE CONTENIDO.
Wireframming - Sketching de baja fidelidad - Patrones
Dibujar todo lo que debe contener nuestro patron, para funcionar de forma efectiva y representar el comportamiento de tus usuarios
Que elementos necesita tu patron para funcionar de forma mas efectiva?
Genera una lista del contenido
Ejemplo: imagen representativa, titulo descriptivo impactante y boton CTA
Ahora que ya se sabes lo que se necesita...
- Hay que definir la jerarquia
- Dibujar varios formatos
- Elegir el que mejor encaje con los principios de tu sistema
- GENERAR UNA ESCALA DE PATRONES.
A veces si que es interesante definir varios elementos que resuelvan el mismo problema.
Importante definir la jerarquia entre ellos y en que caso utilizaremos cada uno.
Ejemplo:
Puedes tener varias formas de representar un dato relevante, dependiendo de donde nos encontremos en la interfaz.
Objetivo principal
- Definir bien el caso de uso de cada variante de ese patron.
Patrones perceptivos:
En algunos casos, y sobre todo dependiendo de la magiìnitud del proyecto o de la empresa en la que estamos trabajando varios de estos patrones pueden venir definidos desde:
- Departamento de Marketing: como podrian ser los logotipos, colores, tipografias, y tono
- Segun la necesidad del producto, como el espaciado y el layout.
De cualquier manera para nuestro caso, vamos a establecer todos lo elementos por nuestra cuenta y para ello tambien podremos utilizar diferentes tecnicas.
- GENERAR UN USER PERSONA.
Pero no sera cualquier “User-persona” “Designing for emotion, Aaron Walter - Este tipo de persona sera especial porque tendra las cualidades clave que deseariamos que tuviera nuestra marca , esto nos ayudara a presentar fisicamente la personalidad de nuestro producto
A la hora de elegir nuestra imagen representativa, debemos plantearnos por ejemplo que queremos que nuestro producto sea
Ejemplo:
Producto serio, pero no aburrido.
Completo, pero no complicado
Que persona representaria estas cualidades?