PROPUESTA DE DISEÑO DE INTERFAZ DE USUARIO (UI) PARA EL SITIO WEB DE CHOCOLATES PARA TI A TRAVÉS DE LA METODOLOGÍA DE ATOMIC DESIGN

INTRODUCCIÓN 1 1. ANTECEDENTES 1 2. JUSTIFICACIÓN 2 3. SITUACIÓN PROBLÉMICA 3 4. FORMULACIÓN DEL PROBLEMA DE INVESTIGACIÓN O PREGUNTA CIENTÍFICA 4 5. OBJETIVOS 4 5.1. OBJETIVO GENERAL 4 5.2. OBJETIVOS ESPECÍFICOS 4 6. DISEÑO METODOLÓGICO 4 6.1. TIPO DE INVESTIGACIÓN 4 6.2. MÉTODOS 4 ANÁLISIS Y SÍNTESIS 4 INDUCCIÓN Y DEDUCCIÓN 5 OBSERVACIÓN 5 6.3. TÉCNICAS 5 OBSERVACIÓN 5 ANÁLISIS DOCUMENTAL O BIBLIOGRÁFICO 5 ESTUDIO DE CASO 6 6.4. INSTRUMENTOS 6 GUÍA DE OBSERVACIÓN 6 DIARIO DE CAMPO 6 INFORMES OFICIALES 6 CAPÍTULO I 7 MARCO TEÓRICO Y CONTEXTUAL 7 1.1. MARCO CONCEPTUAL 7 1.1.1. INTERACCIÓN HUMANO COMPUTADOR 7 1.1.2. EXPERIENCIA DE USUARIO (UX) 7 1.1.3. USABILIDAD 8 1.1.4. ACCESIBILIDAD 9 1.1.5. INTERFAZ DE USUARIO 9 1.1.6. DISEÑO MODULAR 10 1.1.7. ATOMIC DESIGN 10 1.1.8. SISTEMAS DE DISEÑO 12 1.1.9. PROTOTIPO 13 1.2. MARCO TEÓRICO 14 1.2.1. DESIGN THINKING 14 1.2.2. TEORÍA DEL COLOR 15 1.2.3. COMPOSICIÓN VISUAL 16 1.2.4. PRINCIPIOS DE DISEÑO 16 1.2.5. LAS DIEZ HEURÍSTICAS DE JAKOB NIELSEN 18 1.3. MARCO CONTEXTUAL 20 1.3.1. LA INDUSTRIA DEL CHOCOLATE EN BOLIVIA 20 1.3.2. SUCRE CIUDAD DEL CHOCOLATE 20 1.3.3. CHOCOLATES PARA TI: SITIO WEB 21 CAPÍTULO II 22 DIAGNÓSTICO 22 2.1. INTRODUCCIÓN 22 2.2. RECOLECCIÓN Y ANÁLISIS DE DATOS 22 2.2.1. RESULTADOS DEL ANÁLISIS DOCUMENTAL 22 2.2.2. RESULTADOS DE LA EVALUACIÓN HEURÍSTICA DE LA INTERFAZ DE USUARIO DEL SITIO WEB DE CHOCOLATES PARA TI, BASADO EN LOS PRINCIPIOS DE JAKOB NIELSEN Y PRINCIPIOS DE DISEÑO QUE MEJORAN LA EXPERIENCIA DE USUARIO 24 2.2.3. RESULTADOS DEL ESTUDIO DE CASO: SITIOS WEB DE NATRA Y VALRHONA 36 2.2.4. CONCLUSIONES GENERALES DEL DIAGNÓSTICO 44 CONCLUSIONES Y RECOMENDACIONES 45 CONCLUSIONES 45 RECOMENDACIONES 46 REFERENCIAS BIBLIOGRÁFICAS 48 ANEXOS 51 ANEXO NO 1. ADAPTABILIDAD 52 ANEXO NO 2. ATOMIC DESIGN 53 ANEXO NO 3. PROTOTIPO DE INTERFAZ DE USUARIO. 56   ÍNDICE DE GRÁFICOS Figura 1 Metodología de Atomic Design 12 Figura 2 Círculo cromático por armonías 16 Figura 3 Tráfico y Comportamiento del sitio web Chocolates para Ti 23 Figura 4 Visitas por países al sitio web de Chocolates para TI 23 Figura 5 Átomos 53 Figura 6 Moléculas 53 Figura 7 Organismos 54 Figura 8 Plantillas 54 Figura 9 Páginas 55   ÍNDICE DE TABLAS Tabla 1 Análisis del Informe de SimilarWeb 23 Tabla 2 Notas de evaluación para la guía de observación 24 Tabla 3 Guía de observación: Las heurísticas de Jakob Nielsen 33 Tabla 4 Guía de observación: principios de diseño 34 Tabla 5 Diario de campo: Análisis de la interfaz de los sitios web Natra y Valrhona 36

Con el paso del tiempo la tecnología ha ido evolucionando y también la forma en la que interactuamos con ella lo ha hecho, dando lugar a herramientas tecnológicas indispensables para las empresas en esta era digital, como lo son los sitios web. Donde la interfaz de usuario juega un papel muy importante ya que es a través de ella que se puede interactuar con dichas herramientas tecnológicas como lo son los sitios web. Por lo tanto, es fundamental tener en cuenta una interfaz de usuario bien diseñada el cual brinde una experiencia positiva para los usuarios. De lo contrario un diseño mal realizado puede generar problemas tanto para los usuarios como para la empresa ya que no se llega a aprovechar adecuadamente el potencial de los sitios web, lo que supone una desventaja en esta era digital. Teniendo en cuenta la importancia de la interfaz de usuario, en esta presente investigación se analiza la interfaz de usuario del sitio web de Chocolates Para Ti, de esta manera identificando las áreas problemáticas y deficiencias en su diseñó, con el objetivo de proponer soluciones para mejorar la interfaz de usuario del sitio web. De modo que se realiza una propuesta de diseño de interfaz de usuario utilizando la metodología de Atomic Design el cual es indispensable en este proceso, teniendo como resultado final un prototipo de alta fidelidad donde se pueda interactuar con ella, dándonos una visión clara de cómo mejorar la interfaz de usuario del sitio web de Chocolates Para Ti, y de esta forma también mejorar la experiencia del usuario en el sitio web.