Arrastra para explorar. Desplázate o pellizca para acercar. Abre la Ayuda para ver los atajos de teclado.

Yan
ABIERTO A
PROYECTOS
Hablemos
Yan Fontão Boring view
All work

Case 028Diseño de app móvil

Heartbeat

Un concepto de app de salud que parte de una frustración de un usuario ficticio: muchos datos en bruto y ni una palabra sobre lo que significan. Combina un mapa de su experiencia con pantallas que convierten las lecturas en un estado simple.

Mi papel
Flujos de producto y diseño de interfaz
Estado del proyecto
Concepto de app móvil · archivo de Figma
Mockup de heartbeat armado para este mural a partir de pantallas reales del proyecto.
Mockup armado para este mural a partir de pantallas reales del proyecto.

01

Mi contribución

Heartbeat es un concepto de app móvil de salud. Su descripción en el archivo pide poca entrada de datos, una visión clara del estado de salud de una persona y alertas por síntomas de Covid.

Diseñé las pantallas en torno a John, un usuario ficticio, y todas las lecturas son datos de ejemplo.

Grabado del prototipo de Figma. Una pantalla de reloj redonda: la frecuencia cardíaca y luego una breve revisión de síntomas.

02

De los datos en bruto a una respuesta simple

El concepto empieza con un mapa de John en seis etapas, desde la búsqueda de apps hasta compartir una. Su punto más bajo llega cuando prueba las apps existentes y ve que están dirigidas a personas sanas que registran entrenamientos, latidos y presión arterial, sin ninguna respuesta sobre lo que significan los números.

Ese vacío define la jerarquía de las pantallas. Home empieza con la frecuencia cardíaca junto a un estado de salud en una sola palabra, seguida de una línea de tiempo que marca cada punto con una cara en lugar de un valor.

Pantalla Home que saluda a John, con una frecuencia cardíaca de 126 bpm junto al estado de salud Neutral y una curva verde en la línea de tiempo marcada con caras de emoji.
Pantalla My health con un resumen de estado y tarjetas oscuras de presión arterial y tos, cada una con el nivel de la persona comparado con el rango normal y un enlace a Details.
Home: una lectura, un estado en una sola palabra y una línea de tiempo de caras. Datos de ejemplo. My health: cada problema compara el nivel de la persona con el rango normal. Datos de ejemplo.

03

Cuando una lectura requiere atención

My health enumera cada problema con el nivel de la persona junto al rango normal, así que la comparación queda en la propia tarjeta y Details está a un toque.

Tabla que sigue a un usuario ficticio a lo largo de seis etapas, con filas de descripción, canales, objetivos, emociones y pensamientos, y una curva que sube de decepcionado a feliz.
Mapa de experiencia de John, un usuario ficticio. Las citas forman parte del arquetipo de usuario.
000

Instrucciones

Yan Fontão
Toque
Abre una pantalla
Clic
Abre una pantalla
Arrastrar
Recorre el mural
Rueda
El mouse acerca, el trackpad mueve, el pellizco acerca
− +
Aleja hasta ver todo el mural, o acerca
Flechas
En un caso: ↑↓ cambian de caso, ←→ cambian de medio. En el mural: mueven
Espacio
Abre o vuelve
Enter
Abre
Esc Backspace
Vuelve
Home
Vuelve al centro y luego a la apertura
PgUp PgDn
Canal anterior o siguiente
Tab
Recorre proyectos y enlaces
R
Proyecto al azar
0–9
Escribe un canal, 1–61
?
Esta página
Atajos

Música del mural

Archivos comprimidos y nivelados para la web.

ABIERTO A
PROYECTOS
Hablemos

Nuevo mensaje para Yan

Cuéntame quién eres y te respondo.

000

Sobre Yan

Hola, soy Yan

Product Designer/ Design Engineer

La mayoría de los productos pierde algo entre el diseño y el código. Los míos no: investigo el problema, diseño el producto y lanzo la interfaz yo mismo, así que lo que apruebas es exactamente lo que reciben tus usuarios.

  • 2018inicio en software
  • UI + codediseño e implementación

Trabajé con Motorola · Ambev Tech · Rei do Pitaco · OneTool · CESAR

Brasil · Remoto, híbrido o presencial

Retrato de Yan Fontão sentado, con suéter verde y gafas, sosteniendo un micrófono.
ABIERTO A
PROYECTOS
Hablemos
ABIERTO A
PROYECTOS
Hablemos
000

canal bloqueado

Bajo NDA

Ingresa el código

Pídele el código a Yan ↗
ABIERTO A
PROYECTOS
Hablemos
YAN FONTÃO Casos completos