Comenzamos definiendo su propuesta sobre Flying Papers como representante de una comunidad diversa, vívida y global, unida por su interés en el cannabis. Esto llevó a que Flying Papers fuera un boleto para los curiosos.
Build in Amsterdam, agencia de branding.
En este artículo vamos a analizar la interfaz de la página web e-commerce de la marca “Fly Papers”. Esta es una marca belga de productos para el consumo de cannabis tanto recreativo como médico. Si bien se encuentra en el mercado desde 1994, fue en el año 2015 que adoptaron el nombre de “Fly Papers” y recién en 2022 crearon desde cero el diseño completo de la misma. Por lo que en relación al diseño y composición que porta la marca actualmente, se encuentra muy influenciada por las tendencias de diseño recientes como lo son el “Soft Pop” y la incorporación de animaciones, modelos 3D y 360º de los productos.
El primer punto a analizar de la interfaz es la legibilidad de los textos por sí mismos. El primer error lo detectamos al momento de pasar la página de inglés a español. En ENG, utilizan en los textos una interlínea muy reducida que funciona, y en SPA, esta interlínea se mantiene igual, con el fin de que el diseño no cambie y se mantenga lo más parecido a la original. Pero esta decisión no es buena, en relación a los signos ortográficos propios del idioma español, como lo son las tildes o el uso de signos de interrogación al principio y al final de la pregunta realizada.
Por ejemplo, las tildes con la interlínea reducida hace que estas se superpongan totalmente con la línea de texto superior, y queden totalmente ilegibles. Además de afectar la morfología de los caracteres donde se está superponiendo.
El segundo punto es cómo se relaciona el texto con los elementos presentes, que en este caso son imágenes ilustrativas. Nuestro primer acercamiento con la interfaz fue en desktop, el texto nos pareció legible pero no para una lectura rápida, ya que te vas encontrando con distintas animaciones a medida que avanzas que pisan partes del texto, y te obligan a ir leyendo por debajo de las mismas. Estas animaciones, que nos acompañan durante todo el recorrido de la interfaz, no están tímidas allí, sino que tienen un tamaño apropiado teniendo en cuenta también la escala de la tipografía empleada en el texto.
Que la tipografía se encuentre grande y en variante bold ayuda a que resalte, y no sea una competencia entre el texto y las animaciones. Se encuentran ambas en punto de complementación y equilibrio.
Por ejemplo, si esta misma tipografía se encontrara del mismo tamaño pero en variante light o regular, la relación sería muy diferente. Ya que la tipografía se perdería y la animación captaría toda la atención.
Cuando vimos la página en su versión mobile, fue una experiencia totalmente diferente a la desktop. Las animaciones que en desktop ya se encontraban de un buen tamaño, en mobile se mantienen en una escala similar. El problema de que el tamaño se mantenga igual alli, radica en que el texto en relación a la escala de estas animaciones parece más chico, y ya pasan a taparse líneas enteras de texto, y no solo un par de caracteres como sucedía en desktop.
Que esta situación suceda en ciertos lugares donde el texto predomina sobre la ilustración, como por ejemplo las preguntas que se le van haciendo al usuario a medida que navega por la interfaz, es molesta. A diferencia de la tienda, por ejemplo, donde el modelo 3D del producto también tapa un texto pero este ya se presenta en un segundo plano, lo que importa más es producto para acercarlo más al usuario y no el texto que atrás contiene.
Para concluir, creemos que el diseño es muy llamativo y creativo, pero hay varios errores, que por más que la interfaz en general sea llamativa, no se pueden pasar por alto, debido a que, en cierta medida, afectan la experiencia del usuario que la está navegando.
https://www.flyingpapers.com/es: ¿Un diseño que te eleva? https://www.buildinamsterdam.com/case/flying-papers: ¿Un diseño que te eleva? https://blog.adobe.com/es/publish/2022/03/20/soft-pop-una-explosion-de-monerias: ¿Un diseño que te eleva?