SIMA — Branding, web design and visual identity
Psiquea.com — Salud mental, evaluación psicológica y producto digital · SIMA
2026

Branding

Salud mental, evaluación psicológica y producto digital

Psiquea.com

Diseñamos y desarrollamos Psiquea™: una plataforma de investigación psicológica donde identidad visual, UX/UI, arquitectura funcional y desarrollo moderno crecieron juntos como un único sistema.

Cliente

Psiquea™

Año

2026

Sector

Salud mental, evaluación psicológica y producto digital

Lugar

Proyecto digital

Categorías

BrandingDiseño web UX/UI

Servicios

Plataforma digitalProducto digitalUX/UIIdentidad visualFrontendBackendNext.jsPrismaArquitectura funcionalAutenticaciónEmails transaccionalesEvaluación psicológicaResponsive

Contexto y reto

La necesidad central del cliente era construir un entorno digital fiable para un flujo muy concreto: invitar a usuarios a participar en un estudio, guiarlos a través del registro y la contextualización, y conseguir que completaran una batería de evaluación dentro de una experiencia coherente, nada burocrática y técnicamente sólida.

Cuestionario sociodemográfico como pieza estratégica

No era un formulario genérico. Debía recoger información relevante del participante antes de la evaluación, con rigor en los datos sin sacrificar claridad ni calidez en la experiencia. El flujo debía comunicar que la cuenta era necesaria para continuar, con un tono serio y humano.

Batería de cuatro test integrada en una misma experiencia

Tras el registro y la fase sociodemográfica, el usuario accedía a cuatro instrumentos de evaluación dentro del mismo ecosistema. El reto era doble: traducir pruebas complejas a una interfaz usable, y encadenar correctamente cada fase —registro, acceso, contexto, formularios, tests y área privada— sin fricciones ni rupturas de continuidad.

Psiquea.com — sistema de logotipos

Enfoque estratégico

En SIMA planteamos Psiquea™ como un proyecto donde la forma y la función debían crecer juntas. No diseñamos primero la marca para luego "aplicarla", ni desarrollamos la tecnología desconectada del sistema visual: trabajamos los cuatro frentes en paralelo, con la misma lógica de sistema que aplicamos a proyectos de identidad física.

Identidad y posicionamiento

Desarrollamos el universo visual completo: logotipo, paleta cromática, tipografía, tono gráfico, iconografía y jerarquías visuales. No para conseguir una imagen bonita, sino para construir un sistema capaz de transmitir rigor, confianza, sensibilidad humana e innovación científica simultáneamente.

Arquitectura UX orientada al flujo real

Diseñamos el recorrido del usuario desde una lógica de participación concreta: entrada desde landing o enlace de estudio, registro, validación, acceso a zona personal, cuestionario sociodemográfico y progresión hacia la batería. Cada pantalla debía reducir dudas y evitar saturación cognitiva.

Visión de producto desde el inicio

Definimos una lógica donde cada usuario no fuese solo un registro, sino un participante dentro de un contexto concreto de estudio, con progresión funcional estructurada, continuidad entre sesiones y acceso protegido a su área privada.

Base técnica como decisión estratégica

La elección de Next.js, Prisma y backend integrado no fue casual: era la base que permitía unir experiencia pública de marca, autenticación, lógica de servidor y flujos de estudio sin fragmentar el ecosistema.

Psiquea.com — psiquea landscape screen 01
Psiquea.com — psiquea landscape screen 02

Alcance del trabajo

01

Estrategia y producto

  • definición estratégica del producto digital
  • estructuración funcional del sistema de participación en estudios
  • arquitectura de continuidad del estudio por usuario
  • lógica de registro, acceso y progresión
02

Identidad de marca

  • conceptualización de marca y naming
  • logotipo e identidad visual completa
  • paleta cromática, tipografía y tono gráfico
  • iconografía consistente con el entorno científico
03

UX/UI y sistema de interfaz

  • sistema de interfaz y componentes visuales
  • jerarquías de contenido y experiencia digital completa
  • diseño responsive para todos los contextos de uso
  • lenguaje visual alineado con confianza y usabilidad
04

Flujo funcional y evaluación

  • diseño e integración del cuestionario sociodemográfico
  • integración funcional de batería de 4 test en la plataforma
  • lógica de área privada de usuario y continuidad del estudio
  • diseño de encadenamiento entre fases del proceso
05

Tecnología y desarrollo

  • frontend sobre Next.js y React
  • backend integrado en entorno Next.js
  • modelado de datos con Prisma
  • sistema de autenticación moderna y middleware de acceso
  • comunicación transaccional con branding propio mediante Resend
  • base técnica preparada para nuevos estudios y funcionalidades

Desarrollo visual del proyecto

Psiquea™ se trabajó desde la sobriedad y la precisión. La intención era construir un entorno claro, limpio y humano sin caer en códigos gráficos fríos ni en recursos poco profesionales. La percepción premium nacía de la coherencia del conjunto: tono, paleta, jerarquía, componentes y arquitectura de experiencia operando como un solo lenguaje.

