Create new UXD project

projects/02-uxploradoras/README.md

@@ -0,0 +1,325 @@
+# UXploradoras
+
+## Índice
+
+- [1. Preámbulo](#1-preámbulo)
+- [2. Resumen](#2-resumen)
+- [3. Lo que aprenderás](#3-lo-que-aprenderas)
+- [4. Objetivos de aprendizaje](#4-objetivos-de-aprendizaje)
+- [5. Consideraciones](#5-consideraciones)
+- [6. Alcance](#6-alcance)
+- [7. Documentación para portafolio](#7-documentación-para-portafolio)
+- [8. Pistas, tips y lecturas complementarias](#8-pistas-tips-y-lecturas-complementarias)
+
+---
+
+## 1. Preámbulo
+
+Aunque parezcan invisibles, los principios de diseño visual y diseño UX son los
+pilares técnicos que nos permiten generar productos de alto valor estético y
+funcional. En este proyecto nos enfocaremos tanto en la arquitectura de
+información como en la interface visual de una plataforma digital, para
+profundizar en los aspectos más técnicos que fundamentan nuestras propuestas.
+
+## 2. Resumen
+
+**Tu misión será diseñar un dashboard desde cero, empezando con la jerarquía y
+arquitectura de la información (agrupación, etiquetas, navegación), el diseño de
+la propuesta de interface visual (layout, espaciado, colores, tipografía, etc.)
+y finalmente validación con usuarios.**
+
+En este proyecto quebraremos el proceso de diseño para iniciar desde la
+experimentación, incluyendo a las personas usuarias al final del proceso.
+Es una forma muy eficiente de realizar diseño centrado en las personas,
+pero la clave está en llegar lo más rápido posible a la fase de validación
+y la realices con rigurosidad.
+
+![UXploradoras](https://raw.githubusercontent.com/Laboratoria/bootcamp/main/projects/02-uxploradoras/thumb.png)
+
+## 3. Lo que aprenderás
+
+- Al ser un proyecto corto, es clave definir el alcance y el plan de trabajo a
+nivel general, con detalle de etapas, entregables, tiempos y actividades
+
+- Aprenderás a generar propuestas de diseño desde cero, cuando no existe un
+producto inicial al cual realizarle mejoras, así como a utilizar herramientas
+para pruebas de usabilidad no-moderadas
+
+- Profundizar en principios de diseño visual, accesibilidad, usabilidad,
+arquitectura de información y flujos de usuario
+
+- Diseñar el contenido y guías básicas de voz y tono que apliquen para contenido
+de UX
+
+- Documentar la librería de componentes y patrones reutilizables, usando los
+principios de Atomic Design
+
+### Life Skills
+
+Si bien las 8 habilidades siempre estarán presentes, échale un ojo👀 a estas:
+
+**1. Comunicación eficaz.** Articula y transmite preguntas, pensamientos e ideas
+con claridad y facilitando el diálogo (oral o escrito). Es elocuente y sabe
+dar y recibir feedback.
+
+**2. Iniciativa.** Monitorea, define, prioriza y completa tareas sin supervisión
+directa. Participa de manera activa preguntando y emitiendo opinión. Intenta ir
+más allá de los requisitos mínimos del trabajo. Es diligente, tomando activamente
+el control e intenta siempre solucionar los problemas que surgen.
+
+**3. Autoaprendizaje.** Es capaz de adquirir continuamente nuevos conocimientos
+y habilidades. Puede monitorear sus propias necesidades de aprendizaje y
+encontrar los medios para intentarlo y lograrlo autónomamente. Aprende de los
+propios errores.
+
+**4. Planificación, organización y manejo de tiempo.** Es capaz de estructurar
+una “ruta”, identificar dependencias y posibles impedimentos. Logra priorizar
+y organizar su trabajo de forma adaptativa en lugar de intentar “predecir”.
+
+## 4. Objetivos de aprendizaje
+
+> ℹ️ Esta sección será automáticamente generada en el idioma pertinente, a partir
+> de los objetivos de aprendizaje declarados en [`project.yml`](./project.yml),
+> al crear el repo del proyecto para un cohort en particular usando
+> [`./scripts/create-cohort-project.js`](../../scripts#create-cohort-project-coaches).
+>
+> Acá puedes ver una [lista de todos los objetivos de aprendizaje](../../learning-objectives/data.yml)
+> que contempla nuestra currícula.
+
+## 5. Consideraciones
+
+- No se permite realizar entrevistas ni encuestas, con el fin de que te atrevas
+a realizar el proceso de diseño de forma experimental. Las pruebas de
+usabilidad deben ser no-moderadas.
+
+- Trabajarás en duplas (2 estudiantes), te sugerimos elegir un nombre que las
+represente y facilite identificar tu equipo. No te preocupes, recibirás guía
+para formar tu equipo.
+
+- Cada equipo debe reclutar sus propios usuarios para las pruebas. Trata de
+que sean usuarios potenciales e idealmente testea con 5 personas, de lo
+contrario los resultados pueden estar sesgados o ser insuficientes.
+
+- Cada equipo debe presentar su propia solución, prototipos y tests. Sabemos
+que algunas soluciones serán similares dado que resuelven el mismo reto,
+pero nuestra forma de pensar y resolver es única, atrévete a explorar más
+allá de lo convencional.
+
+## 6. Alcance
+
+Para realizar el proyecto, tendrán que elegir una categoría de producto digital,
+ya que necesitarás plataformas de referencia. Aquí te damos algunas opciones
+pero podrás proponer otras dentro de las categorías definidas:
+
+- **Mercadeo:** Monitoreo de métricas relevantes para mercadeo.
+Algunos ejemplos: [Semrush](https://www.semrush.com/analytics/overview/?q=ebay.com&searchType=domain),
+[Unbounce](https://agencyanalytics.com/integrations/unbounce),
+[Mixpanel](https://mixpanel.com/blog/mixpanel-marketing-analytics/)
+
+- **Deportes y salud:** Aplicaciones enfocadas en indicadores de actividad
+física y salud. Ejemplos: [Samsung health](https://play.google.com/store/apps/details?id=com.sec.android.app.shealth&hl=en&gl=US&pli=1),
+[Flo health](https://app.flo.health/?utm_source=google&utm_medium=cpc&utm_campaign=&utm_content=02c&utm_term=2&gad_source=1&gclid=CjwKCAjwzN-vBhAkEiwAYiO7oB8LmUS-VkVbbVAZ0UR_-eHsLz1cxzhIp-untRWmJlfxTVSEg_qyUxoCnOEQAvD_BwE),
+[Nike Training Club](https://www.nike.com/ntc-app)
+
+- **Finanzas:** Finanzas personales o aplicaciones bancarias modernas.
+Ejemplo: [Splitwise](https://www.splitwise.com/),
+[iSaveMoney](https://isavemoney.app/),
+[Nequi](https://www.nequi.com.co/)
+
+El proyecto está dividido en hitos, los cuales son como marcas de kilómetros en
+las carreteras, donde tú decides qué tan lejos quieres llegar. La decisión es
+tuya y dependerá del tiempo que tengas disponible día a día, de tu ritmo de
+aprendizaje y de la profundidad que quieras alcanzar.
+
+**Realizar los hitos obligatorios es indispensable para considerar el proyecto
+como completado, los demás hitos son opcionales, ya que son para profundizar
+o explorar otras habilidades.**
+
+Durante los diferentes avances, o al cierre del proyecto, debes presentar
+documentación que demuestre lo que hiciste de forma tangible y cumpliendo
+con los criterios de aceptación, los cuales existen para que puedas
+auto-validar si realmente alcanzaste el resultado deseado.
+
+### Hito 1: Proyecto (obligatorio)
+
+Organizarnos cuando no existe una solicitud específica de parte del negocio
+puede ser muy retador, pero sigue siendo clave para sacar el máximo provecho
+de nuestro tiempo.
+
+**Criterios de aceptación:**
+
+1. Resumen del alcance general del proyecto, con detalle de posibles entregables
+y un plan de trabajo con listado de tareas por realizar.
+
+*No todo el tiempo es necesario invertir el mismo esfuerzo en cada etapa del
+proceso de diseño. Utiliza como guía los OAs que quieres potenciar durante
+el proyecto para definir el tiempo que vas a dedicar en cada etapa.
+Por ejemplo: quieres fortalecer tus habilidades de prototipado y diseño UI,
+planifica desde el principio un análisis breve y una fuerte profundización
+en exploración visual.*
+
+### Hito 2: Análisis de lo existente (obligatorio)
+
+¿Cómo entender a los usuarios de productos que aún no existen? Analizando
+productos de competidores u otras herramientas que usan para resolver sus
+necesidades.
+
+**Criterios de aceptación:**
+
+1. Análisis de dashboards de referencia, donde identifiques las funcionalidades
+clave de este tipo de producto digital
+
+2. Investigación de escritorio sobre dolores de usuario de la categoría que
+hayas elegido
+
+### Hito 3: Propuesta de diseño (obligatorio)
+
+Debes proponer una solución que se pueda diseñar en el tiempo del proyecto,
+asegurando que resuelva los problemas prioritarios.
+
+**Criterios de aceptación:**
+
+1. Múltiples ideas de solución y criterios para priorizarlas. Las ideas pueden
+ser frases o bocetos en papel y lápiz que representen la solución
+
+2. Diagramas de flujo de usuario y arquitectura de información (categorías,
+etiquetas, navegación)
+
+3. Detalle de cómo la propuesta respeto los principios de usabilidad
+
+4. Guía básica de voz y tono aplicado al producto digital
+
+5. Propuesta de textos (micro-copy), iconos e imágenes
+
+6. Prototipo básico* enfocado en la arquitectura de información
+
+*Un prototipo básico es aquel donde se puede navegar entre pantallas e incluye
+el contenido y funcionalidades más relevantes, sin incluir detalles visuales
+como color, tipografía, etc.
+
+### Hito 4: Prototipado (obligatorio)
+
+Una vez que tengas clara la estructura de tu propuesta, es momento de integrar
+los elementos visuales necesarios para potenciar una buena experiencia de uso.
+
+**Criterios de aceptación:**
+
+1. Moodboard con referencias visuales que funcione como inspiración para tu UI
+
+2. Guía visual con especificaciones de los elementos gráficos: paleta de colores,
+tipografías, layout y espaciado entre elementos (márgenes internos: padding /
+márgenes externos: margin)
+
+3. Prototipo navegable de alta fidelidad con interacciones básicas (cambio de
+pantalla, atrás, etc.). Debe incluir una versión para web y otra para mobile o
+tablet
+
+4. Explicación donde demuestres como aplicaste los principios básicos de
+accesibilidad en tu propuesta (perceptibilidad y operabilidad)
+
+5. Librería de componentes (UI Kit) construida bajo los principios de Atomic Design
+
+### Hito 5: Validación (obligatorio)
+
+Es vital que realicemos validaciones de nuestras propuestas, especialmente con
+productos construidos desde cero. Para ello es necesario que planifiques tus
+pruebas de usabilidad no-moderadas, de forma que obtengas información de
+usuario que respalde las decisiones de diseño que tomaste de forma experimental.
+
+**Criterios de aceptación:**
+
+1. Documento con el detalle del plan de investigación, que incluya los
+objetivos de investigación, perfil del usuario meta y tamaño de la muestra
+
+2. Guía de tareas que realizarán los usuarios en las pruebas de usabilidad y
+evidencia de que validaron estas guías con una persona externa al equipo
+(idealmente un usuario)
+
+3. Prueba de usabilidad no-moderada con al menos 5 personas (guerrilla o
+usuarios potenciales)
+
+4. Identificar tasas de error y otras métricas de diseño relevantes en las
+pruebas de usabilidad
+
+5. Síntesis de resultados, donde se muestren los patrones identificados, las
+observaciones y hallazgos (en caso de que existan)
+
+*En este proyecto, este será el momento en el que involucres a los usuarios de
+forma directa. Asegúrate de seguir las mejores prácticas para pruebas de
+usabilidad.*
+
+### Hito 6: Sistemas y librerías de diseño (opcional)
+
+Si quieres profundizar en la sistematización de componentes, explora Material
+Design y utilízalo en la construcción de tu propuesta.
+
+**Criterios de aceptación:**
+
+1. Modifica los estilos de Material Design según tu propuesta de diseño
+([theme builder](https://m3.material.io/theme-builder#/custom))
+
+2. Descarga y utiliza la librería de [Material Design](https://m2.material.io/design/communication/data-visualization.html)
+para dashboards
+
+## 7. Documentación para portafolio
+
+Durante el bootcamp irás desarrollando proyectos para fortalecer o construir
+tu portafolio como diseñadora UX, por eso es importante que al cierre de
+cada uno te tomes el tiempo para documentarlo como caso de estudio desde
+la perspectiva técnica. Considera incluir la siguiente información:
+
+- Diferenciar claramente que fue un proyecto técnico, sin colaboración con
+la empresa
+
+- El concepto de diseño visual y los principios técnicos que fundamentan la
+propuesta de diseño
+
+- Bocetos, diagramas, wireframes, pantallas y demás elementos visuales que
+explican la propuesta
+
+- Resultados de la validación con personas usuarias y lo que consideras
+que aún debe iterarse
+
+- Tus aprendizajes personales, tanto técnicos como en habilidades para la vida
+
+**Esta documentación será indispensable para tu sesión de Project Feedback al
+cierre del proyecto. No te preocupes por hacerlo perfecto, seguirás iterándolo
+durante todo el Bootcamp. [Acá puedes encontrar una guía →](https://laboratoria1.gitbook.io/job-search-preparation-ux-es/ruta-a-busqueda-de-vacantes/practica-simulacion-tech-mentor-a-1)**
+
+## 8. Pistas, tips y lecturas complementarias
+
+Durante el desarrollo del proyecto, las coaches estaremos compartiendo
+información por Slack y en los espacios síncronos que sean necesarios. Además,
+siéntete libre de complementar con recursos que investigues por tu cuenta y
+compartirlo para todas 🤓
+
+### Recursos y temas relacionados
+
+- Contenido sobre
+  [arquitectura de información →](https://coda.io/d/Bootcamp-UX-Contenido_dqkqk2rV9Z2/Arquitectura-de-la-informacion_suNmQ#_luq24)
+- Contenido sobre
+  [UI Kit](https://coda.io/d/Bootcamp-UX-Contenido_dqkqk2rV9Z2/UI-kit-y-sistema-de-diseno_suIXG#_luzb-)
+  y [accesibilidad →](https://coda.io/d/Bootcamp-UX-Contenido_dqkqk2rV9Z2/Accesibilidad_suKsx#_luenB)
+- Contenido sobre
+  [pruebas de usabilidad](https://coda.io/d/Bootcamp-UX-Contenido_dqkqk2rV9Z2/Testeos-con-usuarios_suLAI#_lu1kF)
+  y [métricas de UX →](https://coda.io/d/Bootcamp-UX-Contenido_dqkqk2rV9Z2/Metricas-de-UX_suhXY#_lu8O8)
+- Contenido sobre
+  [voz y tono aplicado a UX →](https://coda.io/d/Bootcamp-UX-Contenido_dqkqk2rV9Z2/Ux-Writing-Ux-Content_sucf6#_lunFr)
+
+### Preguntas detonadoras
+
+Luego de leer esta información, te dejamos acá algunas preguntas para
+reflexionar antes de iniciar el proyecto. En caso de que tengas dudas,
+por favor llévalas al espacio de Q&A que tendremos próximamente:
+
+- ¿Cuál es la principal diferencia respecto al proyecto anterior?
+- ¿Cuáles habilidades clave podrás practicar esta vez?
+- ¿Tienes claridad sobre los Objetivos de Aprendizaje del proyecto?
+- ¿Comprendes el contenido de cada hito?
+- ¿El proyecto te despierta curiosidad? ¿En qué?
+
+**Aprovecha la oportunidad de enfocarte en áreas que sientas aún retadoras,
+para potenciar al máximo tu experiencia de aprendizaje y fortalecer OAs que no
+hayas podido profundizar anteriormente. Cuentas con nuestra guía en todo este
+proceso, pero especialmente, con el talento y empatía de todas tus compañeras
+para enriquecer aún más esta comunidad de aprendizaje! 🙌💛**

projects/02-uxploradoras/project.yml

@@ -0,0 +1,22 @@
+track: ux
+learningObjectives:
+  - agile-planning/scope
+  - agile-planning/workplan
+  - agile-planning/tasks
+  - business-understanding/benchmark
+  - design-concept/design-references
+  - design-concept/ideate
+  - design-concept/prioritize-ideas
+  - interaction-design
+  - interface-design
+  - content-design
+  - design-prototype/basic-prototypes
+  - design-prototype/high-fidelity
+  - design-prototype/ai-plugins
+  - research-planning/research-plan
+  - research-planning/research-sample
+  - research-planning/participants
+  - usability-analysis/non-moderated-testing
+  - design-pitch
+  - design-specs
+  - design-systems