TOMAS OSORIO -/ GLORIA RIVERA - / MARIA TERESA ROSSEL - / JOSEFA URZUA
INDICE SOBRE APHIA
05
SERVICIOS
06
PUBLICO OBJETIVO
06
DESCRIPCION DEL PROYECTO
07
FUNDAMENTOS DEL PROYECTO
08
FINALIDAD DEL PROYECTO
08
OBJETIVOS
09
CARACTERISTICAS FORMALES DE LA PAGINA
09
CARTA GANTT
10
USABILIDAD APLICADA
13
CARD-SORTING
21
TIPOGRAFIA Y COLOR
25
MOCKUP
31
SITIO WEB
39
Aphia / 03
APHIA Empresa chilena de dise単o emergente, conformada por dos dise単adoras gr叩ficas en el a単o 2009.
Aphia / 05
SERVICIOS Confección personalizada de polerones a modo de pieza única, en base a un conceptos asociados de la marca; Conceptos asociados: vanguardia, geometría, abstracción.
PUBLICO OBJETIVO Jóvenes con un grado de solvencia económica, de entre 18 y 28 años, relacionados con el área del diseño y las artes. Que tengan dentro de sus intereses la autenticidad entre sus pares.
Aphia / 06
DESCRIPCION DEL PROYECTO Se pretende hacer una plataforma online en la cual se exponga de mejor manera los diferentes productos relacionados con la marca. Como tambi茅n una forma en la cual el usuario sea capas de adquirirlos. Conocer la historia de estos nuevos dise帽adores chilenos. Debido a que en la actualidad la marca posee diferentes redes sociales que otorgan esta informaci贸n. Sin embargo no es optima para el usuario debido a su limitada y dispersa informaci贸n.
Aphia / 07
FUNDAMENTOS DEL PROYECTO La marca posee en la actualidad diferentes plataformas gratuitas en el cual el usuario es capas de conocer las diferentes cualidades de sus producto. Sin embargo la marca ha evolucionado en el tiempo y ampliado su espectro de público objetivo.
FINALIDAD DEL PROYECTO El impacto que generara en primera instancia que el usurio pueda navegar y encontrar todo lo necesario en un solo lugar. Como resultados a largo plazo la “pyme” se vera veneficiada debido a un posible aumento de ventas debido a que la página podras (reservar - comprar - preguntar - agendar citas - presupuestos - diseños textil)
Aphia / 08
OBJETIVOS Generales: Profesionalisar la marca / Posicionarse. Especificos: Aumentar ventas de los productos en su público objetivo y su nuevo público cautivo.
CARACTERISTICAS FORMALES DE LA PAGINA Para mayor facilidad y comodidad del usuario sera incorporado un método de presupuesto, el cual consistira en hacer “pedidos” online que le permita tener un estimado de su posible compra, basandose en telas, cortes, modelos pre establecidos, colores, entre otros.
Aphia / 09
ades
Po rcesos Procesos
Presentación Final.
1
2
Pe rsenta c i o nFinal es Presentaciones Creación
Conclusiones del proyecto.
Diseño Final del sitio.
Análisis de Usabilidad.
Corrección del cat sating, mapa de navegación y wireframe.
Corrección de la información obtenida de la pyme.
Presentación primera parte del proyecto.
Reorganización de información para la presentación.
Proceso elección color y tipografía.
Proceso Wireframe.
Creación programa de uso.
Proceso Cat Sating.
Desarrollo del brief completo de la empresa.
Primera revisión
Realizar un estudio previo de las necesidades y problematicas del proyecto.
Recopilación de información disponible en las redes sociales.
Organizácion del equipo de trabajo y elección de pyme con la cual se va a trabajar.
ACTIVIDADES A ct i v i d
CART A GAN TT 3
5
6
7
8
9
10
11
C r e a c iP Or no ey ct o i n a lF
4
12
13
14
15
16
17
18
19 20 21 22
Aphia / 11
USABILIDAD APLICADA Se refiere a la facilidad con que el usuario pueda utilizar un sitio web, con el fin de alcanzar un objetivo concreto. Los puntos claves para la realización de un sitio deben ser: la rapidez, simplicidad, interactividad, buena navegabilidad y mantener al usuario actualizado. De esto de desglosan los “10 principios de usabilidad” de Jakob Nielsen, lo que aplicaremos a continuación.
Aphia / 13
1
UTILIZAR EL LENGUAJE DE LOS USUARIOS
“El sistema debe siempre mantener a los usuarios informados del estado del sistema, con una realimentación apropiada y en un tiempo razonable.”
En el caso del sitio de Aphia, nosotros proponemos tener una sección destinada a la cotización de los polerones, en esta mostraremos las telas, modelos de polerones y colores actualizados, para poder cotizar tu propio poleron. También se podra encontrar en la sección Hoddie fotografías de modelos ya terminados para mostrarle a usuario los trabajos que se van realizando. Básicamente el modelo de la página esta basado en fotografías las cuales potencian y muestran los productos.
2
VISIBILIDAD DEL ESTADO DEL SISTEMA En este punto decidimos llamar la sección “Hoddie” a la galeria de los productos, ya que es un lenguaje juvenil enfocado directamente al público objetivo, ya nombrado anteriormente, personas jóvenes las cuales estan enfocadas al arte y al diseño, y también es el lenguaje en el cual las diseñadoras nombran a sus productos. El lenguaje visual es acorde al público por los colores trabajados y las tipografias, siendo atractivo para los clientes.
Aphia / 14
“El sistema debe usar el lenguaje de los usuarios, con las palabras, las frases y los conceptos familiares, en lugar de que los términos estén orientados al sistema. Utilizar convenciones del mundo real, haciendo que la información aparezca en un orden natural y lógico.”
3
En el sitio no hay restricción de usuario, tiene toda la información expuesta a todo tipo de público. Los usuarios disponen de un menú siempre visible, el cuál les ayuda en su navegación, en el caso de que se equivocaran o desearan cambiar a otra sección rápidamente. Como la página es navegable horizontalmente, cada sección tiene un formato que se adecua a la pantalla, en el cual la información visible es toda la información que hay, es decir no hay necesidad de subir o bajar para ver mas información. En el caso de querer cambiar de sección se puede hacer en el menú o con el scroll.
“Los usuarios eligen a veces funciones del sistema por error y necesitan a menudo una salida de emergencia claramente marcada, esto es, salir del estado indeseado sin tener que pasar por un diálogo extendido. Es importante disponer de deshacer y rehacer.”
4 “Los usuarios no deben tener que preguntarse si las diversas palabras, situaciones, o acciones significan la misma cosa. En general, siga las normas y convenciones de la plataforma sobre la que está implementando el sistema.”
CONTROL Y LIBERTAD PARA EL USUARIO
CONSISTENCIA Y ESTANDARES Hicimos un menu simple y limpio, no cuenta con subdiviciones y posee una jerarquización adecuada para una navegación rapida y directa. La jerarquización de cada sección es la adecuada, cumpliendo una estructura simple de facil lectura.
Aphia / 15
5
PREVENCION DE ERRORES El sitio no presenta errores, los enlaces se encuentran bien dirigidos a cada sección y todas estas estan funcionando.Y en el caso de que hayan modificaciones en la página, creamos una gráfica acorde al sitio, que dé la información necesaria explicando el por qué el enlace no está en funcionamiento. Por ejemplo: “sitio en mantenimiento, estamos trabajando para usted. Vuelve a visitar la sección en 7 días”.
6
MINIMIZAR LA CARGA DE LA MEMORIA DEL USUARIO El sitio es muy pregnante al poseer mayoritariamente imágenes e iconos y muy poco texto. Es un sitio limpio, didactico e innovador, adémas cuenta con pocas secciones y precisas lo que permite al usuario recordar con facilidad las secciones ya visitadas.
Aphia / 16
“Es importante prevenir la aparición de errores. Qué mejor que generar buenos mensajes de error.”
“El usuario no debería tener que recordar la información de una parte del diálogo a la otra. Es mejor mantener objetos, acciones, y las opciones visibles que memorizar.”
7 “Las instrucciones para el uso del sistema deben ser visibles o fácilmente accesibles siempre que se necesiten. Los aceleradores no vistos por el usuario principiante, mejoran la interacción para el usuario experto de tal manera que el sistema puede servir tanto para usuarios inexpertos como para experimentados. Es importante que el sistema permita personalizar acciones frecuentes.” “No deben contener la información que sea inaplicable o se necesite raramente. Cada unidad adicional de la información en un diálogo compite con las unidades relevantes de la información y disminuye su visibilidad relativa.”
FLEXIBILIDAD Y EFICIENCIA DE USO El sitio cuenta con rutas únicas para llegar a cada sección. Lo cual en este caso si es funcional, porque no tiene una gran cantidad de información que justifique el uso de “atajos”.
8
LOS DIALOGOS ESTETICOS Y EL DISENO MINIMALISTA La navegación de la pagina es muy amena debido a la simpleza de la página. En cuanto al diseño, creemos que es coherente, mantiene la linea gráfica y no contiene elementos distractores.
Aphia / 17
AYUDAR A LOS USUARIOS A RECONOCER, DIAGNOSTICAR Y RECUPERARSE DE LOS ERRORES
9
“Los mensajes de error se deben expresar en un lenguaje claro, se debe indicar exactamente el problema, y deben ser constructivos.”
Hicimos un formulario para la cotización del diseño del poleron en el cual es necesario que los errores sean indicados en el momento en que se va escribiendo. Por ejemplo, en los espacios destinados a números, no se permitan caractéres, en el espacio destinado al e-mail que se avise si falta el @, para ayudar al usuario a identificar los errores. En el caso de que el formulario se termine, y aún contenga errores, no permita ser enviado y el error destaque para poder volver a llenarlo. Y finalmente, una vez corregido y enviado, debe aparecer un mensaje que confirme el envío.
10
CONSISTENCIA Y ESTANDARES No quisimos aplicar buscador ni preguntas frecuentes ya que se encuentra toda la información necesaria en el sitio, en este caso no se juntificaria tales elementos porque la página cuenta con imágenes y formulario de cotización para el objetivo de la empresa.
Aphia / 18
“Aunque es mejor si el sistema se puede usar sin documentación, puede ser necesario disponer de ayuda y documentación. Ésta tiene que ser fácil de buscar, centrada en las tareas del usuario, tener información de las etapas a realizar y que no sea muy extensa.”
Aphia / 19
CARD-SORTING
Aphia / 21
CARD-SORTING
Aphia / 22
MAPA DE NAVEGACION
Aphia / 23
TIPOGRAFIA Y COLOR
Aphia / 25
COLOR
Aphia / 26
Aphia / 27
Aphia / 28
TIPOGRAFIA KLAVIKA BOLD // TÍTULOS ........................................................................................................ ABCDEFGHIJKLMNÑOPQRSTUVWXYZ ........................................................................................................ abcdefghijklmnñopqrstuvwxyz ........................................................................................................ 1234567890 ........................................................................................................
%*/.&()¡?|°#¿‘[]
VERDANA // TEXTOS .............................................................................. ABCDEFGHIJKLMNÑOPQRSTUVWXYZ .............................................................................. abcdefghijklmnñopqrstuvwxyz .............................................................................. 1234567890 .............................................................................. %*/.&()¡?|°#¿‘[]
Aphia / 29
MOKUP
Aphia / 31
LOGO
HOME APHIA HODDIE TU DISEﾃ前 CONTACTO F
Aphia / 32
FL
LOGO
HOME APHIA HODDIE TU DISEﾃ前 CONTACTO F
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean consectetur hendrerit orci vitae porta. Sed lectus leo, ultrices eget interdum ac, consequat a ante. Nunc risus velit, consectetur ac venenatis vel, aliquam quis lectus. Pellentesque neque odio, facilisis eget vehicula ac, tristique eget lectus. Praesent at ornare nulla. Donec in consectetur purus. Duis Suspendisse tempor, enim in faucibus ullamcorper, orci purus iaculis lorem, id viverra tortor massa ut urna. Donec accumsan, neque in malesuada varius, nunc felis laoreet elit, ut iaculis urna ligula in dui. Aliquam auctor ornare arcu, et eleifend justo posuere sed. Integer
FL
Aphia / 33
HODDIE LOGO
HOME APHIA HODDIE TU DISEﾃ前 CONTACTO F
Aphia / 34
FL
HOMBRE
MUJER
NIﾃ前S
LOGO
HOME APHIA HODDIE TU DISEﾃ前 CONTACTO F
FL
MODELOS
TELAS
PATRONES
RESERVA
Aphia / 35
LOGO
HOME APHIA HODDIE
IJOJSDFOWIEJFOW // IDSNFWIJNFN // IEWFJN@IJSNFJWN // 18729823
TU DISEﾃ前 CONTACTO
EMAIL NOMBRE
F
FL
ASUNTO MENSAJE
SUBMIT
Aphia / 36
Aphia / 37
PAGINA WEB
Aphia / 39
Aphia / 40
Aphia / 41
Aphia / 42
Aphia / 43
Aphia / 44
TOMAS OSORIO -/ GLORIA RIVERA - / MARIA TERESA ROSSEL - / JOSEFA URZUA