diff --git a/P1/Ainhoa_journey.jpg b/P1/Ainhoa_journey.jpg new file mode 100644 index 000000000..c01a91c0e Binary files /dev/null and b/P1/Ainhoa_journey.jpg differ diff --git a/P1/Ainhora_persona.jpg b/P1/Ainhora_persona.jpg new file mode 100644 index 000000000..dd8290050 Binary files /dev/null and b/P1/Ainhora_persona.jpg differ diff --git a/P1/Competitor_Analysis_[DIU23].png b/P1/Competitor_Analysis_[DIU23].png new file mode 100644 index 000000000..5273ee8b9 Binary files /dev/null and b/P1/Competitor_Analysis_[DIU23].png differ diff --git a/P1/Manuel_journey.jpg b/P1/Manuel_journey.jpg new file mode 100644 index 000000000..7d797f4f5 Binary files /dev/null and b/P1/Manuel_journey.jpg differ diff --git a/P1/Manuel_persona.jpg b/P1/Manuel_persona.jpg new file mode 100644 index 000000000..d789a6d7b Binary files /dev/null and b/P1/Manuel_persona.jpg differ diff --git a/P1/P1-2b User Research Plan Template.docx b/P1/P1-2b User Research Plan Template.docx deleted file mode 100644 index e534a4546..000000000 Binary files a/P1/P1-2b User Research Plan Template.docx and /dev/null differ diff --git a/P1/P1-2b User Research Plan Template.pdf b/P1/P1-2b User Research Plan Template.pdf deleted file mode 100644 index 57883313b..000000000 Binary files a/P1/P1-2b User Research Plan Template.pdf and /dev/null differ diff --git a/P1/P1-2b_User_Research_Plan_Template.pdf b/P1/P1-2b_User_Research_Plan_Template.pdf new file mode 100644 index 000000000..d187ee80f Binary files /dev/null and b/P1/P1-2b_User_Research_Plan_Template.pdf differ diff --git "a/P1/Pr\303\241ctica_1_UX_User_&_Desk_Research_&_Analisis.pdf" "b/P1/Pr\303\241ctica_1_UX_User_&_Desk_Research_&_Analisis.pdf" new file mode 100644 index 000000000..fd1add401 Binary files /dev/null and "b/P1/Pr\303\241ctica_1_UX_User_&_Desk_Research_&_Analisis.pdf" differ diff --git a/P1/README.md b/P1/README.md index f9bc55cf3..0ab3dedad 100644 --- a/P1/README.md +++ b/P1/README.md @@ -1,12 +1,35 @@ -## DIU - Practica1, entregables +# DIU - Practica1, entregables +## [User research Plan template:](P1-2b_User_Research_Plan_Template.pdf) +Este proyecto tiene como objetivo comprender la demografía, preferencias y comportamientos de personas interesadas en asistir a talleres gastronómicos. +Nosotros nos centraremos en cómo de fácil es para los usuarios realizar tareas básicas la primera vez que encuentran el diseño. +Nuestro público cbjetivo seran principalmente los aficionados a la cocina, los socializadores culinarios y los padres y madres de familias. + +## [Competitive Analysis:](Competitor_Analysis_[DIU23].png) +### Pilsa Educa +Como podemos ver en su sitio web consta de una buena variedad de cursos de alta calidad y donde actualizan con frecuencia los mismos. La página web tiene un diseño bastante intuitivo y consta de un proceso de reserva simple y muchas fotos y videos de los diferentes cursos y la empresa. +### Granada Cooking +En Granada Cooking consta de mucha variedad de cursos de diferentes cocinas, una buena calidad de contenido aunque no actualizan muy frecuentemente los cursos. Su página web tiene un diseño fácil de usar, un proceso de reserva muy simple e intuitivo y consta de muchas fotos de platos, cursos, instalaciones, etc. -- User research - (plan) template -- Desk research: Análisis Competencia -- 2 Personas -- 2 User Journey Map ( 1 por persona) -- Revisión de Usabilidad +### Culinary Spain +La variedad de cursos no es muy extensa en Culinary Spain y, aunque la calidad del contenido parece buena, no recibe actualizaciones de nuevos cursos ni nuevo contenido. El diseño es muy simple y para nada intuitivo, el proceso de reserva no es muy complejo pero para nada es simple y no consta apenas de fotos ni mucho menos videos. +## 2 Personas: + ### [Ainhoa:](Ainhora_persona.jpg) +Ainhoa está abierta a nuevas experiencias, aunque demasiado ocupada, por eso cree que le puede venir bien ir a actividades donde conozca gente y pueda desconectar (como un taller de cocina). -(valoración y conclusiones de esta etapa) + ### [Manuel:](Manuel_persona.jpg) +Al ser una persona tímida y apasionada por la cocina, un taller de cocina es la mejor opción para empezar a abrirse a conocer más gente y perder la timidez. + +## 2 User Journey Map: + ### [Ainhoa:](Ainhoa_journey.jpg) +Lo peor que le puede pasar a alguien que vive estresado por el trabajo y con poco tiempo libre es que el trámite de reserva sea costoso y lento. + + ### [Manuel:](Manuel_journey.jpg) +A una persona tímida como Manuel, lo que le hace falta es que la persona a cargo o la dinámica del taller tenga en cuenta eso y le empuje a hablar con gente. + +## [Revisión de Usabilidad:](Usability-review-template.xlsx) +La página web de Pilsaeduca.com ha obtenido 84 puntos sobre 100, por lo que podemos calificarlo con un sitio web bueno, donde los usuarios deberían poder utilizar este sitio o sistema con relativa facilidad y deberían poder completar la gran mayoría de las tareas importantes. + +Memoria completa [aquí](Práctica_1_UX_User_&_Desk_Research_&_Analisis.pdf) diff --git a/P1/Usability-review-template-2.pdf b/P1/Usability-review-template-2.pdf deleted file mode 100644 index 39aa71426..000000000 Binary files a/P1/Usability-review-template-2.pdf and /dev/null differ diff --git a/P1/Usability-review-template.xls b/P1/Usability-review-template.xls deleted file mode 100644 index 39e4f7cc6..000000000 Binary files a/P1/Usability-review-template.xls and /dev/null differ diff --git a/P1/Usability-review-template.xlsx b/P1/Usability-review-template.xlsx index 8e1579bbc..e640fc415 100644 Binary files a/P1/Usability-review-template.xlsx and b/P1/Usability-review-template.xlsx differ diff --git a/P2/BOCETOS/Cuenta.fig b/P2/BOCETOS/Cuenta.fig new file mode 100644 index 000000000..1441d4845 Binary files /dev/null and b/P2/BOCETOS/Cuenta.fig differ diff --git a/P2/BOCETOS/Cuenta.jpg b/P2/BOCETOS/Cuenta.jpg new file mode 100644 index 000000000..8e75bc8a5 Binary files /dev/null and b/P2/BOCETOS/Cuenta.jpg differ diff --git a/P2/BOCETOS/Curso.fig b/P2/BOCETOS/Curso.fig new file mode 100644 index 000000000..e7a6ddefc Binary files /dev/null and b/P2/BOCETOS/Curso.fig differ diff --git a/P2/BOCETOS/Curso.jpg b/P2/BOCETOS/Curso.jpg new file mode 100644 index 000000000..15933ce73 Binary files /dev/null and b/P2/BOCETOS/Curso.jpg differ diff --git a/P2/BOCETOS/Foro.fig b/P2/BOCETOS/Foro.fig new file mode 100644 index 000000000..e0abedcab Binary files /dev/null and b/P2/BOCETOS/Foro.fig differ diff --git a/P2/BOCETOS/Foro.jpg b/P2/BOCETOS/Foro.jpg new file mode 100644 index 000000000..960d0e038 Binary files /dev/null and b/P2/BOCETOS/Foro.jpg differ diff --git a/P2/BOCETOS/Inicio_Sesion-Registro.fig b/P2/BOCETOS/Inicio_Sesion-Registro.fig new file mode 100644 index 000000000..c568fc8f5 Binary files /dev/null and b/P2/BOCETOS/Inicio_Sesion-Registro.fig differ diff --git a/P2/BOCETOS/Inicio_Sesion-Registro.jpg b/P2/BOCETOS/Inicio_Sesion-Registro.jpg new file mode 100644 index 000000000..7bcf3f654 Binary files /dev/null and b/P2/BOCETOS/Inicio_Sesion-Registro.jpg differ diff --git a/P2/BOCETOS/Pagina principal.fig b/P2/BOCETOS/Pagina principal.fig new file mode 100644 index 000000000..4f8978fd6 Binary files /dev/null and b/P2/BOCETOS/Pagina principal.fig differ diff --git a/P2/BOCETOS/Pagina_Principal.fig b/P2/BOCETOS/Pagina_Principal.fig new file mode 100644 index 000000000..1a68c3a35 Binary files /dev/null and b/P2/BOCETOS/Pagina_Principal.fig differ diff --git a/P2/BOCETOS/Pagina_Principal.jpg b/P2/BOCETOS/Pagina_Principal.jpg new file mode 100644 index 000000000..a49247547 Binary files /dev/null and b/P2/BOCETOS/Pagina_Principal.jpg differ diff --git a/P2/Labelling-Excel.xlsx b/P2/Labelling-Excel.xlsx new file mode 100644 index 000000000..937d684ff Binary files /dev/null and b/P2/Labelling-Excel.xlsx differ diff --git a/P2/Labelling-PDF.pdf b/P2/Labelling-PDF.pdf new file mode 100644 index 000000000..12970e395 Binary files /dev/null and b/P2/Labelling-PDF.pdf differ diff --git a/P2/Malla-Receptora-PDF.pdf b/P2/Malla-Receptora-PDF.pdf new file mode 100644 index 000000000..68fd1868a Binary files /dev/null and b/P2/Malla-Receptora-PDF.pdf differ diff --git a/P2/Malla-Receptora.jpg b/P2/Malla-Receptora.jpg new file mode 100644 index 000000000..3e782f8d3 Binary files /dev/null and b/P2/Malla-Receptora.jpg differ diff --git "a/P2/Pr\303\241ctica_2-Ideaci\303\263n_Y_Dise\303\261o.pdf" "b/P2/Pr\303\241ctica_2-Ideaci\303\263n_Y_Dise\303\261o.pdf" new file mode 100644 index 000000000..653514f02 Binary files /dev/null and "b/P2/Pr\303\241ctica_2-Ideaci\303\263n_Y_Dise\303\261o.pdf" differ diff --git a/P2/README.md b/P2/README.md index c264b1242..cb597be84 100644 --- a/P2/README.md +++ b/P2/README.md @@ -1,29 +1,83 @@ ## DIU - Practica2, entregables ### Ideación -* Malla receptora de información -* Mapa de empatía -* Point of View +* [Malla receptora de información](Malla-Receptora-PDF.pdf) + +El principal objetivo de la malla receptora era generar una serie de ideas que definían el rumbo que cogería nuestra empresa. + +*Interesante/Relevante:* + +En este apartado hemos insertado las mejores funcionalidades de las páginas analizadas. Son puntos clave en nuestra web que no pueden faltar, como por ejemplo acceder a un apartado con experiencias previas de usuarios u obtener una manera de contactar con nuestros trabajadores de una forma sencilla y eficaz. + +*Críticas Constructivas:* + +Después de haber obtenido los puntos fuertes de otras webs, nos hemos centrado en los apartados en los que flojean, para mejorar estas funcionalidades y atraer a los clientes. + +*Preguntas a partir de la experiencia:* + +Una vez analizado lo mejor y lo peor de la competencia, nos hemos centrado en nuestros clientes, más concretamente en la experiencia personal que puedan tener y todas las dudas que les puedan surgir y así poder ofrecerles las respuestas pertinentes. + +*Nuevas ideas:* + +Tras explorar diversas fuentes en busca de inspiración, es momento de desarrollar nuestras propias ideas. Por ello después de un proceso de pensamiento innovador, hemos llegado a algunas propuestas que podrían mejorar la experiencia para muchos usuarios. Por ejemplo, la disponibilidad de transporte para los usuarios provenientes de otras localidades o la opción de seguir a usuarios y chefs e intercambiar experiencias en un foro. ### PROPUESTA DE VALOR -* ScopeCanvas +Nuestra página web de talleres de cocina se esfuerza por atraer a una amplia audiencia, con el objetivo de compartir el amor por la gastronomía y la experiencia culinaria. Además de ofrecer una amplia variedad de talleres especializados, nos diferenciamos al proporcionar un servicio de transporte conveniente para aquellos que residen en otras localidades, facilitando así el acceso a nuestras clases. + +Nos esforzamos por satisfacer todos los gustos y preferencias culinarias de nuestros clientes. +Para aquellos que desean disfrutar de beneficios exclusivos, contamos con un apartado de club donde pueden convertirse en socios y acceder a promociones especiales y ventajas únicas como clases privadas o formación profesional para aquellos interesados en un estudio más profundo. + +Aquí, puedes compartir tus creaciones culinarias, seguir a otros usuarios y chefs, y aprender de sus experiencias. +Nuestro objetivo es crear una comunidad vibrante y activa en torno a la cocina, donde cada participante pueda disfrutar de una experiencia enriquecedora y memorable. ¿Estás listo para unirte a nosotros y explorar el apasionante mundo de la cocina? No esperes más y únete a nuestra comunidad culinaria hoy mismo. + +* [ScopeCanvas](Scope_Canvas-PDF.pdf) + +En nuestro ScopeCanvas recopilamos todo lo necesario para poder seguir avanzando con nuestro proyecto. Algunas de estas directrices son: nuestro propósito general, objetivos a largo, corto y medio plazo, necesidades que preocupan y motivan a los clientes, métricas que seguiremos para evaluar si nuestra evolución es favorable o no y algunas acciones que buscamos que nuestros usuarios lleven a cabo. ### TASK ANALYSIS +* [User Task Matrix](UserTaskMatrix-PDF.pdf) -* User Task Matrix -* User/Task flow +En nuestra matriz de tareas de usuario, hemos compilado todas las funciones de nuestra página web, asignándoles una prioridad según si se utilizarán antes, durante o después del tour. Este proceso nos permite organizarlas por su importancia relativa y determinar cuáles deberían ser nuestras prioridades. Aquellas que reciban una puntuación más alta serán las más utilizadas, sin importar cuándo se utilicen, por lo que debemos enfocarnos en desarrollarlas primero. Además de esto, dependiendo de la puntuación de cada tarea, se le ha asignado un color, esto es simplemente para distinguir mejor a primera vista cuáles son las más importantes y cuales menos (aunque lo sigue determinando la puntuación). ### ARQUITECTURA DE INFORMACIÓN +* [Sitemap](Site_Map.jpg) + +En el sitemap se presenta la jerarquía que seguirá nuestra página web, con los menús principales y las secciones que se desglosan. Podemos observar que hay algunas secciones que tienen un color verde, esto es simplemente para distinguir que sin estar asociado al club no se podrá acceder a la reserva de cursos privados o formaciones profesionales. + + +* [Labelling](Labelling-PDF.pdf) + +En el Labelling, explicamos qué son cada una de las secciones de nuestro Sitemap, qué propósito tienen y qué se encontrará el usuario al acceder a ellas. + + +### Prototipo Lo-FI Wireframe + +Al mirar nuestro Task Matrix nos hemos dado cuenta de que tenemos cinco apartados clave, que son los que mayor puntuación han obtenido. Estos son: Página Principal, Curso, Foro, Usuario y Menú de Inicio Sesión. + +*Página principal* + +En la página principal mostramos en la parte superior nuestro logo, junto con los menús principales, seguido del nombre de nuestra empresa y una serie de fotos de los cursos destacados que irán desplazándose hacia la izquierda. Después de esto mostraremos una introducción acerca de nuestra empresa y finalmente un apartado del foro con los temas más destacados tras el cual irá el pie de página. + +*Curso* + +En esta página se situará toda la información pertinente sobre el curso deseado. El usuario dispondrá de una pequeña descripción de dicho taller, junto con las elaboraciones que se llevarán a cabo y el chef que lo impartirá. Tras esto vendrá el precio y las fechas disponibles para realizarlo. Acompañado a todo este texto tendremos una serie de fotos que ilustrarán cómo será el curso. + +*Foro* + +Esta será la página principal desde la cual se podrá acceder al foro en sí y a la galería compartida, por lo que tendrá un resumen de cada una de estas partes. Respecto al foro, al igual que en la página principal tendremos una serie de temas destacados junto a un buscador. Y en cuanto a la galería compartida dispondremos de dos apartados principales, uno de ellos será una galería con todas las fotos disponibles, y la otra contendrá el curso más reciente que se haya realizado. + +*Usuario* + +Lo primero que podemos observar en la sección de Usuario será de cuantos seguidores y cuantos seguidos disponemos en el momento, pulsando en cualquiera de ellos, este nos mostrará una lista de los usuarios a los que seguimos o los que nos siguen. Tras esto tendremos un apartado que nos muestre los cursos que hemos marcado como nuestros favoritos y otro en el que tendremos los cursos pendientes de reservar (la cesta). Después vendrá el apartado de las notificaciones, para poder configurarlo como le plazca al usuario y por último, las opciones de cerrar sesión y cambiar la contraseña. -* Sitemap -* Labelling +*Inicio Sesion / Registro* +Esta es la sección por la que todo usuario deberá pasar para poder acceder a la reserva de un taller, por lo que en ella se pide al usuario que introduzca un nombre de usuario junto con una contraseña. Dispondremos de opciones como ver la contraseña, recordarla y poder cambiarla pulsando “¿Has olvidado tu contraseña?” que facilitarán el inicio de sesión o registro a nuestros clientes. Por último tendremos un botón de enviar, para guardar el inicio de sesión o registro que hayamos realizado. -### Prototipo Lo-FI Wireframe +### Conclusiones -### Conclusiones -(incluye valoración de esta etapa) +En resumen, Sabor y Saber se dedica a promover la pasión por la cocina a través de su página web, ofreciendo una amplia variedad de talleres personalizados y experiencias culinarias únicas. Nuestra plataforma permite a los usuarios explorar clases tanto populares como menos conocidas, así como participar en funciones interactivas como guardar recuerdos de las experiencias y seguir a otros usuarios y chefs. Nuestra estrategia se basa en la investigación de mercado y en la retroalimentación de los usuarios para ofrecer constantemente un servicio diferenciado y atractivo. Además, utilizamos herramientas como la Malla Receptora de Información y ScopeCanvas para establecer objetivos claros y asegurar el éxito de nuestros proyectos en el mercado culinario. diff --git a/P2/Scope_Canvas-PDF.pdf b/P2/Scope_Canvas-PDF.pdf new file mode 100644 index 000000000..637dd6fc6 Binary files /dev/null and b/P2/Scope_Canvas-PDF.pdf differ diff --git a/P2/Scope_Canvas.jpg b/P2/Scope_Canvas.jpg new file mode 100644 index 000000000..f0567216e Binary files /dev/null and b/P2/Scope_Canvas.jpg differ diff --git a/P2/Site_Map.fig b/P2/Site_Map.fig new file mode 100644 index 000000000..5680a8c42 Binary files /dev/null and b/P2/Site_Map.fig differ diff --git a/P2/Site_Map.jpg b/P2/Site_Map.jpg new file mode 100644 index 000000000..f16f7cb70 Binary files /dev/null and b/P2/Site_Map.jpg differ diff --git a/P2/UserTaskMatrix-Excel.xlsx b/P2/UserTaskMatrix-Excel.xlsx new file mode 100644 index 000000000..55945d975 Binary files /dev/null and b/P2/UserTaskMatrix-Excel.xlsx differ diff --git a/P2/UserTaskMatrix-PDF.pdf b/P2/UserTaskMatrix-PDF.pdf new file mode 100644 index 000000000..6251a0404 Binary files /dev/null and b/P2/UserTaskMatrix-PDF.pdf differ diff --git a/README.md b/README.md index 08b42abd8..a2c3f6b4a 100644 --- a/README.md +++ b/README.md @@ -1,11 +1,10 @@ # DIU24 -Prácticas Diseño Interfaces de Usuario 2023-24 (Tema: .... ) +Prácticas Diseño Interfaces de Usuario 2023-24 (Tema: Cursos de Cocina ) -Grupo: DIU1_01AABB. Curso: 2023/24 -Updated: 11/2/2024 +Grupo: DIU1_01MiG's. Curso: 2023/24 +Updated: 11/4/2024 -Proyecto: ->>> Decida el nombre corto de su propuesta en la práctica 2 +Proyecto: Sabor y Saber Descripción: @@ -15,98 +14,131 @@ Logotipo: >>> Opcionalmente si diseña un logotipo para su producto en la práctica 3 pongalo aqui Miembros - * :bust_in_silhouette: AA :octocat: - * :bust_in_silhouette: BB :octocat: + * :bust_in_silhouette: Ángel Muñoz Cortés :octocat: + * :bust_in_silhouette: Ane Anta Iriondo :octocat: ----- - - ->>> Este documento es el esqueleto del report final de la práctica. Aparte de subir cada entrega a PRADO, se debe actualizar y dar formato de informe final a este documento online. Elimine este texto desde la práctica 1 - - # Proceso de Diseño ## Paso 1. UX User & Desk Research & Analisis -![Método UX](img/Competitive.png) **1.a User Reseach Plan** +![**1.a User Reseach Plan**](P1/P1-2b_User_Research_Plan_Template.pdf) ----- ->>> Describe el plan de User Research (cómo se planteas) +Este proyecto tiene como objetivo comprender la demografía, preferencias y comportamientos de personas interesadas en asistir a talleres gastronómicos. +Nosotros nos centraremos en cómo de fácil es para los usuarios realizar tareas básicas la primera vez que encuentran el diseño. +Nuestro público cbjetivo seran principalmente los aficionados a la cocina, los socializadores culinarios y los padres y madres de familias. -![Método UX](img/Competitive.png) 1.b Competitive Analysis +![**1.b Competitive Analysis**](P1/Competitor_Analysis_[DIU23].png) ----- ->>> Describe brevemente características de las aplicaciones que tienes asignadas, y por qué has elegido una de ellas +### Pilsa Educa +Como podemos ver en su sitio web consta de una buena variedad de cursos de alta calidad y donde actualizan con frecuencia los mismos. La página web tiene un diseño bastante intuitivo y consta de un proceso de reserva simple y muchas fotos y videos de los diferentes cursos y la empresa. + +### Granada Cooking +En Granada Cooking consta de mucha variedad de cursos de diferentes cocinas, una buena calidad de contenido aunque no actualizan muy frecuentemente los cursos. Su página web tiene un diseño fácil de usar, un proceso de reserva muy simple e intuitivo y consta de muchas fotos de platos, cursos, instalaciones, etc. -![Método UX](img/Persona.png) 1.c Persona +### Culinary Spain +La variedad de cursos no es muy extensa en Culinary Spain y, aunque la calidad del contenido parece buena, no recibe actualizaciones de nuevos cursos ni nuevo contenido. El diseño es muy simple y para nada intuitivo, el proceso de reserva no es muy complejo pero para nada es simple y no consta apenas de fotos ni mucho menos videos. + +**1.c Persona** ----- ->>> Comenta brevemente porqué has seleccionado a esas personas y sube una captura de pantalla de su ficha +### ![Ainhoa:](P1/Ainhora_persona.jpg) +Ainhoa está abierta a nuevas experiencias, aunque demasiado ocupada, por eso cree que le puede venir bien ir a actividades donde conozca gente y pueda desconectar (como un taller de cocina). -![Método UX](img/JourneyMap.png) 1.d User Journey Map ----- + ### ![Manuel:](P1/Manuel_persona.jpg) +Al ser una persona tímida y apasionada por la cocina, un taller de cocina es la mejor opción para empezar a abrirse a conocer más gente y perder la timidez. +**1.d User Journey Map** +---- ->>> Comenta brevemente porqué has escogido estas dos experiencias de usuario (y si consideras que son habituales) + ### ![Ainhoa:](P1/Ainhoa_journey.jpg) +Lo peor que le puede pasar a alguien que vive estresado por el trabajo y con poco tiempo libre es que el trámite de reserva sea costoso y lento. + + ### ![Manuel:](P1/Manuel_journey.jpg) +A una persona tímida como Manuel, lo que le hace falta es que la persona a cargo o la dinámica del taller tenga en cuenta eso y le empuje a hablar con gente. -![Método UX](img/usabilityReview.png) 1.e Usability Review +[**1.e Usability Review**](P1/Usability-review-template.xlsx) ---- ->>> Revisión de usabilidad: (toma los siguientes documentos de referncia y verifica puntos de verificación de usabilidad ->>>> SE deben incluir claramente los siguientes elementos ->>> - Enlace al documento: (sube a github el xls/pdf) ->>> - Valoración final (numérica): ->>> - Comentario sobre la valoración: (60-120 caracteres) +La página web de Pilsaeduca.com ha obtenido 84 puntos sobre 100, por lo que podemos calificarlo con un sitio web bueno, donde los usuarios deberían poder utilizar este sitio o sistema con relativa facilidad y deberían poder completar la gran mayoría de las tareas importantes. + +Memoria completa [aquí](P1/Práctica_1_UX_User_&_Desk_Research_&_Analisis.pdf) ## Paso 2. UX Design +### 2.a Reframing / IDEACION: Feedback Capture Grid / EMpathy map -![Método UX](img/feedback-capture-grid.png) 2.a Reframing / IDEACION: Feedback Capture Grid / EMpathy map ----- +El principal objetivo de la malla receptora era generar una serie de ideas que definían el rumbo que cogería nuestra empresa. +![](P2/Malla-Receptora.jpg) ->>> Comenta con un diagrama los aspectos más destacados a modo de conclusion de la práctica anterior, +### 2.b ScopeCanvas - Interesante | Críticas -| ------------- | ------- - Preguntas | Nuevas ideas - - ->>> ¿Que planteas como "propuesta de valor" para un nuevo diseño de aplicación para economia colaborativa ? ->>> Problema e hipótesis ->>> Que planteas como "propuesta de valor" para un nuevo diseño de aplicación para economia colaborativa te ->>> (150-200 caracteres) +En nuestro ScopeCanvas recopilamos todo lo necesario para poder seguir avanzando con nuestro proyecto. Algunas de estas directrices son: nuestro propósito general, objetivos a largo, corto y medio plazo, necesidades que preocupan y motivan a los clientes, métricas que seguiremos para evaluar si nuestra evolución es favorable o no y algunas acciones que buscamos que nuestros usuarios lleven a cabo. +![](P2/Scope_Canvas.jpg) -![Método UX](img/ScopeCanvas.png) 2.b ScopeCanvas ----- ->>> Propuesta de valor +### 2.b User Flow (task) analysis -![Método UX](img/Sitemap.png) 2.b User Flow (task) analysis ------ +En nuestra matriz de tareas de usuario, hemos compilado todas las funciones de nuestra página web, asignándoles una prioridad según si se utilizarán antes, durante o después del tour. Este proceso nos permite organizarlas por su importancia relativa y determinar cuáles deberían ser nuestras prioridades. Aquellas que reciban una puntuación más alta serán las más utilizadas, sin importar cuándo se utilicen, por lo que debemos enfocarnos en desarrollarlas primero. Además de esto, dependiendo de la puntuación de cada tarea, se le ha asignado un color, esto es simplemente para distinguir mejor a primera vista cuáles son las más importantes y cuales menos (aunque lo sigue determinando la puntuación). ->>> Definir "User Map" y "Task Flow" ... +* [User Task Matrix](P2/UserTaskMatrix-PDF.pdf) -![Método UX](img/labelling.png) 2.c IA: Sitemap + Labelling ----- +### 2.c IA: Sitemap + Labelling +En el sitemap se presenta la jerarquía que seguirá nuestra página web, con los menús principales y las secciones que se desglosan. Podemos observar que hay algunas secciones que tienen un color verde, esto es simplemente para distinguir que sin estar asociado al club no se podrá acceder a la reserva de cursos privados o formaciones profesionales. ->>> Identificar términos para diálogo con usuario +![](P2/Site_Map.jpg) -Término | Significado -| ------------- | ------- - Login¿? | acceder a plataforma +En el Labelling, explicamos qué son cada una de las secciones de nuestro Sitemap, qué propósito tienen y qué se encontrará el usuario al acceder a ellas. + +* [Labelling](P2/Labelling-PDF.pdf) + + +### 2.d Wireframes + +Al mirar nuestro Task Matrix nos hemos dado cuenta de que tenemos cinco apartados clave, que son los que mayor puntuación han obtenido. Estos son: Página Principal, Curso, Foro, Usuario y Menú de Inicio Sesión. + +*Página principal* + +En la página principal mostramos en la parte superior nuestro logo, junto con los menús principales, seguido del nombre de nuestra empresa y una serie de fotos de los cursos destacados que irán desplazándose hacia la izquierda. Después de esto mostraremos una introducción acerca de nuestra empresa y finalmente un apartado del foro con los temas más destacados tras el cual irá el pie de página. + +![](P2/BOCETOS/Pagina_Principal.jpg) + +*Curso* + +En esta página se situará toda la información pertinente sobre el curso deseado. El usuario dispondrá de una pequeña descripción de dicho taller, junto con las elaboraciones que se llevarán a cabo y el chef que lo impartirá. Tras esto vendrá el precio y las fechas disponibles para realizarlo. Acompañado a todo este texto tendremos una serie de fotos que ilustrarán cómo será el curso. + +![](P2/BOCETOS/Curso.jpg) + +*Foro* + +Esta será la página principal desde la cual se podrá acceder al foro en sí y a la galería compartida, por lo que tendrá un resumen de cada una de estas partes. Respecto al foro, al igual que en la página principal tendremos una serie de temas destacados junto a un buscador. Y en cuanto a la galería compartida dispondremos de dos apartados principales, uno de ellos será una galería con todas las fotos disponibles, y la otra contendrá el curso más reciente que se haya realizado. + +![](P2/BOCETOS/Foro.jpg) + +*Usuario* + +Lo primero que podemos observar en la sección de Usuario será de cuantos seguidores y cuantos seguidos disponemos en el momento, pulsando en cualquiera de ellos, este nos mostrará una lista de los usuarios a los que seguimos o los que nos siguen. Tras esto tendremos un apartado que nos muestre los cursos que hemos marcado como nuestros favoritos y otro en el que tendremos los cursos pendientes de reservar (la cesta). Después vendrá el apartado de las notificaciones, para poder configurarlo como le plazca al usuario y por último, las opciones de cerrar sesión y cambiar la contraseña. + +![](P2/BOCETOS/Cuenta.jpg) + +*Inicio Sesion / Registro* + +Esta es la sección por la que todo usuario deberá pasar para poder acceder a la reserva de un taller, por lo que en ella se pide al usuario que introduzca un nombre de usuario junto con una contraseña. Dispondremos de opciones como ver la contraseña, recordarla y poder cambiarla pulsando “¿Has olvidado tu contraseña?” que facilitarán el inicio de sesión o registro a nuestros clientes. Por último tendremos un botón de enviar, para guardar el inicio de sesión o registro que hayamos realizado. + +![](P2/BOCETOS/Inicio_Sesion-Registro.jpg) -![Método UX](img/Wireframes.png) 2.d Wireframes ------ ->>> Plantear el diseño del layout para Web/movil (organización y simulación ) +Memoria completa [aquí](P2/Práctica_2-Ideación_Y_Diseño.pdf) ## Paso 3. Mi UX-Case Study (diseño)