Se sustituyeron los recursos visuales genéricos por un sistema de iconografía más sobrio y consistente, alineado con la identidad de marca. Toda la capa visual —branding, UI, componentes, colores, estilo editorial— fue diseñada para funcionar con la misma coherencia tanto en las páginas públicas como dentro del área privada del estudio.

Psiquea.com — psiquea landscape screen 03

Sistema, replicabilidad y profundidad

Psiquea™ no es una colección de pantallas: es una arquitectura funcional diseñada para operar. Cada módulo está conectado con los demás y responde a una lógica de producto coherente, escalable y pensada desde el principio para crecer.

Frontend público

Landing pages, páginas informativas, explicación del enfoque de investigación y acceso al registro. Aquí cuidamos especialmente la coherencia del sistema visual: cabecera global, navegación unificada, llamadas a la acción y un lenguaje de interfaz premium consistente en todos los puntos de entrada.

Sistema de autenticación

El usuario puede crear su cuenta, acceder a la plataforma y entrar en el flujo de estudio asociado. Este bloque es seguro y sencillo sin romper la continuidad del proceso ni las redirecciones necesarias dentro del flujo.

Registro contextual

No es un formulario suelto: está conectado con el propósito del estudio y con la lógica de acceso del usuario invitado. La experiencia de registro refuerza el sentido de pertenencia al proceso de investigación.

Cuestionario sociodemográfico

Recoge la base contextual del participante antes de iniciar la batería de evaluación. Fue diseñado como pieza estratégica del flujo, no como trámite: el participante entiende por qué lo rellena y cómo avanza.

Batería de test

Organiza la ejecución de los 4 instrumentos dentro del entorno Psiquea™, manteniendo coherencia de flujo y experiencia. Cada test se adapta visualmente al sistema de interfaz sin perder la integridad del instrumento evaluativo.

Área privada de usuario

Da continuidad al proceso y permite que la experiencia no dependa de una sola sesión. El usuario puede retomar su estudio, consultar su progresión y acceder a las fases pendientes dentro de su espacio protegido.

Base tecnológica

Framework

Next.js

unifica frontend y backend bajo una misma arquitectura, facilita routing moderno y ofrece una base potente para escalar producto digital serio

UI Library

React

interfaz modular, mantenible y coherente; toda la UI se apoya en lógica componible que facilita evolución y mantenimiento

Backend

Backend integrado

lógica de servidor, rutas protegidas y coherencia entre frontend y negocio dentro del mismo ecosistema, sin fragmentaciones artificiales

ORM

Prisma

modelado limpio y tipado de usuarios, sesiones, progresión, datos de formularios y lógica de estudio; base estructurada para crecer

Seguridad

Autenticación moderna

middleware de seguridad robusto con compatibilidad entre zonas públicas y privadas, continuidad de sesión y acceso protegido

Email

Resend

emails transaccionales de confirmación y onboarding con identidad de marca, fiabilidad operativa y coherencia en cada comunicación del sistema

La web

La identidad, extendida al entorno digital.

Psiquea.com es el punto de entrada a la plataforma: un entorno digital donde identidad, experiencia y arquitectura funcional conviven en una sola superficie coherente. Cada pantalla traduce el sistema visual de marca a interfaz operativa sin pérdida de criterio ni de carácter.

La experiencia de usuario fluye desde la landing pública hasta el área privada de estudio con una lógica continua. El registro, el cuestionario sociodemográfico y la batería de test tienen su propia presencia visual dentro del mismo sistema, reforzando la percepción de rigor y cuidado en cada paso del recorrido.

El resultado es un producto digital donde la forma y la función no compiten: se sostienen mutuamente. La identidad no es una capa aplicada encima de la tecnología, es parte de su estructura.

psiquea.com
psiquea.com — diseño web

Resultado y transformación conseguida

El resultado de Psiquea™ no es una web. Es una plataforma operativa que combina marca, interfaz, lógica de participación y arquitectura tecnológica moderna en un solo sistema coherente, preparado para operar y escalar.

La transformación se traduce en:

una identidad visual diferencial para un entorno que exige alta confianza

una interfaz clara y humana que reduce fricción en procesos potencialmente complejos

un flujo de participación en estudios funcional, guiado y bien resuelto

un cuestionario sociodemográfico integrado como pieza estratégica del recorrido

una batería de cuatro test accesibles dentro del mismo ecosistema visual

un área privada que da continuidad real al proceso de evaluación

una arquitectura con Next.js, Prisma y backend moderno lista para evolucionar

una base escalable para nuevos estudios, nuevas pruebas y nuevas funcionalidades

Aprendimos que...

En productos digitales sensibles, el diseño no solo mejora la percepción: también mejora la confianza, la claridad y la manera en que una persona entiende y completa una experiencia compleja. Psiquea demuestra que una plataforma bien planteada no se limita a verse bien; organiza procesos reales, reduce fricción y convierte una necesidad difusa en un sistema claro, usable y preparado para crecer. La arquitectura técnica y la arquitectura visual no son mundos separados: en Psiquea crecieron juntos, y eso se nota.

Más proyectos

Ver todos →
Todos los proyectos