Nutriloosé

2014

TEORÍA DE DISEÑO BETZABE CARBAJAL, HUGO LANDA Y FERNANDO PERÉZ

Universidad Iberoamericana

Introducción

El diseño es importante para dar significado y sentido a algún

mensaje que se desea transmitir de manera visual, un color, una

forma, tamaño, imagen y la disposición determinada de los

elementos que se incluyen en el diseño, ayudan a crear una buena

comunicación y al mismo tiempo son atractivos y generan

motivación o interés en aquellas personas a las que se dirige el

diseño.

Antes de que se creara una propuesta de diseño se hizo

principalmente un análisis de la información que contendrá la

página, se fijaron los objetivos que se deseaban alcanzar y

recopilada la información se decidieron los textos y las imágenes que

se utilizarían, lo que nos ayudó a crear una estructura base.

En este documento se muestra el diseño de pantalla final, al igual que

una breve explicación sobre los principios de diseño que se utilizaron

en este proyecto.

La creación de las pantallas fueron en base a la investigación de las

necesidades que tienen las aplicaciones existentes y lo que desean

los usuarios de una aplicación de nutrición.

Diseño de la Aplicación.

Categoría.

Problemas de las aplicaciones existentes.

El nombre de las aplicaciones suelen ser

muy difíciles de recordar.

Principio de Diseño.

El nombre que se eligió se relaciona con

la aplicación por lo que sería más fácil de

recordar, y también gracias a ser un

nombre no muy largo.

Teoría de diseño.

Según los 10 consejos para nombrar una

aplicación http://applicantes.com/10-

consejos-nombres-aplicacion-apps/.

Debe ser claro: El nombre de la

aplicación debe de tener relación con la

aplicación y ser descriptivo.

Nutri- Nutrición Loosé- Libre. El objetivo de la aplicación es ayudarles

a mantener su dieta pero sin sentirse presionados, que puedan ellos

disfrutarla y no verla como un castigo.

Fácil de pronunciar: La palabra no es difícil de pronunciar, se le pidió

a algunas personas que pudieran decirlo, y no se les complicaba

pronunciarlo, como se escribe se lee.

Nombre corto: El nombre es corto y no rebasa los 11 caracteres.

Compuesto por dos palabras: Nutri- Nutrición Loosé- Perder. Que

describen la aplicación.

Categoría.

No existe categoría para esta pantalla es

más que nada un requisito.

Principio de Diseño.

Para que no sea una sesión en común

para todos los usuarios y crear un sitio

privado en el que ellos decidan que

publicar o que no es importante que

creen su sesión.

Teoría de diseño.

Crear cuentas cuentas de usuario ya sea

de una aplicación o incluso en el

ordenador de tu computadora es algo

importante, porque ayuda a que tu

información y los contenidos que tienes

puedan ser privados, te da la posibilidad

de personalizar tu espacio de la manera

en la que tu deseas, y obviamente mejora la seguridad de tu

información para que no cualquiera pueda cambiar o alterar tu

información.

La pagina web http://www.osi.es/es/actualidad/blog/2012/06/15/el-por-

que-de-crear-distintas-cuentas-de-usuario-en-nuestro-ordenador menciona

estas características como principal justificación, sin embargo no esta

enfocada a las aplicaciones, pero aun así la justificación es aplicable

para todo tipo de cuentas de usuario.

Categoría.

No existe categoría para esta pantalla es

más que nada un requisito.

Principio de Diseño.

Para que la aplicación no se vea

saturada de información es necesario

dividir esta información en secciones, lo

que hace que la aplicación se vea más

ordenada

Teoría de diseño.

Se enfonca principalmente a la

accesibilidad que tiene la aplicación.

Información clara: La tipografía debe ser

fácil de leer y las divisiones separadas

equitativamente para que el diseño no

se vea sucio.

Manejo del color: En la pantalla el color es uniforme para lograr un

