Aurora Adviser
| Título | Aurora Adviser |
|---|---|
| Tipo de Proyecto | Proyecto de Taller |
| Palabras Clave | comunidad |
| Período | 2024-2024 |
| Asignatura | Taller de Diseño de Interacción |
| Del Curso | Taller de Diseño de Interacción 2024 |
| Carreras | Diseño |
| Alumno(s) | Francisca Loyola, Valentina Leiva, Anaís Arancibia, Li Ann Montenegro, Paloma Álvarez, Valeria Muñoz Valdivia, Antonia Olguin Cantillana, Barbara Suazo, Katalina Gajardo |
| Profesor | Herbert Spencer |
| Archivo:Gestión Carta Gantt Aurora Adviser .pdf | |
| URL | https://aurora-adviser.com/ |
Aurora Adviser
Tomando como referencia el enfoque colaborativo de las travesías, donde se construye una obra en común con la participación de múltiples personas, el proyecto actual tiene como objetivo el desarrollo de una herramienta avanzada para identificar "black patterns" (también conocidos como patrones negativos) en diversos sitios web. Para llevar a cabo esta tarea, en base a lo mencionado en un principio, se dividirán las responsabilidades en áreas especializadas, abarcando Tecnologías de la Información (TI), Diseño de Interfaz de Usuario (UI) y Arquitectura de la Información (AI). Teniendo como objetivo el crear una plataforma integral que permita a los usuarios detectar y comprender estos patrones negativos, fomentando una experiencia en línea más transparente y ética.
¿Qué es Aurora Adviser?
Aurora hace referencia al universo de páginas web que utilizan prácticas engañosas y manipuladoras, conocidas como "black patterns" o patrones oscuros. Por otro lado, Adviser actúa como un defensor comprometido a proteger a los usuarios de este espacio digital.
Por ende, Aurora Adviser se convierte en la estrella que ilumina el camino de los usuarios, alertando y equipándolos con herramientas necesarias para navegar con seguridad y discernimiento en la web. Con un enfoque dedicado en promover la transparencia y la educación, siendo un valioso recurso para aquellos que buscan una experiencia digital más informada y protegida.
Objetivos
"Educación y Concientización"
"Proteger a los Usuarios"
AURORA tiene como objetivo principal proporcionar a los usuarios la oportunidad de poder participar en una plataforma integral para identificar, educar y concientizar sobre los patrones oscuros presentes en los sitios web en los que navegan, a través de esta página y la extensión compuesta por un agente de interfaz amigable. A partir de esto, los usuarios podrán detectar y recibir advertencias sobre prácticas de diseño engañosas o manipulativas, permitiéndoles tomar decisiones informadas mientras navegan por la web, además, la página ofrecerá estos recursos con el fin de obtener resultados educativos que ayudarán a los usuarios a comprender mejor qué son los patrones oscuros con los que se encuentran y cómo poder reconocerlos en el momento en que se presentan.
El equipo detrás de AURORA también tendrá la capacidad de reportar estos sitios web que utilicen estas prácticas negativas, contribuyendo así a una base de datos más amplia y la responsabilidad existente al navegar por estos sitios. A su vez, a través de la integración con la comunidad, los usuarios podrán participar en espacios generados para poder reportar estas prácticas encontradas, facilitando al equipo poder tomar estos reportes para mantener y fomentar un entorno de colaboración para mejorar continuamente la experiencia del resto de los usuarios.
La página compromete entonces, a mantenerse actualizada con las tendencias y evoluciones dentro de la misma proporcionando un seguimiento activo y actualizaciones sobre los casos reportados y nuevas prácticas identificadas en conjunto, tanto con el trabajo del equipo de AURORA como con la comunidad de usuarios dispuestos a contribuir con ello, logrando así que estos esfuerzos buscan promover un entorno en línea mucho más transparente, ético, seguro y centrado en el usuario.
Contenido: Patrones oscuros
A partir de una investigación llevada por el Taller de Interacción en 2020, se ahondo en detalle los contenidos obtenidos. Como resultado de este análisis, se ha identificado una serie de patrones negativos, también conocidos como "Dark patterns", que servirán como punto de partida y base para el desarrollo de AURORA. Estos patrones han sido clasificados, teniendo en cuenta su naturaleza y su impacto en la experiencia del usuario. Dicho lo anterior, los patrones oscuros son una estrategia de diseño de interfaces que tiene como objetivo manipular o engañar a los usuarios para que realicen acciones que de otra manera no harían. Estas técnicas suelen ser utilizadas en sitios web o aplicaciones para influir en el comportamiento del usuario de una manera que beneficie al diseñador o a la empresa, pero que puede ser perjudicial o frustrante para el usuario.
Características
Los patrones oscuros pueden llevar a los usuarios a tomar decisiones no deseadas, como suscribirse involuntariamente a servicios o revelar información personal no deseada. Reconocer estas tácticas es esencial para protegerse y navegar por la web con mayor seguridad y discernimiento. A continuación, se explorarán algunas de las características clave que definen estos patrones oscuros y cómo identificarlos para evitar caer en sus trampas.
- Engaño o confusión: Los dark patterns suelen involucrar prácticas engañosas, como ocultar información importante, utilizar lenguaje confuso o manipulador, o hacer que ciertas opciones sean difíciles de encontrar.
- Presión psicológica: Pueden aprovecharse de la urgencia, la ansiedad o el miedo del usuario para motivarlos a tomar una acción rápida sin pensar demasiado.
- Manipulación de la elección: A menudo presentan opciones diseñadas para dirigir al usuario hacia una acción específica que beneficie al diseñador, mientras que otras opciones pueden ser menos deseables o incluso perjudiciales para el usuario
- Dificultad para deshacer acciones: A veces, los dark patterns hacen que sea difícil o confuso para el usuario deshacer una acción o cancelar un proceso, lo que puede llevarlos a seguir adelante incluso si ya no lo desean.
- Beneficio unilateral: Por lo general, los dark patterns benefician principalmente al diseñador o a la empresa detrás del sitio web o la aplicación, a menudo a espaldas del usuario, su privacidad o su experiencia.
Cómo identificarlos
La identificación de los patrones oscuros en la web suele requerir atención y esfuerzo por parte del usuario. Sin embargo, para facilitar esta tarea, existen ciertas características específicas que pueden ser buscadas y tomadas en consideración al identificar tales patrones:
- Falta de transparencia
- Presión para tomar decisiones rápidas
- Errores o dificultades al intentar realizar acciones reversibles
- Lenguaje engañoso o confuso
- Experiencia del usuario frustrante
- Comentarios de otros usuarios
Tipos de Patrones Oscuros
Formularios de suscripción engañosos
Algunos sitios web utilizan casillas de verificación premarcadas o lenguaje confuso en formularios de suscripción para inducir a los usuarios a inscribirse en boletines informativos o servicios adicionales sin su consentimiento claro.
1. Lenguaje poco claro
2. Casillas premarcadas por defecto
Las casillas premarcadas para obtener permisos del usuario son tácticas que aprovechan la tendencia de aceptar rápidamente sin revisar detenidamente, o incluso evitar poder realizar más acciones dentro de la pagina si no tienes al menos una casilla marcada.
Proceso de compra manipulador
Las tiendas en línea pueden agregar automáticamente productos adicionales al carrito de compras sin el consentimiento explícito del usuario, o hacer que sea difícil encontrar la opción para eliminarlos, aprovechando la urgencia del proceso de compra.
1. Cargos no deseados para los usuarios
Se ofrece la opción de cancelar en letras pequeñas, y se prioriza visualemente mantener activa la suscripción
2. Productos adicionales en el carrito de compras
Si el usuario hace clic por equivocación a algun productos ofrecido por el servicio, pasando a llevar "Agregar al carrito", el artículo seleccionado se agrega automáticamente al carrito de compras, sin necesidad de confirmación adicional. La ventana emergente utiliza letras pequeñas y desaparece rapidamente dificultando la trasparencia para los usuarios.
Ventanas emergentes y pop ups intrusivos
Algunos sitios web muestran pop-ups intrusivos que dificultan la navegación, o que no tienen una opción clara para cerrarlos, interfiriendo con la experiencia del usuario.
1. Ventanas emergentes
2. Pop ups intrusivos
Los pop-ups intrusivos interrumpen la experiencia en línea al aparecer de forma repentina, bloqueando el contenido y obligando al usuario a interactuar con ellos. Esta táctica, busca generar clics o conversiones a expensas de la comodidad del usuario y su satisfacción.
Renovaciones automáticas de suscripción
Algunos servicios en línea ocultan la información sobre la renovación automática de suscripciones o hacen que sea difícil cancelarlas, lo que puede llevar a cargos no deseados en la cuenta del usuario.
1. Renovaciones automáticas de suscripción
La suscripción se presume activa si no se realiza la cancelacion del servicio, y la opción de cancelar la suscripción se presenta indirectamente en letras pequeñas.
2. Dificultad para cancelar la suscripción
Se realiza un cargo adicional por cobro de servicio, sin aviso ni consulta al usuario
Ocultar opciones de privacidad
Plataformas en línea pueden hacer que sea difícil encontrar o ajustar la configuración de privacidad, o pueden obligar a los usuarios a aceptar términos y condiciones extensos sin opción de rechazo, comprometiendo la privacidad del usuario.
1. Dificultar la configuración de privacidad
2. Términos y condiciones extensos y complejos
Los términos y condiciones son largos porque intentan cubrir una amplia gama de temas legales y de usuario, lo que puede hacer que los usuarios no se den cuenta de todas las implicaciones legales del sistema al aceptarlos rápidamente.
Los términos legales extensos suelen presentarse ocultando información clave entremedio de mucha más información, usando lenguaje complejo y marcando la aceptación por defecto, lo que puede llevar a los usuarios a aceptarlos sin leerlos o comprender sus implicaciones.
Investigación de usuario
Con el propósito de fortalecer y consolidar los fundamentos de nuestro proyecto, decidimos realizar una encuesta con el fin de recopilar los datos acerca la conciencia existente sobre los “dark patterns” y, a su vez, con el fin educativo de hacerlo visible y generar un dialogo enriquecedor en torno a este tema a través de la participación activa de los encuestados, logramos obtener opiniones y relatos que enriquecieron nuestra comprensión de los desafíos enfrentados en el ámbito de la transparencia en línea.
Encuestas
Los resultados obtenidos a partir de las encuestas realizadas ayudan a dar cuenta de la cantidad de personas que no conocen del tema y las anecdotas existentes detrás de esta poca comprensión general de la materia. Esta constatación resalta la urgente necesidad de contar con un agente capaz de alertar a los usuarios sobre la presencia de patrones oscuros en la web. La diversiada y cantidad de malas experiencias demuestran esta necesidad que debe ser intervenida demanera crucial, para proteger a los usuarios de manera activa e informada en su navegacion por el entorno digital.
Introducción de la encuesta
Para comenzar, ¿Qué es un "dark pattern"?: Un "dark pattern" o patrón oscuro corresponde a una técnica diseñada en redes sociales, páginas web, apps, etc. Que manipula sutilmente a los usuarios para que tomen decisiones engañosas y que pueden ser perjudiciales para ellos Algunos ejemplos de las consecuencias de caer en un patrón oscuro son: compras involuntarias, decisiones no deseadas, revelación de información personal no deseada, dificultades para cancelar servicios o eliminar cuentas.
Pregunta 1: ¿Conocías antes lo que era?
| No | Sí |
|---|---|
| 19 | 5 |
| Advertencias | Notificaciones | Otros |
|---|---|---|
| 18 | 5 | 1 |
Pregunta 3: ¿Conoces alguna experiencia cercana o lejana relacionada con esto? Cuéntanos
| Engaño o confusión | Dificultades para deshacer acciones | Presión Psicológica |
|---|---|---|
|
|
|
Mapa de empatía
Basándose en las encuestas realizadas para indagar si los usuarios han sido víctimas de patrones oscuros, se elabora un mapa de empatía con el fin de comprender a fondo las necesidades, deseos, preocupaciones y comportamientos de este grupo de personas. Este ejercicio permite obtener una representación visual y detallada de la experiencia del cliente o usuario, lo que facilita la identificación de oportunidades para integrar en Aurora Adviser, tales como servicios o experiencias. Este enfoque centrado en el usuario contribuye a mejorar la efectividad y relevancia de Aurora Adviser al adaptarse mejor a las necesidades y expectativas de los usuarios.
¿Qué piensa o siente?
Confusión y frustración al momento de realizar acciones no deseadas. Desconfianza al darse cuenta de que han sido engañados, haciendo que duden de la integridad y la credibilidad del sitio en el que están navegando. Produce en ellos una sensación de impotencia al sentirse expuestos por sufrir de engaños y manipulaciones en línea. Molestia y percepciones negativas ante la web o la página en general.
¿Qué ve?
El usuario que se ve afectado por patrones oscuros puede notar una serie de señales o comportamientos en la interfaz y la experiencia de usuario como lo pueden ser los mensajes engañosos que intentan persuadirlo. El usuario puede notar el ocultamiento de información importante o información que se presenta de manera poco clara, lo cual dificulta la toma de decisiones dentro de la página, a su vez puede notar una dificultad para tomar estas decisiones o simplemente se le hace difícil abandonar la página web. El usuario puede ver como en el sitio web existe una presión para que este mismo tome decisiones rápidas, las cuales pueden afectar y causar una toma de decisiones impulsivas y el aprovechamiento de la ansiedad generada por la presión para aprovecharse del mismo.
¿Qué escucha?
“Este sitio web usa la manipulación para realizar compras no deseadas, ten cuidado” “para la próxima revisa mejor los términos y condiciones de este servicio” “¿pero no leíste bien lo que decía antes de aceptar?” “Yo tampoco pude borrar mi cuenta en esa red social, es complicado”
¿Qué dice o hace?
“me atacaron los troyanos cuando descargue un programa que decía ser 100% confiable”, “no me paran de llegar correos de esta página a la que me metí la semana pasada, es bastante molesto” Tomar medidas significativas como denunciar el suceso o contactarse con el servicio al cliente del sitio web en un intento de encontrar una solución. Intentar protegerse de futuras manipulaciones en línea buscando información o recursos.
Pain Points
Dificultad para volver a confiar en una navegación virtual segura o las prácticas de marketing de los sitios en la web. Sensación de exposición y vulnerabilidad al entregar datos personales o financieros. Impacto en la salud mental al sentir un aumento en el estrés, la ansiedad y la depresión en caso de sufrir algún daño impactante a causa de una mala decisión tomada en línea guiada por patrones oscuros.
Gain Points
Mayor conciencia y precaución acerca de los patrones oscuros. Una actitud más cautelosa con respecto al tipo de decisiones e información que se comparte en las páginas en línea. Mayor facilidad para identificar cuando el usuario está frente una táctica de un patrón oscuro o no. Toma de decisiones que involucren la implementación de sistemas externos que contribuyan a la seguridad de la privacidad y los datos personales del usuario con el fin de protegerse de los sitios web no seguros.
Perfil de ususario
Basándose en el análisis llevado a cabo mediante el mapa de empatía y las encuestas, se crean cuatro historias de usuarios que representan la perspectiva del público objetivo final. Cada una de estas historias describe una funcionalidad o característica deseada desde el punto de vista del sujeto, permitiendo el desarrollo del proyecto de manera más efectiva.
Difusión
En Aurora Adviser, se toma en cuenta la importancia de estar conectados con la comunidad en la web y de mantener a los usuarios informados sobre las últimas novedades en el amplio mundo de los patrones oscuros. Para ello, se ha integrado dentro del campo de difusión diversos canales y redes sociales, a través de estas plataformas, Aurora Adviser se asegura que los usuarios estén al tanto de las últimas tendencias y consejos, ofreciéndote contenido valioso y accesible en todo momento:
Instagram: Actua como un espacio visual donde compartimos contenido atractivo y educativo a través de publicaciones, reels de videos educativos, e historias diarias e interactivas con contenido rápido y efímero.
Twitter: Es una plataforma que ofrece contenido diario a través de tweets diarios, hilos informativos con explicaciones más detalladas acerca de los temas en discusión de los patrones oscuros y una interacción más cercana con la comunidad al fomentar el intercambio de respuestas.
Facebook: Actúa como una plataforma versátil donde se combinan los diferentes tipos de contenido y funciones disponibles para mantener a los usuarios informados, como lo pueden ser publicaciones regulares de artículos, noticias y actualizaciones, grupos de discusión y espacios donde los usuarios puedan unirse a esta comunidad para compartir experiencias, consejos y hacer preguntas al respecto.
Look & Feel
A continuación, se definirá los elementos que contribuirán a la apariencia visual y la experiencia inmersiva que caracterizará a “Aurora Adviser”. Este proceso implica la selección y configuración de aspectos gráficos clave, incluidos los elementos tipográficos que determinarán la legibilidad y el estilo textual, la paleta de colores que establecerá el tono y la atmósfera visual. Junto con estos aspectos visuales, se fusionarán permitiendo definir la identidad distintiva y la experiencia inmersiva que Aurora Adviser aspira a ofrecer a los usuarios.
Lenguaje y etiquetado
Para que la extensión Aurora sea accesible y útil para todos los usuarios, es fundamental elegir un lenguaje y etiquetas de comunicación adecuadas. En este sentido, se propone emplear un lenguaje claro y conciso, evitando tecnicismos y jerga que puedan confundir a usuarios no expertos. Es importante utilizar ejemplos cotidianos y analogías para explicar conceptos complejos de manera más accesible.
Asimismo, se debe mantener un tono neutral y objetivo, evitando opiniones o juicios personales. En su lugar, se debe enfocar en los beneficios de usar Aurora y cómo puede ayudar a los usuarios, en lugar de centrarse en los aspectos negativos de los patrones oscuros. Por último, es importante utilizar un lenguaje inclusivo que no discrimine por género, raza, origen o cualquier otra característica personal.
En cuanto a las etiquetas de comunicación, se propone utilizar etiquetas descriptivas que describan claramente la función de cada elemento de la extensión. Las etiquetas deben proporcionar información útil al usuario, sin ser demasiado extensas o redundantes. Finalmente se propone utilizar un estilo de escritura atractivo y llamativo que invite a los usuarios a interactuar con la extensión.
Paleta de color
Visualización de paleta
Tipografía
Logo
Concepto agente
Variantes de agente
Desarrollo de página: Aurora Adviser
Considerando que AURORA será implementada tanto como una plataforma oficial independiente como una extensión. Actualmente está en una fase de exploración de alternativas viables para su desarrollo. Este proceso implica la evaluación meticulosa de diferentes opciones de plataformas y herramientas que puedan albergar y respaldar eficientemente el desarrollo de ambos componentes.
Una de las decisiones es utilizar Visual Studio Code como el entorno de desarrollo integrado principal, respaldado por GitHub como plataforma colaborativa centralizada para la división de Tecnologías de la Información (TI).
La navegación existente en la pagina web se resume en una página principal la cual ofrece una experiencia integral de opciones desplegables a través de una interfaz fluida que permiten al usuario un acceso rápido e informativo, donde puede encontrar desde recursos educativos acerca de los patrones oscuros, ejemplos visuales de los tipos de patrones que pueden encontrarse en la web, ser parte del equipo curador de AURORA hasta la oportunidad de descargar una extensión que permite la participación activa de este sistema para asistir al usuario con la detección de estos patrones oscuros. .
Página de inicio
El desarrollo de la página de inicio seguirá varias fases hasta llegar a su forma final. En primer lugar, se establecerá la disposición de los elementos, definiendo cómo estarán colocados en la página. Posteriormente, se explorarán las interacciones entre el sujeto y la interfaz planificado por la Arquitectura de la Información (AI). Una vez definidas estas interacciones, se procederá a la maquetación de la página utilizando la herramienta Figma, a cargo del equipo de diseño de interfaz de usuario (UI). Finalmente, el diseño elaborado se llevará al ámbito del código por el equipo de tecnología de la información (TI), donde se implementarán las funcionalidades y características previamente diseñadas.
Figma: https://www.figma.com/proto/8lyeo4GrYyUr4kL00VwR9E/Aurora-Adviser?node-id=655-4093&t=K2DzNbZIYC71vOq9-0&scaling=min-zoom&page-id=0%3A1&starting-point-node-id=655%3A4093
Esquema de página
La página de Aurora Adviser ha sido diseñada de manera que ofrece una experiencia de usuario completa y fluida, su página principal se organiza en diferentes secciones, cada una de estas centrada en proporcionar información relevante y herramientas útiles de forma clara y concisa, permitiendo a los usuarios, a través de esta estructura, navegar fácilmente por el sitio y acceder rápidamente a la información que están buscando acerca de los patrones oscuros. Desde la primera visualización de la página los usuarios son recibidos con una interfaz intuitiva que mantiene un flujo de navegación que minimiza la búsqueda innecesaria y maximiza la eficiencia del usuario a través de la página. Estas secciones existentes en el inicio de la página de Aurora Adviser se dividen en las siguientes:
- Descripción: ¿Quiénes somos?: Esta sección actúa como la carta de presentación de Aurora Adviser, la cuál ofrece una descripción completa del equipo, incluyendo su historia, misión y visión. Se puede destacar la importancia de la lucha contra los patrones oscuros en el diseño web y cómo esta misión contribuye a una mejor experiencia del usuario en internet.
- Objetivos: Aquí se describen los objetivos de Aurora Adviser, en la cual se explica la importancia de promover un diseño ético y transparente bajo la mirada de la consciencia, privacidad y seguridad que Aurora quiere brindarle a sus usuarios.
- Definición: ¿Qué son los patrones oscuros?: Esta sección de la página tiene la función principal de otorgarle al usuario información breve de lo que significan los patrones oscuros dentro de la web y como la página se encargará de ayudar a identificarlos durante la navegación en la web.
- Tipos de patrones oscuros y sus ejemplos: Consiste en una categorización de los tipos de patrones oscuros que existen en la web, el usuario tiene a su vez, además de tener a mano esta información de como identificar estos tipos de patrones oscuros, la opción de poder visualizar ejemplos de estos tipos de patrones, incluyendo otra descripción con más información al respecto.
- Aurora Team: Esta sección de la página se encarga de ofrecer a los usuarios la oportunidad de colaborar junto con el equipo detrás de Aurora Adviser, enviando a través de un formulario, la postulación para ser parte de esta comunidad.
- ¿Encontraste un Dark Pattern?: Esta sección está dedicada a la colaboración con los usuarios para identificar patrones oscuros que encuentren en la web, incluyendo un formulario de reporte.
- Sección legal: Esta sección explicará los derechos y responsabilidades tanto del usuario como del equipo de Aurora, abarcando aspectos legales importantes para asegurar una relación transparente y justa.
- Descarga de Aurora Guard: Información detallada y accesible sobre cómo instalar la extensión en diversas plataformas, acompañada de preguntas frecuentes que resuelven dudas comunes.
Wireframe: Página principal
Basándose en las partituras de interacción y la esquematización de los elementos, se elabora un wireframe que muestra cómo se visualizan todos estos componentes para que los usuarios se sientan motivados a interactuar con la página. Este wireframe, una representación estructurada y esquemática de la página, permite al equipo de Tecnología de la Información (TI) y desarrollo visualizar la disposición de los elementos y la interfaz de usuario en su totalidad. Al proporcionar una representación visual detallada y clara, el wireframe garantiza que la página esté diseñada de manera intuitiva y atractiva, lo que fomenta la interacción del usuario y mejora la experiencia general de navegación.
Wireframe: Segunda propuesta
Segunda Propuesta
Wireframe: Primera propuesta
Primera Propuesta
Esquema de elementos
Visualización página WEB
.png)
Opciones de página inicial
A partir de los elementos que conformarán la página, se elaborarán las partituras de interacción para definir las acciones disponibles para los usuarios en la página principal. Estas partituras detallarán cómo se espera que los usuarios interactúen con los diferentes elementos y secciones de la página, ofreciendo una guía clara y coherente sobre cómo navegar y utilizar la plataforma de manera efectiva.
Cómo instalar Aurora Guard
Al ingresar a la página, los usuarios interesados en adquirir Aurora Guard, simplemente necesitan dirigirse al menú desplegable, donde encontrarán un enlace directo para descargarla. Por otro lado, para aquellos que deseen comprender mejor el funcionamiento y la instalación de la extensión, la página ofrece un área dedicada a proporcionar información detallada. Aquí, los usuarios pueden obtener una visión completa de las características y funcionalidades de Aurora Guard, así como instrucciones claras sobre cómo instalarla en su navegador. Esta área informativa está diseñada para garantizar que los usuarios se sientan seguros y bien informados antes de proceder con la descarga e instalación de la extensión.
Ser parte del equipo
Si el usuario tiene interés en formar parte del equipo de AURORA, la página proporciona un espacio dedicado que le permite acceder a un formulario de Google. Este formulario solicita los datos de contacto del usuario, que serán evaluados por el equipo para determinar su identidad y experiencia para unirse al proyecto. Este proceso de selección garantiza que se considere cuidadosamente cada solicitud y se tome una decisión informada sobre la participación del usuario en el equipo de AURORA.
Reportar Patrón Oscuro
Como Aurora Adviser es una plataforma dedicada a identificar patrones oscuros en diversas páginas web, ofrece a los usuarios la posibilidad de reportar cualquier patrón oscuro que identifiquen. Este proceso se realiza a través de un formulario de Google, en el cual los usuarios pueden proporcionar el enlace a la página donde encontraron el patrón oscuro, así como evidencia adicional que respalde su reporte. Esta función permite una participación de la comunidad de usuarios en la identificación y denuncia de prácticas engañosas en línea, contribuyendo así a la misión de Aurora Adviser de promover una experiencia web más segura y transparente para todos.
Reportar Patrón Oscuro: Formulario
Al identificar un patrón oscuro, el usuario se puede dirigir a reportar un patrón oscuro donde será redirigidos a un Formulario de Google. Este formulario presenta una serie de opciones específicas, brindando a los usuarios la oportunidad de proporcionar información detallada sobre el patrón identificado. Se les solicita incluir evidencia concreta, como la URL del sitio web, capturas de pantalla relevantes, el nombre de la página y cualquier otro detalle pertinente que pueda ayudar al equipo de curación de contenido a evaluar la situación de manera precisa para determinar si el patrón reportado cumple con los criterios para ser considerado como un patrón oscuro y, en caso afirmativo, si es adecuado para ser incorporado al sistema de AURORA Adviser y Guard.
Términos y condiciones, políticas de privacidad y sobre nosotros
Los términos y condiciones, políticas de privacidad y la sección "Sobre nosotros" ofrecerán una experiencia de interacción similar para que los usuarios accedan a ellos. Estas secciones servirán como recursos informativos clave que permitirán a los usuarios comprender mejor los parámetros y el enfoque que sigue la página. Al proporcionar una interacción coherente y accesible para acceder a estos recursos, se brinda a los usuarios la oportunidad de obtener detalles importantes sobre el funcionamiento de la plataforma, sus políticas de uso y cómo se manejan los datos personales. Esto promueve la transparencia y la confianza del usuario al garantizar que tengan fácil acceso a la información relevante necesaria para tomar decisiones informadas sobre su participación en la plataforma.
Lista dark patterns
Cuando el usuario interactúa con la lista de patrones oscuros, encontrará una vista general de los que han sido identificados en la página. Esta disposición proporciona una visión panorámica de los patrones detectados, lo que permite al usuario comprender de manera rápida y eficiente la naturaleza de los problemas presentes en la página en cuestión. Además, esta funcionalidad se presenta como una opción valiosa para aquellos que deseen informarse manualmente sobre cualquier patrón oscuro que puedan identificar durante su navegación. De esta manera, se facilita la participación de los usuarios en el proceso de identificación y reporte de comportamientos problemáticos en línea.
Desarrollo desde el código
Repositorio: https://github.com/Aurora-Adviser/Aurora-Adviser
Carrusel/Slidershow
El carrusel implementado, con la biblioteca Swiper, ofrece una experiencia dinámica de desplazamiento de diapositivas. Adaptándose a diferentes dispositivos, muestra múltiples diapositivas simultáneamente para una exploración eficiente del contenido visual. Con controles intuitivos de navegación y paginación dinámica, permite una experiencia de usuario fluida. Además, su función de reproducción automática ajustable es una opción atractiva y eficiente para presentar contenido visual.
Segunda versión
Primera versión
FontAwesome [1]
La página de Font Awesome proporciona una amplia gama de iconos vectoriales escalables que son esenciales para el diseño web. Con una colección extensa y variada, Font Awesome ofrece una solución integral para integrar iconos en proyectos web y aplicaciones. Esta versatilidad, combinada con su fácil integración y personalización. Solo se debe crear una cuenta, buscar el icono y copiar el html con la etiqueta .
Menú desplegable
El menú desplegable, implementado con HTML, CSS y JavaScript, proporciona una solución dinámica y funcional para la navegación en sitios web. Con una estructura fluida y receptiva, este menú ofrece una experiencia de usuario intuitiva, permitiendo a los visitantes acceder fácilmente a diferentes secciones del sitio. Utilizando HTML para definir la estructura del menú, CSS para diseñar su apariencia y JavaScript para agregar interactividad.
Primera versión
Collapsible
Un elemento collapsible (colapsable) es un componente que se puede expandir y contraer para mostrar u ocultar contenido. Este tipo de elemento se utiliza frecuentemente para mejorar la usabilidad de una página web, ya que permite a los usuarios decidir cuándo ver información adicional sin que esta ocupe espacio innecesario en la pantalla.
Forms
Los formularios (forms) son estructuras que permiten a los usuarios enviar datos a un servidor web. Son fundamentales para la interacción entre el usuario y el sitio web, ya que facilitan la recopilación de información mediante diversos tipos de campos de entrada. Los formularios se utilizan en una amplia variedad de aplicaciones, desde el inicio de sesión y el registro de usuarios hasta la búsqueda y la recopilación de comentarios.
En este caso, se utilizó Formspree, un servicio externo que permite gestionar los envíos de formularios de manera sencilla. Formspree ofrece la ventaja de editar el aspecto del formulario mediante CSS, asegurando que se integre perfectamente con el diseño de la página web. Además, este formulario envía las respuestas directamente al correo oficial de Aurora, permitiendo una gestión eficiente de la información recibida.
Página final Aurora Adviser
Inicio y Menú
Ejemplo Patrones oscuros
Instalar Aurora Guard
Aurora TEAM
Sección legal
Pruebas de usuario
Para asegurar que la página web funcione correctamente y ofrezca una experiencia de usuario óptima, se ha llevado a cabo una serie de pruebas de usuarios. Estas pruebas, se realizaron con personas de diversos niveles de conocimiento técnico y de distintas edades, lo que permite tener una perspectiva amplia y representativa de la usabilidad de la página como objetivo identificar posibles áreas de mejora y garantizar que todos los usuarios, independientemente de su experiencia previa con la tecnología, puedan navegar y utilizar todas las funcionalidades de la página de manera intuitiva y eficiente.
Usuarios
| Nombre | Descripción de usuario |
|---|---|
| Macarena Arraño (50 años) | Trabajadora independiente. No sabe qué son los patrones oscuros y no es una persona que se maneja con las páginas web o la tecnología, por lo que se le hace difícil interactuar con estas. Cabe destacar que es alguien que neccesita de lentes para leer de cerca. |
| Sebastian Araya (20 años) | Estudiante universitario. Conocía de antes la definición y como funcionaban los patrones oscuros, a su vez tiene experiencia haciendo descargas en la web, haciendo compras en línea e identificando páginas o archivos sospechosos. Tiende a prestar especial atención a las paletas de colores de las páginas debido a que tiene astigmatismo y le molestan las fuentes de luz demasiado potentes. |
| Cristian Valdivia (24 años) | Estudiante universitario, titulante en Arquitectura. Conocía el nombre de la pagina pero no sabia de que trataba ni cual era su propósito en uso. Tiende a prestar especial atención al tema grafico y efectividad del uso de esta. La página está muy limitante en términos de encontrarla en el sitio web. No se puede encontrar por sí solo este programa sin que nosotros lo indiquemos. En los textos los textos son pocos llamativos y más imagen de ejemplo tienen poca información para mostrar los ejemplos. No es elocuente la imagen con lo escrito. Lo escrito ocupa más espacio que la imagen y eso aburre al usuario. Prefiere una información más rápida por medio de la imagen. No entiendo como la página proporcionaría la privacidad y seguridad según el propósito de esta. ¿Cómo van a dar cabida los objetivos que plantean? |
| Catalina Santibáñez (21 años) | Estudiante universitaria de la carrera de Traducción, no tiene conocimiento sobre que son los patrones oscuros, pero tiene una noción. La mayoría del tiempo navega en internet por temas de estudios y navega por varias páginas distintas, le llaman la atención las páginas web con buenas gráficas y que a su vez tenga un buen contenido, |
| Gabriela Márquez Alamos (27 años) | Estudiante universitaria sin conocimientos previos sobre patrones oscuros en internet, pero con buen manejo de la tecnología; descarga archivos de la web y utiliza extensiones de Google Chrome con facilidad. |
| Beto Gutierrez (23 años) | Estudiante universitario con vagos conocimientos previos sobre patrones oscuros en internet, pero con buen manejo de la tecnología, se le facilita navegar por la página y utilizar las diferentes secciones de esta de manera que no solo se educa pero también demuestra la buena organización del sitio. |
| Nicolás Gonzalez (23 años) | Estudiante universitario sin previo conocimiento de los patrones oscuros, pero con buen conocimiento con la tecnología, navega con frecuencia por páginas web, descarga y utiliza distintas extensiones con frecuencia, le llaman la atención los colores y contrastes en la página. |
| Antonia Suazo (23 años) | Estudiante universitaria con buen manejo de la tecnología. Tiene experiencia en compras por internet y usa el computador frecuentemente, incluyendo el uso de extensiones del navegador. Aunque está familiarizada con prácticas manipuladoras en línea, desconoce el concepto específico de "patrones oscuros". |
Resultados
Página de inicio y menú
| Nombre | Cometarios/Anotaciones |
|---|---|
| Macarena Arraño (50) |
|
| Sebastian Araya (20 años) |
|
| Cristian Valdivia (24) |
|
| Catalina Santibáñez (21) |
|
| Gabriela Márquez Alamos (27 años) |
|
| Beto Gutierrez (23 años) |
|
| Nicolás Gonzalez (23 años) |
|
| Antonia Suazo (23 años) |
|
Ejemplos patrones oscuros
| Nombre | Cometarios |
|---|---|
| Macarena Arraño (50) |
|
| Sebastián Araya (20 años) |
|
| Cristian Valdivia (24) |
|
| Catalina Santibáñez (21) |
|
| Gabriela Márquez Alamos (27) |
|
| Beto Gutierrez (23 años) |
|
| Nicolás Gonzalez (23 años) |
|
| Antonia Suazo (23 años) |
|
Instalar Aurora Guard
| Nombre | Cometarios |
|---|---|
| Macarena Arraño (50) |
|
| Sebastián Araya (20 años) |
|
| Cristian Valdivia (24) |
|
| Catalina Santibáñez (21) |
|
| Gabriela Márquez Alamos (27) |
|
| Beto Gutierrez (23 años) |
|
| Nicolás Gonzalez (23 años) |
|
| Antonia Suazo (23 años) |
|
AURORA Team
| Nombre | Cometarios |
|---|---|
| Macarena Arraño (50) |
|
| Sebastián Araya (20 años) |
|
| Cristian Valdivia (24) |
|
| Catalina Santibáñez (21) |
|
| Gabriela Márquez Alamos (27) |
|
| Beto Gutierrez (23 años) |
|
| Nicolás Gonzalez (23 años) |
|
| Antonia Suazo (23 años) |
|
Sección legal
| Nombre | Cometarios |
|---|---|
| Macarena Arraño (50) |
|
| Sebastian Araya (20 años) |
|
| Cristian Valdivia (24) |
. |
| Catalina Santibáñez (21) |
|
| Gabriela Márquez Alamos (27) |
|
| Beto Gutierrez (23 años) |
|
| Nicolás Gonzalez (23 años) |
|
| Antonia Suazo (23 años) |
|
Conclusiones
Como conclusión de las pruebas de usuario, los resultados fueron muy favorables. La mayoría de los participantes consideró que la página es sencilla de utilizar y navegar. Destacaron especialmente la claridad y comprensibilidad del contenido, así como el tamaño tipográfico, que facilitó la lectura y comprensión de la información presentada. Estos resultados positivos indican que la página cumple con los estándares de usabilidad y accesibilidad, proporcionando una experiencia satisfactoria para una audiencia diversa.
Inicio y menú
En el inicio del menú, la mayoría de los usuarios supieron navegar eficazmente tanto en esa sección como en los ítems del menú. En términos de interacción, no se presentaron mayores problemas. Además, los usuarios expresaron agrado por el diseño y la estética de la página, apreciando su "look and feel".
Una mejora que se podría implementar es hacer interactivas las etiquetas que se encuentran en el carrusel de la sección "Que no te pase a ti…", ya que los usuarios tendían a querer interactuar con ellas. Por otro lado, para ayudar a los usuarios a entender mejor en qué parte de la página se encuentran, se sugiere que el menú indique claramente la ubicación actual del usuario, facilitando así la comprensión de su posición dentro del sitio.
También en la sección para poder colaborar enviando o denunciando los patrones oscuros que los usuarios han encontrado, más allá de que se han hecho comentarios neutrales acerca de que la página redirige al usuario a otra ventana, ha sido bien recibida, se entiende por parte de los usuarios la funcionalidad de la misma gracias a la descripción existente en la página principal.
Ejemplo de patrones oscuros
La mayoría de los usuarios consideraron útiles las descripciones debajo de las imágenes, ya que proporcionan contexto adicional y mejoran la comprensión del contenido visual. Sin embargo, varios participantes señalaron que las descripciones más extensas resultaban redundantes y, en algunos casos, innecesarias. Esto sugiere que se podría mejorar la experiencia del usuario al modificar estas descripciones, haciéndolas más breves y concisas, o incluso eliminándolas cuando no aporten información significativa.
Al simplificar las descripciones, no solo se evita la repetición de información, sino que también se mejora la fluidez de la navegación, permitiendo a los usuarios enfocarse en los elementos visuales clave sin distracciones.
Instalar Aurora Guard
La mayoría de los usuarios mostraron un gran interés en instalar la aplicación tras comprender su funcionalidad para detectar patrones oscuros en otras páginas web. Además, los usuarios entendieron mejor el propósito de la aplicación al ver el video del prototipo presentado externamente, en lugar de a través de una explicación detallada en la página misma.
Por otro lado, se sugirió que la sección de preguntas frecuentes se ubicara en un lugar más accesible, proporcionando un acceso directo a las respuestas. Esta mejora facilitaría a los usuarios encontrar rápidamente la información que necesitan, mejorando así su experiencia general con la página.
AURORA Team
La mayoría de los usuarios encontraron muy fácil unirse al equipo, comprendiendo rápidamente de qué se trata y cómo llenar el formulario para ser parte del team. Este proceso intuitivo y accesible incentivó a muchos usuarios a querer formar parte del equipo, ya que la página se destacó por su diseño amigable y centrado en el usuario.
El formulario para unirse al team fue diseñado de manera clara y concisa, lo que permitió a los usuarios completarlo sin dificultades ni confusiones. La estructura y el contenido de la página jugaron un papel crucial en esto, ofreciendo una experiencia de usuario positiva que motivó a los visitantes a involucrarse más activamente.
Sección legal
Durante la revisión de los términos y condiciones, así como de las políticas de privacidad, no se encontraron mayores complicaciones en su lectura ni en el contenido en sí. La claridad y accesibilidad del texto facilitaron su comprensión, lo que resultó en una experiencia positiva para los usuarios.
La tipografía utilizada desempeñó un papel crucial en la facilidad de lectura de estos documentos legales. La elección de una tipografía legible y bien espaciada contribuyó significativamente a la legibilidad del texto, lo que permitió a los usuarios procesar la información de manera eficiente y sin esfuerzo.
