Amor no es Control
Amor No Es CTRL is a conceptual project developed as a digital awareness campaign against gender-based violence in young people’s relationships and online environments.
The aim of the project was to create a visual and informative platform capable of communicating warning signs, support resources and helpful content through an accessible, relatable and emotionally impactful experience.
The proposal combines visual design, user experience and social media to transform sensitive information into a clear, accessible and awareness-raising experience.
UX/UI Designer — investigación, arquitectura de información, UI y sistema de diseño
8 semanas
Proyecto individual
Investigación · Arquitectura de información · Flujos · Wireframes · Sistema de diseño · Prototipo de alta fidelidad
El problema
Desde el usuario
Las señales tempranas de control en una relación no se reconocen como violencia. Revisar el móvil, exigir ubicación en tiempo real o decidir con quién se puede hablar se interpretan como muestras de interés, no como abuso.
Eso genera un problema de entrada: la persona que más necesita esta información no se identifica con la palabra «víctima» y, por tanto, no busca ayuda. Llega buscando respuestas a una duda concreta, no un recurso contra la violencia de género.
A eso se suma una barrera crítica: muchas de estas consultas se hacen desde un dispositivo al que la pareja tiene acceso. Informarse conlleva un riesgo real.
Desde el negocio
Una campaña de concienciación solo cumple su función si la persona permanece el tiempo suficiente para llegar al contenido útil. El reto no era comunicar la gravedad del problema —eso ya lo hacen las campañas institucionales— sino conseguir que alguien que no se reconoce en el mensaje no abandone en los primeros segundos.
El objetivo era maximizar la permanencia y la profundidad de lectura de un público que llega dudando, no buscando ayuda, y hacerlo sin comprometer su seguridad.
Restricciones del proyecto
- Proyecto conceptual: sin acceso a analítica real ni a datos de usuarias
- Tema sensible: las pruebas con usuarias reales tenían límites éticos claros
- Sin presupuesto para investigación formal ni incentivos a participantes
- Requisito autoimpuesto: la plataforma debía funcionar sin pedir ningún dato personal
Necesidades del cliente
Communicate clearly and accessibly
Design an experience that conveys sensitive information in a clear, visual and user-friendly way for different user profiles.
To create an emotional impact
To create a visual identity that would resonate emotionally with a young audience, whilst striking a balance between aesthetics, legibility and usability.
To provide access to support and resources
Organise content, warning messages and support contacts quickly and intuitively to prioritise accessibility and user guidance.
Investigación
Análisis de 6 plataformas de referencia (institucionales y del tercer sector) y revisión de guías de seguridad digital para víctimas.
Sara González, 17
StudentProfile
He combines his secondary school studies with healthy escapist activities such as reading and sport (running). His family environment is heavily fragmented by a dynamic of hostility, and at the same time, he experiences a romantic relationship based on digital and behavioural control.
Pain points
Constant panic that their partner or family environment will detect their browsing history, messages, or use of support platforms, which could trigger a violent reaction or further isolation. The boyfriend acts as the main psychological obstacle; the fear of the consequences of breaking up the relationship or facing his direct reaction overrides their initiative.
Víctor Aranda, 21
StudentProfile
University student with an analytical profile and a healthy, independent social life. Acts as an external sensor within the victim's circle. Capable of identifying micro-warning signs (mood changes, phone dependency, social isolation from their friend) and takes moral responsibility to intervene safely.
Pain points
Lack of certainty about how to intervene correctly. Fears that a wrong or too direct action will alert the aggressor, put her friend in danger, or cause her to distance herself from him permanently.
La decisión difícil
La decisión más difícil fue renunciar al impacto visual inmediato.
Una campaña de concienciación se juzga, casi siempre, por lo contundente que resulta su imagen. La paleta oscura y el alto contraste funcionan muy bien en un porfolio y en redes sociales. Pero en las pruebas, ese mismo impacto delataba el contenido de la pantalla y hacía que la plataforma no se pudiera abrir en público, que es justo donde muchas usuarias la necesitan.
Prioricé la seguridad y la permanencia sobre la contundencia visual. Es una decisión que hace el proyecto menos espectacular en una captura y más útil en uso real, y la defiendo: una campaña que no se puede abrir no comunica nada.
Sistema visual
Estados contemplados
Fijo y visible en todas las pantallas; un clic lleva a una página neutra y sustituye la entrada del historial
El contenido esencial de recursos de ayuda se mantiene accesible; el resto avisa sin bloquear la pantalla
Nunca deja la pantalla vacía: ofrece las situaciones más consultadas y el acceso directo a recursos
Placeholders con la estructura del contenido, sin animaciones llamativas que atraigan la atención ajena
Accesibilidad
- Contraste verificado contra WCAG AA en todas las combinaciones de texto y fondo, incluida la paleta suave.
- Salida de emergencia accesible por teclado y primera en el orden de tabulación: si el riesgo es real, no puede depender del ratón.
- Jerarquía de encabezados correcta para permitir la navegación por lectores de pantalla y el salto entre secciones.
- Áreas táctiles de 44px mínimo, pensadas para uso con una mano y con prisa.
- Sin contenido que dependa solo del color para transmitir su significado.
- Animaciones respetuosas con prefers-reduced-motion.
Resultado
Al tratarse de un proyecto conceptual, no hay datos de producción. Lo que sí se validó en pruebas con usuarias:
- La salida de emergencia pasó de no encontrarse a localizarse de forma inmediata tras sacarla del menú.
- Reorganizar la home por situaciones reconocibles eliminó la reacción de «esto no va conmigo» que aparecía con el manifiesto inicial.
- Eliminar el registro previo retiró la barrera que más desconfianza generaba en las pruebas.
En plataformas comparables, retirar el registro previo al primer contenido de valor es una de las intervenciones con mayor impacto sobre la retención de primera visita.
Del diseño al desarrollo
Documenté el sistema en Figma con componentes, estados (normal, hover, focus, error) y tokens de color, tipografía y espaciado. El contraste se verificó contra WCAG AA en todas las combinaciones de texto y fondo, incluida la paleta suave, que es donde más fácil es fallar.
Al trabajar habitualmente con HTML y CSS pude anticipar el comportamiento responsive y la jerarquía de encabezados desde el propio diseño, en lugar de dejarlo como una decisión de implementación. La salida de emergencia se especificó también a nivel de comportamiento —foco, orden de tabulación y sustitución del historial— porque su valor depende por completo de cómo se construya.
Qué aprendí
Diseñé las pantallas antes de entender del todo el contexto de uso. La salida de emergencia, que acabó siendo la decisión más importante del proyecto, apareció tarde, cuando la arquitectura ya estaba cerrada, y obligó a rehacer la navegación.
Hoy empezaría por mapear el contexto de riesgo —dónde, con quién y en qué condiciones se usa el producto— antes de abrir Figma. En productos sensibles, el contexto de uso es una restricción de diseño tan dura como cualquier requisito técnico, y tratarlo como un detalle de implementación sale caro.
También asumí durante demasiado tiempo que el lenguaje institucional era el correcto por ser el estándar del sector. Cuestionarlo antes me habría ahorrado una iteración completa.
SG Gallery