diseño más limpio.

Claridad de los textos: No hay saturación de texto en la pantalla solo

es la división de la información por temas.

Categoría.

Problemas para mantener tu dieta.

Uno de las principales razones por las que

no mantienen los usuarios sus dietas es

por falta de organización.

Principio de Diseño.

En la página principal de la aplicación se

les proporciona la información necesaria

en base a las actividades que tienen

pendientes y alimentos que deben

consumir durante el día. Y una tabla que

le muestra su progreso.

Teoría de diseño.

La información debe de ser clara y

precisa, facil den entender y de leer.

Cada area se divide en secciones para

que la pantalla no se sature de información y se vuelva dificil

entendela.

En el documento de pixel perfect menciona la importacia de las

divisiónes por temas y subtemas, al igual que la importancia de no

saturar de texto la pantalla para que así sea más facil que el usuario

le entienda.

Categoría.

Problemas para mantener tu dieta.

Los pacientes suelen dejar sus dietas por

no ver los resultados rápidos en su

cuerpo, por aburrición o falta de

organización.

Principio de Diseño.

Para que el usuario pueda mantener su

dieta es importante que ellos también

vayan conociendo sus avances, las

principales medidas según los

nutriólogos son las medidas

antropométricas es por eso que nuestra

aplicación tiene una sección para las

medidas antropométricas.

Teoría de diseño.

En la pantalla se ve el titulo de el area en

la que el usuario se encuentra y posteriormente están los subtitulos;

cada sección tiene la información consistente y clara sin saturarse.

Se apoya de mensajes iconicos no codificados, ya que son palabras

clave al igual que imágenes obvias y faciles de entender.

Categoría.

Motivación y Opciones.

Es importante que para motivar al

usuario tenga a algún apoyo moral, o

pueda llegar a ver su dieta como un

reto.

Principio de Diseño.

Para que pueda mantener su dieta se

propone sincronizar su aplicación con

amigos y conocidos que también estén

usando esta aplicación, para que

mutuamente se apoyen e impulsen para

seguir adelante con sus objetivos.

Teoría de diseño.

Esta organizada la información a través

de una retícula modular, que ayuda a

organizar la posición de los objetos y los

textos, logrando así un diseño más limpio.

Los títulos están escritos en mayúsculas para diferenciarlos de la otra

información.

También se reducen pasos a seguir cuando la información viene

contenida justo debajo de los subtítulos, asi no tienen que estar

abriendo otras páginas para encontrar la información, lo que facilita

su usabilidad.

La navegación en las pantallas se facilita por los títulos principales

que se encuentran en cada sección de la aplicación.

Categoría.

Problemas de aplicaciones existentes.

La tabla de alimentos de algunas

aplicaciones son desorganizadas y no

contienen la información que el usuario

busca.

Principio de Diseño.

Las tablas de alimentos tienen sus

equivalentes necesarios para que

puedan sustituir los alimentos por otro

que tenga un equivalente calórico al

que se desea sustituir, haciendo que la

dieta se vuelva más accesible.

Teoría de diseño.

La informacion esta dividida en

categorias para que sea más facil

encontrar los alimentos deseados.

La información respeta un scroll hacia abajo que se adapta al

tamaño de la pantalla, sin satrurar la pantalla de información.

Los cuadros respetan el diseño de toda la aplicación, y mantiene el

mismo diseño y organización en todas las pantallas, para que

tengan concordancia.

Se ocupan figuras retoricas de “Metafora” que representan los

títulos de cada sección.

Teoría de diseño aplicada a todas las pantallas.

Los mensajes aplicados en mi diseño:

1. Mensajes lingüísticos: Objetivo/ Dietas/ Notificaciones/ Usuario/

Control/ Alimentos/ Amigos/ #Nombre / Progreso/ Agenda/

Escáner de Alimentos/ Inicio de Sesión.

2. Mensaje denotado:

