Shape

Shape es la primera fase de nuestro proceso, a continuación te contamos en qué consiste.

Shape: Definiendo el proyecto

Una vez se da comienzo al proyecto con el Kick Off, entra en la fase de Shape, el lugar en el que tratamos de reducir al mínimo la incertidumbre del proyecto.

Cuenta con tres fases:

• Definición

• Concepto visual

• Diseño

En cada una de ellas, avanzamos de la mano del cliente, validando que nuestras propuestas encajan con el objetivo del cliente y que continuamos alineados. Intentamos tener una comunicación lo más constante posible para que vean avances continuamente sobre su proyecto.

Definición:

En esta fase, buscamos organizar y tratar de bajar a tierra la propuesta del cliente. En esta reunión participan habitualmente los representantes de cada una de las áreas que participa en el proyecto (Shape, Build y Data).

En esta parte del proceso, planteamos la arquitectura del proyecto y la solución técnica por la que optamos, así como entender cuáles son las necesidades del cliente y cómo podemos afrontarlas.

Esta sesión de trabajo requiere tener un conocimiento amplio de la información de los Brief proporcionados por el cliente en la pre-venta y el Kick Off, así como de hacer un breve research acerca del cliente y su ecosistema.

El objetivo es tener un Wireframe de cómo se va a estructurar la web, o en caso de un MVP un flujo de cómo se va a utilizar.

Una vez que el proyecto está definido, se valida con cliente y pasamos al Concepto Visual.

Concepto visual

En esta fase, buscamos alinearnos con el cliente para ofrecer un concepto a nivel visual que represente al proyecto.

Nos centramos en entender bien qué es lo que quieren transmitir y en buscar referencias que nos sirvan para comunicar de manera efectiva la dirección que queremos tomar en el proyecto.

Como referencia habitual realizamos una presentación con el cliente una vez definido en el que se presenta un moodboard, con referencias aplicadas al cliente, así como una propuesta de Branding de mínimos (Logo, tipografía y colores) en caso de ser necesario.

El objetivo de esta presentación es tratar de sacar información valiosa del cliente y ver si la línea visual encaja con lo que tiene en mente.

Normalmente cuando presentamos el concepto, si es posible, utilizamos Loom, una herramienta que permite grabar la sesión. Terminada la presentación, se le envía al cliente el enlace y las diapositivas, permitiendo que pueda revisarlas con tiempo y utilizar una futura sesión a compartir feedback o resolver dudas.

Para ayudar a validar y alinear con el cliente el desarrollo del resto de las páginas, se trabaja en la creación de una propuesta "fake" de cómo se vería aplicada la línea de diseño en la Home, o pantalla principal. Esta no tiene contenido real, ya que es posible que no tengamos aún todo el material del cliente.

Gracias a la creación de esta propuesta, podemos determinar varios elementos clave como la estructura, módulos, tipografía, iconografía o colores.

Diseño

Una vez que el Concepto visual está validado por el cliente, pasamos a la fase en la que diseñamos en Figma las pantallas definidas en la fase de Definición.

Una vez que el Concepto visual está validado por el cliente, nos reunimos con el equipo de Build para determinar qué es factible de diseñar y determinar el alcance basado en los tiempos que manejamos, permitiendo obtener una mayor autonomía y evitando sorpresas a la hora de maquetarlo.

Asentadas las limitaciones, pasamos a la fase en la que diseñamos en Figma las pantallas definidas en la fase de Definición además de aplicar los aprendizajes obtenidos en la simulación de la "fake home".

Trabajamos con dos documentos de Figma, por un lado el interno, donde el equipo trabaja el diseño y puede gestionar los diferentes artboards para facilitar su proceso. Cuando está completo, se trasladan las diferentes pantallas a otro documento, ordenando y presentando correctamente el flujo.

Durante el proceso de feedback, dependiendo de la madurez en diseño del cliente, se le guía y facilita para poder recoger el máximo de información y ejecutar las observaciones.

Antes de presentarle al cliente el diseño final y comenzar a maquetar, el equipo de diseño vuelve a reunirse con el líder de la squad de Build para identificar si hay algún aspecto del diseño que haya que modificar.

Una vez el diseño está aprobado y compartimos las pantallas con maquetación, se trabaja en la creación de un toolkit. Esto es una herramienta en la que recogemos todo el material utilizado en la web, desde la tipografía y sus tamaños hasta los diferentes componentes y su comportamiento. Es la concepción de un pequeño sistema de diseño.