Family Project - CoderHouse
Family Project - CoderHouse
Family Project - CoderHouse
Project description: This project was developed as the final assignment for the intensive UX/UI Design course at "Coder House." It showcases the complete development process of the mobile app, from its initial concept to its final implementation, highlighting its evolution step by step.
Project type: UX/UI Design.
Date: 2023.
Lorem ipsum dolor (0.8em)
Lorem ipsum dolor (1em)
Lorem ipsum dolor (1.25em)
·Primario
·Primario
·Primario
·Secundario
·Secundario
·Secundario
AAA
AAA
AAA
900
#3455DB
AAA
AAA
AAA
900
#7189EB
·Primarios
·Primarios
2.01
2.01
2.01
300
#C2E2F5
4.01
4.01
4.01
400
#79A9F5
4.01
4.01
4.01
400
#4B7BF5
·Error
·Error
2.01
2.01
2.01
300
#F5C2C2
4.01
4.01
4.01
400
#FF7373
4.01
4.01
4.01
400
#F3373B
·Grises
·Grises
2.01
2.01
2.01
300
#EFEFEF
2.01
2.01
2.01
300
#555555
2.01
300
#353535
Colores
Colores
Colores
Tipografía
Tipografía
Tipografía
Lorem ipsum dolor (0.8em)
Lorem ipsum dolor (0.8em)
Lorem ipsum dolor (0.8em)
Lorem ipsum dolor (0.8em)
Lorem ipsum dolor (0.8em)
Lorem ipsum dolor (0.8em)
Texto: SF Pro
Lorem ipsum dolor (1.563em)
Lorem ipsum dolor (1.563em)
Lorem ipsum dolor (1.563em)
Lorem ipsum dolor (1.25em)
Lorem ipsum dolor (1.25em)
Lorem ipsum dolor (1.25em)
Lorem ipsum dolor (1.25em)
Lorem ipsum dolor (1.25em)
Lorem ipsum dolor (1.25em)
Lorem ipsum dolor (1em)
Lorem ipsum dolor (1em)
Lorem ipsum dolor (1em)
Lorem ipsum dolor (1em)
Lorem ipsum dolor (1em)
Lorem ipsum dolor (1em)
Lorem ipsum dolor (1.563em)
Lorem ipsum dolor (1.563em)
Lorem ipsum dolor (1.563em)
Lorem ipsum dolor (1.953em)
Lorem ipsum dolor (1.953em)
Lorem ipsum dolor (1.953em)
Lorem ipsum dolor (1.953em)
Lorem ipsum dolor (1.953em)
Lorem ipsum dolor (1.953em)
Lorem ipsum dolor (2.441em)
Lorem ipsum dolor (2.441em)
Lorem ipsum dolor (2.441em)
Lorem ipsum dolor (2.441em)
Lorem ipsum dolor (2.441em)
Lorem ipsum dolor (2.441em)
20 px
20 px
20 px
16 px
16 px
16 px
12 px
12 px
12 px
25 px
25 px
25 px
31 px
31 px
31 px
39 px
39 px
39 px
Tamaño de texto
Tam txt
Tam txt
23 px
23 px
23 px
19 px
15 px
29 px
37 px
37 px
37 px
46 px
Altura de linea
Alt lin
Alt lin
Iconografía
Iconografía
Iconografía
Iconos B&N
Iconos B&N
Iconos B&N
Iconos Sociales
Botones
Botones
Botones
Add
Escojer
Día
CONTINUAR
Basura
Lunes
12
Registrate
Registrate
Elementos chicos
Elementos chicos
Elementos chicos
12
Lunes
Martes
Abril
13
14
MIercoles
15
Jueves
16
Viernes
Tareas completadas
Tareas pendientes
Recompensas obtenidas
25
87
42
Juan
Recompensas obtenidas
42
Escojer
Guidelines
Guidelines
Guidelines
iPhone 375px
^ Control
+
G
16px
16px
16px
16px
Desktop 1,280px
Desktop 1,280px
^ Control
+
G
32px
32px
32px
32px
32px
32px
32px
32px
32px
32px
32px
32px
¿Qué está
pasando?
#UNO
Cumple con la ley pero se podrian agregar mas componentes como cuando iniciamos sesión por primera ves.
Visibilidad del Estado
del sistema
Cumple
Cumple
Cumple
¿Qué está
pasando?
#UNO
Cumple con la ley pero se podrian agregar mas componentes como cuando iniciamos sesión por primera ves.
Visibilidad del Estado del sistema
Cumple
Cumple
Cumple
¿Qué está
pasando?
#UNO
Cumple con la ley pero se podrian agregar mas componentes como cuando iniciamos sesión por primera ves.
Visibilidad del Estado del sistema
Cumple
Cumple
Cumple
Evaluación
heurística—
Visibilidad del Estado del sistema
Relación entre el sistema y el mundo real
Libertad y control para el usuario
Estándares y Consistencia
Reconocimiento antes que memoría
Prevención de errores
Flexibilidad y eficiencia
Diseño minimalista
Recuperación de errores
Ayuda y documentación
La evaluación heurística es una metodología que permite a partir de algunos principios, ayudar a los diseñadores novatos y expertos a realizar una revisión y mejora de los elementos de interacción y diseño de un proyecto.
La evaluación heurística es una metodología que permite a partir de algunos principios, ayudar a los diseñadores novatos y expertos a realizar una revisión y mejora de los elementos de interacción y diseño de un proyecto.
Principios heurísticos
Evaluación
heurística—
Visibilidad del Estado del sistema
Relación entre el sistema y el mundo real
Libertad y control para el usuario
Estándares y Consistencia
Reconocimiento antes que memoría
Prevención de errores
Flexibilidad y eficiencia
Diseño minimalista
Recuperación de errores
Ayuda y documentación
La evaluación heurística es una metodología que permite a partir de algunos principios, ayudar a los diseñadores novatos y expertos a realizar una revisión y mejora de los elementos de interacción y diseño de un proyecto.
La evaluación heurística es una metodología que permite a partir de algunos principios, ayudar a los diseñadores novatos y expertos a realizar una revisión y mejora de los elementos de interacción y diseño de un proyecto.
Principios heurísticos
Evaluación
heurística—
Visibilidad del Estado del sistema, Relación entre el sistema y el mundo real, Libertad y control para el usuario, Estándares y Consistencia, Reconocimiento antes que memoría, Prevención de errores, Flexibilidad y eficiencia, Diseño minimalista, Recuperación de errores y Ayuda y documentación
La evaluación heurística es una metodología que permite a partir de algunos principios, ayudar a los diseñadores novatos y expertos a realizar una revisión y mejora de los elementos de interacción y diseño de un proyecto.
La evaluación heurística es una metodología que permite a partir de algunos principios, ayudar a los diseñadores novatos y expertos a realizar una revisión y mejora de los elementos de interacción y diseño de un proyecto.
Principios heurísticos
#DOS
Relación entre el
sistema y el mundo real
¿En qué se parece al mundo real?
Cumple con la ley pero se podría agregar avatares para cada personaje personalizabas y prototipos de los premios reales.
Cumple
#DOS
Relación entre el
sistema y el mundo real
¿En qué se parece al mundo real?
Cumple con la ley pero se podría agregar avatares para cada personaje personalizabas y prototipos de los premios reales.
Cumple
#DOS
Relación entre el
sistema y el mundo real
¿En qué se parece al mundo real?
Cumple con la ley pero se podría agregar avatares para cada personaje personalizabas y prototipos de los premios reales.
Cumple
#TRES
Libertad y control
para el usuario
¿Puedo
controlar todo
lo que hago?
No cumple con la ley, solo cumple en un punto del menú para “crear taras” y tiene una opción para cancelar la acción, pero se podría agregar un botón de remover en cada tarea o también en las opciones de inicio de sesión
No cumple
#TRES
Libertad y control
para el usuario
¿Puedo
controlar todo
lo que hago?
No cumple con la ley, solo cumple en un punto del menú para “crear taras” y tiene una opción para cancelar la acción, pero se podría agregar un botón de remover en cada tarea o también en las opciones de inicio de sesión
No cumple
#TRES
Libertad y control
para el usuario
¿Puedo
controlar todo
lo que hago?
No cumple con la ley, solo cumple en un punto del menú para “crear taras” y tiene una opción para cancelar la acción, pero se podría agregar un botón de remover en cada tarea o también en las opciones de inicio de sesión
No cumple
#CUATRO
Estándares y
Consistencia
¿Lo he
visto antes?
Cumple con la ley, sigue los estándares de iconos que representan cosas de la vida real aunque se podría seguir agregando mas iconos para que el usuario se sienta mas cómodo.
Cumple
Cumple
#CUATRO
Estándares y
Consistencia
¿Lo he
visto antes?
Cumple con la ley, sigue los estándares de iconos que representan cosas de la vida real aunque se podría seguir agregando mas iconos para que el usuario se sienta mas cómodo.
Cumple
Cumple
#CUATRO
Estándares y
Consistencia
¿Lo he
visto antes?
Cumple con la ley, sigue los estándares de iconos que representan cosas de la vida real aunque se podría seguir agregando mas iconos para que el usuario se sienta mas cómodo.
Cumple
Cumple
Cumple
Cumple
#CINCO
Reconocimiento antes
que memoría
¿Me tengo
que acordar
de esto?
Cumple con la ley, contiene una busqueda inteligente donde relaciona el texto escrito con el contenido relacionado a ello, vamos a trabajar para seguir agregando mas ayudas.
Cumple
Cumple
#CINCO
Reconocimiento antes
que memoría
¿Me tengo
que acordar
de esto?
Cumple con la ley, contiene una busqueda inteligente donde relaciona el texto escrito con el contenido relacionado a ello, vamos a trabajar para seguir agregando mas ayudas.
Cumple
Cumple
#CINCO
Reconocimiento antes
que memoría
¿Me tengo
que acordar
de esto?
Cumple con la ley, contiene una busqueda inteligente donde relaciona el texto escrito con el contenido relacionado a ello, vamos a trabajar para seguir agregando mas ayudas.
Cumple
#SEIS
Prevención
de errores
¿Cómo hago
para no
equivocarme?
No cumple con la ley, se esta trabajando para poner avisos sobre acciones como crear tareas con un doble chequeo o cuando un usuario tiene muchas tareas asignadas repreguntar sobre esa acción.
No cumple
#SEIS
Prevención
de errores
¿Cómo hago
para no
equivocarme?
No cumple con la ley, se esta trabajando para poner avisos sobre acciones como crear tareas con un doble chequeo o cuando un usuario tiene muchas tareas asignadas repreguntar sobre esa acción.
No cumple
#SEIS
Prevención
de errores
¿Cómo hago
para no
equivocarme?
No cumple con la ley, se esta trabajando para poner avisos sobre acciones como crear tareas con un doble chequeo o cuando un usuario tiene muchas tareas asignadas repreguntar sobre esa acción.
No cumple
#SIETE
Flexibilidad y
eficiencia
¿Cómo puedo
hacerlo más
rápido?
No Cumple con la ley, ya que es una app mobile only no podemos aplicar esta ley al 100%, se incorporaran gestos que hacen que el usuario agilice y haga mas dinamico su uso.
No cumple
#SIETE
Flexibilidad y
eficiencia
¿Cómo puedo
hacerlo más
rápido?
No Cumple con la ley, ya que es una app mobile only no podemos aplicar esta ley al 100%, se incorporaran gestos que hacen que el usuario agilice y haga mas dinamico su uso.
No cumple
#SIETE
Flexibilidad y
eficiencia
¿Cómo puedo
hacerlo más
rápido?
No Cumple con la ley, ya que es una app mobile only no podemos aplicar esta ley al 100%, se incorporaran gestos que hacen que el usuario agilice y haga mas dinamico su uso.
No cumple
#OCHO
Diseño
minimalista
¿Utilizo sólo
los elementos
necesarios?
Cumple con la ley, el diseño de la app es minimalista e intuitivo en todos sus aspectos.
Cumple
#OCHO
Diseño
minimalista
¿Utilizo sólo los elementos
necesarios?
Cumple con la ley, el diseño de la app es minimalista e intuitivo en todos sus aspectos.
Cumple
#OCHO
Diseño
minimalista
¿Utilizo sólo los elementos
necesarios?
Cumple con la ley, el diseño de la app es minimalista e intuitivo en todos sus aspectos.
Cumple
#NUEVE
Recuperación
de errores
¿Qué hacer si me equivoque?
No cumple con la ley, se esta trabajando en agregar estos errores explicativos hacia el usuario en las secciones de inicio de sesión y en los campos que contengan textos para errores de sintaxis.
No cumple
#NUEVE
Recuperación
de errores
¿Qué hacer si me equivoque?
No cumple con la ley, se esta trabajando en agregar estos errores explicativos hacia el usuario en las secciones de inicio de sesión y en los campos que contengan textos para errores de sintaxis.
No cumple
#NUEVE
Recuperación
de errores
¿Qué hacer si me equivoque?
No cumple con la ley, se esta trabajando en agregar estos errores explicativos hacia el usuario en las secciones de inicio de sesión y en los campos que contengan textos para errores de sintaxis.
No cumple
No cumple con la ley, se esta trabajando en un onboarding para facilitar al usuario los procesos básicos dentro de la app y sus funcionalidades.
#DIEZ
Ayuda y
documentación
¿Necesito
información
adicional?
No cumple con la ley, se esta trabajando en un onboarding para facilitar al usuario los procesos básicos dentro de la app y sus funcionalidades.
#DIEZ
Ayuda y
documentación
¿Necesito
información
adicional?
No cumple con la ley, se esta trabajando en un onboarding para facilitar al usuario los procesos básicos dentro de la app y sus funcionalidades.
#DIEZ
Ayuda y
documentación
¿Necesito
información
adicional?
No cumple
No cumple
