Introducción

Para realizar esta plataforma de atención psicológica online partimos definiendo los objetivos y un pequeño brief, estos resumen los requerimientos del cliente y las necesidades de los usuarios. A partir de esto, iniciamos el proceso de diseño y desarrollo.

En esta presentación, con el fin de optimizar tiempo y recursos, se muestra únicamente el perfil de pacientes, ya que mi participación se centró principalmente en la interfaz de usuario (UI). Los demás perfiles mantienen la misma línea gráfica y principios de diseño establecidos en este.

Como Diseñador UI, participé en la organización de contenidos, definición de flujos de usuario, maquetación, creación del sistema de diseño y el desarrollo conceptual de la propuesta. Considerando siempre un enfoque en la usabilidad, jerarquía visual y consistencia, buscando alcanzar altos estándares de experiencia de usuario.

Descubrir y Definir

Objetivo

Con el fin de garantizar una experiencia de usuario completa que promueva el acceso universal y equitativo a la salud mental, que asegure calidad, profesionalismo y facilidad de uso, se definieron los siguientes objetivos:

Facilitar el acceso a la salud mental

Realizar una plataforma digital intuitiva y segura para conectar pacientes con psicólogos certificados

Optimizar la experiencia digital

Realizar una plataforma digital intuitiva y segura para conectar pacientes con psicólogos certificados

Ofrecer atención una flexible

Realizar una plataforma digital intuitiva y segura para conectar pacientes con psicólogos certificados

Garantizar calidad y profesionalismo

Realizar una plataforma digital intuitiva y segura para conectar pacientes con psicólogos certificados

Brief

Situación

Miles de personas jovenes buscan una solución rápida, cómoda y eficiente para poder tratar y consultar trastornos mentales.

Motivación

Los trastornos mentales están en aumento debido al ritmo vertiginoso de la sociedad actual.

Mejora

Queremos que el 10% de las sesiones de psicología en el país se realicen de manera remota, para mejorar la eficiencia y comodidad del paciente.

Límites

El presupuesto se ajusta a la investigación, diseño, desarrollo y soporte inicial.

“ Miles de personas jovenes buscan una solución rápida, cómoda y eficiente para poder tratar y consultar trastornos mentales, Los trastornos mentales están en aumento debido al ritmo vertiginoso de la sociedad actual, Queremos que el 10% de las sesiones de psicología en el país se realicen de manera remota, para mejorar la eficiencia y comodidad del paciente, El presupuesto se ajusta a la investigación, diseño, desarrollo y soporte inicial.”

Desarrollar

Site map

Diagrama que muestra el mapa del sitio con la jerarquía de páginas y secciones principales

App architecture

Diagrama que muestra la arquitectura de la aplicación con la jerarquía de páginas y secciones principales

User flow

Flujo que tiene que seguir el usuario para agendar una hora con un profesional.

Diagrama del flujo de usuario con los caminos y acciones posibles para agendar

Wireframes

Selección de wireframes que representan algunas de las pantallas principales del proyecto.

Wireframes en formato de escritorio Conjunto de wireframes en formato móvil

Identidad visual

Se escogió una tipografía moderna con remates redondeados que transmite seriedad y calidez, favoreciendo la legibilidad y la claridad.

La paleta de colores refuerza estos conceptos, manteniendo la coherencia visual y consistencia con la identidad de marca.

Representación gráfica de la tipografía del proyecto Montserrat Alternates
Solar yellow
  • hex - #FFC24F
  • hsl - 39 100 65
  • rgb - 255 194 79
Serene mind
  • hex - #367B86
  • hsl - 188 43 37
  • rgb - 54 123 134
Icono de la aplicación en un teléfono móvil Logotipo de Psys

Entregar

UI Kit

A continuación se muestran algunos de los componentes principales que forman parte del sistema de diseño, con estos logramos mantener la coherencia visual y funcional de toda la plataforma.

Buttons

Medidas de los botones en sus diferentes tamaños 4 estados de los botones

Navigation

Barra de navegación web desplegada de Psys Barra de navegación de la aplicación móvil de Psys Navegación local y barras tipo pestaña de Psys

Footer

Pie de la página web de Psys

Cards

Cards webs y mobile de psys

Resultado

Muestra representativa del diseño final, donde se aplicaron los elementos visuales para potenciar la experiencia del usuario.

Vista del resultado final donde se muestra varias pantallas de escritorio y móvil sobre un fondo verde oscuro

Conclusión y aprendizajes

En este proyecto aprendí la importancia de planificar una arquitectura sólida basada en los requerimientos del cliente y las necesidades de los usuarios. Construimos una relación de sinergia con el equipo de desarrollo, lo que permitió un avance fluido y coordinado en todas las etapas.

El proceso fue exigente pero enriquecedor. Pude aplicar y reforzar conocimientos clave sobre diseño de interfaces, especialmente en un ámbito tan sensible como es el de la salud mental. Este proyecto me permitió crecer profesionalmente al enfrentar desafíos reales con impacto humano.

Proyecto anterior
App de transporte compartido