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 031Diseño de app móvil

Habit Tracker

Una sola pantalla de inicio para una app de seguimiento de hábitos: un año dispuesto como una cuadrícula de cuadrados amarillos, con una invitación para el siguiente check-in.

Mi papel
Diseño de interfaz
Estado del proyecto
Diseño de interfaz · archivo de Figma
Portada de presentación de Habit Tracker, del archivo de diseño original.
Portada de presentación del archivo original.

01

Mi contribución

Este archivo guarda una pantalla que diseñé, el inicio de una app de seguimiento de hábitos, construido en torno a un componente de calendario. El año la recorre como una cuadrícula de cuadrados, y cuanto más intenso es el amarillo, más se hizo ese día.

Imagen de presentación con un celular que muestra la pantalla de inicio, junto al nombre Habit Tracker en letras grandes y una pequeña marca Daily Coach.
Frame de presentación con la pantalla de inicio.

02

El año de un vistazo, una acción debajo

Habit timeline encabeza la jerarquía: meses en horizontal, días en vertical, un selector de año junto al título y una leyenda de Less a More que explica los tonos de amarillo.

Debajo, una sola tarjeta convierte ese registro en el siguiente paso. “Don't lose your habit score streak” lleva directo al check-in de hoy, y el botón amarillo con un signo más, arriba, es el único otro color fuerte de la pantalla.

Pantalla de inicio con una cuadrícula anual de cuadrados amarillos de enero a junio, una leyenda de Less a More y una tarjeta amarilla sobre mantener una racha de hábitos, con un enlace al check-in de hoy.
Inicio: la línea de tiempo de hábitos arriba, el check-in de hoy abajo.
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