Proyecto // MeuPS — Redesign
Cómo rediseñamos el mayor portal de noticias sobre PlayStation de Latinoamerica
Contexto
MeuPS lleva más de 10 años produciendo contenido sobre todo lo relacionado con el universo gamer y es una referencia en el área.
En 2023, buscaron a Matilha para entender el mercado y pensar posibilidades de innovación. El proyecto incluyó una etapa de diseño de servicios y una de las recomendaciones fue el rediseño de la interfaz del portal, proceso en el cual participé activamente y que es el foco de este case.
Mi rol
UX/UI Designer
Timeline Design
3 meses
Ano
2023
Empresa
Matilha Estúdio
Definiendo las bases del rediseño
El primer entregable relacionado con la interfaz fue el Análisis Heurístico. Inspeccionamos todo el sitio anterior de MeuPS utilizando la metodología de Nielsen y catalogamos los hallazgos en una planilla interactiva en Notion. En paralelo, dejamos Hotjar corriendo en el sitio y, una vez finalizada la captura, los datos más relevantes fueron los mapas de calor y de clics, que nos permitieron tomar algunas decisiones de diseño.
La etapa de diseño de interfaz sería corta y, además de mí, participarían otros dos diseñadores. Por eso, era necesario un fuerte alineamiento sobre las tareas de cada uno. Para ello, creamos un sitemap detallado con todo el contenido de todas las páginas del portal. A partir de ahí, realizamos una búsqueda exhaustiva de referencias de UI, tomando como base los principales patrones visuales que estarían presentes en la interfaz.
Es un blog, pero es un blog para gamers
Una de las bases del rediseño fue construir una interfaz que transmitiera una fuerte identidad gamer. Para eso, incorporamos una tipografía principal con más personalidad e incluimos elementos visuales que remitieran a la identidad visual de PlayStation.
Dark mode
Dada la corta duración del proyecto, uno de los desafíos técnicos fue viabilizar la construcción del dark mode. Logramos optimizar todo el proceso mediante la creación de color styles semánticos y el uso del plugin Swapper (que recomiendo mucho).
*ps: el proyecto fue desarrollado antes de que se lanzara la funcionalidad de variables en Figma
Adaptación a webapp
Siguiendo su estrategia de expansión, MeuPS también necesitaba una aplicación instalable para smartphones. Por eso, a partir de la versión desarrollada para web, Matilha construyó un webapp, optimizando así los esfuerzos de diseño y desarrollo.
Desde el punto de vista de UX/UI, además de crear un área de configuraciones, también diseñamos algunos cambios en la navegación y en las interacciones.