Avatar: Le da una identificación a la aplicación

dependiendo del género del usuario.

Teoría del color:

El color ayuda a que un diseño pueda ser llamativo, estimule y

provoque interés.

“La saturación constituye la pureza del color respecto al gris, y

depende de la cantidad de blanco que presente. Cuanto más

saturado está un color, más puro es y menos mezcla de gris posee”. 10 http://cgsign.blogspot.com/2007_08_01_archive.html

“La brillantez es la luminosidad de un color, es decir, que es la

capacidad de reflejar el blanco se refiere a la claridad u

obscuridad de un tono. La luminosidad puede variar añadiendo

negro o blanco al color”. 11 http://cgsign.blogspot.com/2007_08_01_archive.html

En la creación del prototipo se hizo uso de las dos técnicas

mencionadas anteriormente para poder crear un diseño que

tuviera el equilibrio de ambas partes, y resaltaron de manera

equitativa todos elementos que conforman al diseño.

Según la psicología del color:

El color blanco es la suma de todos los colores y se le asocia con

la pureza, inocencia y lo positivo y es el que más brillantez refleja.: Las

letras tienden a ser brillantes y se utiliza el color blanco para que

resalten, y sean fáciles de diferenciar en el diseño saturado.

El color verde puede referirse a un color que define ser

saludable: Control se refiere en específico a mantener un registro que

ayude al paciente a mantenerse sano, es por eso el color de esa

sección.

El color rojo puede resultar como algo atractivo o puede ser al

mismo tiempo algo noble: Los alimentos cuando se mantiene una

dieta pueden ser una tentación o incluso algo que te ayude a

mantenerte saludable y no tiene que tener un mal sabor, por lo tanto

no siempre es negativo.

El color gris es el producto de la mezcla entre el blanco y el

negro, es el símbolo de la neutralidad y ausencia de energía: En el

diseño sólo se llega a utilizar cuando un texto no tiene tanta

importancia o no es muy necesario que resalte a menos que se

seleccione esa opción.

El color azul es un color frío, simboliza calma y el reposo, se le

asocia con la inteligencia y las emociones profundas: Por lo tanto se

encuentra en la primera página de la aplicación donde se

encuentra el avatar, el cual está en un estado de reposo, y funciona

como página principal.

El color naranja actúa como estimulante de los tímidos y los

tristes, y es radiante y expansiva: Se encuentra en el apartado del

usuario debido a que es el que debe de estar de forma activa y

participativa dentro de la aplicación.

Retículas:

Las retículas que se utilizaron en la aplicación fueron “Modulares”,

para poder organizar la información, los márgenes y la posición de

los objetos dentro de las pantallas.

“Una retícula modular es en esencia una retícula de columnas con

gran número de líneas de flujo horizontales que subdividen las

columnas en filas…”

Cada módulo delimita el espacio informativo y los dividen en áreas

llamadas zonas especiales.

Tipografía:

La tipografía que se utilizó es Helvetica.

Creada por Max Miedinger en 1957 es la fuente más usada en

internet y mejor aceptada en el mundo del diseño. Helvética es una

fuente Sans Serif (sin remates) de carácter elegante ideal para

cuerpos de texto debido a su sencillez y fácil lectura.

Bibliografía:

http://cgsign.blogspot.com/2007_08_01_archive.html

http://cgsign.blogspot.com/2007_08_01_archive.html

http://www.aliatuniversidades.com.mx/bibliotecasdigitales/pdf/com

unicacion/Teorias_del_disenio_grafico.pdf

http://applicantes.com/10-consejos-nombres-aplicacion-apps/

https://attachment.fbsbx.com/file_download.php?id=532510060203

396&eid=ASsL-485_Mb51fk9ytsncH-

xWz4dGvEaUAuJRkJYQxgJVD9bR7uvjYKYai4KU54FRR8&inline=1&ext=

1398373707&hash=AStMxFaCSqAWS0i_