Documentos de Académico
Documentos de Profesional
Documentos de Cultura
Diseño Visual: tratamiento grafico de los elementos de la interfaz del “look” DEL “LOOK
& FEEL”
Paso #2:
Paso #3:
Diseño de la Interaccion:
Desarrollo del flujo de las aplicaciones para facilitar las tareas del usuario, definiendo
como el usuario interactua con la funcionalidad del sitio
Paso #4:
Especificaciones Funcionales:
Paso #5:
Necesidades de Usuario:
Paso #6
o Definir escenarios.
ETAPA 2 - ORGANIZACIÓN
Esta es la etapa que más se relaciona con la expresión artística. Es cuando el
diseñador usa tanto criterios científico-técnicos como culturales para organizar
toda la información obtenida durante la etapa anterior.
ETAPA 3 - DISEÑO
ETAPA 4 - PRUEBA
Pruebas de prototipos.
Revisión de diagramas.
Técnicas
Reunión
Entrevista y Encuesta
Observación
Revisión bibliográfica
Consulta a experto
Representación y mapeo
Focus group
Diseño participativo.
Escenarios.
Personas.
Benchmarking (análisis competitivo).
Validación de términos.
Flujogramas.
Diagramación en papel.
Prototipado digital.
Herramientas
Las herramientas para el trabajo del diseñador de experiencia de usuario varían según
las posibilidades económicas y tecnológicas del proyecto. En el mercado existen tanto
herramientas profesionales de un alto costo monetario como herramientas gratuitas.
Para el manejo de la información con usuarios podemos contar con las encuestas
online, herramientas que permiten diseñar una encuesta en línea y que los usuarios, de
manera remota, la respondan.
E-encuestas (www.e-encuesta.com)
CMapTools. (http://cmap.ihmc.us)
Freemind (http://freemind.sourceforge.net)
PowerMapper (www.powermapper.com)
SmartDraw (www.smartdraw.com)
En productos digitales que cumplen un fin muchas veces rentable, es necesario incluir
los propósitos del negocio a la par con las necesidades y expectativas de los usuarios,
inclusive con mayor relevancia que la tecnología a ser empleada, poniendo esta última
después de la conceptualización.
Criterios básicos
Este enfoque refuerza una frase que actualmente se ha convertido en un lema para
todos los que se desempeñan como diseñadores de experiencia de usuario:
“Depende”. En el diseño de software no existe nada absoluto, las decisiones de diseño
más acertadas varían en función del contexto, los contenidos y los usuarios. Es por eso
que resulta difícil definir pautas o metodologías rígidas para su realización, y se hace
imprescindible que los diseñadores afronten de forma flexible cada proyecto concreto
Metodología del diseño Centrado en
el usuario
Como señala Norman (1983b), la imagen del sistema guía al usuario en la adquisición
y construcción de un modelo mental ajustado al modelo conceptual creado por el
diseñador.
Etapas UX
Etapa 1: Investigación
Definir de manera general a los usuarios del producto, su contexto de uso, y los contenidos que tendrá el mismo.
Definir las características del contexto de uso (culturales, políticas, económicas, sociales y tecnológicas).
Etapa 2: Organización
Etapa cuando el diseñador UX usa tanto criterios científico-técnicos como
culturales para organizar toda la información obtenida durante la etapa anterior. Las
actividades que se realizan en esta etapa son:
Definir todos los flujos funcionales que tendrá el producto digital, correspondiendo con
los flujos reales de los usuarios en su contexto.
Los artefactos generados durante esta etapa serían: Mapa de Arquitectura, Mapas de
navegación y Flujogramas.
Etapa 3: Prototipado
Los artefactos generados durante esta etapa serían: Diagramas digitales y wireframes
que son prototipos de alta documentados, guías de usabilidad.
Etapa 4: Pruebas
Pruebas de prototipos.
Revisión de diagramas.
Etapa 5: Diseño
Los artefactos generados durante esta etapa serían: Archivos de diseño gráfico, Guía
de diseño de interacción y manual de estilos.
Técnicas
Para usar esta técnica no olvides configurar tu Google Analytics con ambas páginas ya
que de ahí podrás extraer al detalle toda la información que necesitas.
Creazy Egg: Es muy fácil de usar y muy útil, esta te permite visualizar capas de color
que te indican por dónde se mueven más los usuarios cuando navegan en tu sitio.
Con esta herramienta podrás saber tres puntos básicos: dónde mira, cuánto tiempo
mira y cuál es el orden visual, es decir el trayecto que siguen sus ojos en la web.
Usabilidad de laboratorio: Esta técnica consta de someter a prueba a tus usuarios,
entrevistándolos por separado y pedirles que realicen una serie de tareas en el sitio
para identificar el nivel de dificultad que puedan presentar.
Qué tan complicado pueda ser navegar por determinada página o encontrar
determinada información.
Esta prueba es muy importante porque permite ponerse en el lugar del usuario y tener
más claro qué y cómo necesita determinadas mejoras de usabilidad en el sitio.
Business Origami: Esta es una técnica que sirve cuando el sistema de un producto o
servicio es muy complicado y se necesita crear una interacción entre usuario-producto-
ambiente. Los usuarios te permitirán solucionar el problema, para esto debes
asegurarte de contar con diferentes perfiles de usuarios. Esta técnica consta que ellos
mismos cuenten sus experiencias de interacción de manera particular y así conseguir
ideas para destrabar el flujo de interacción. Si se les da la oportunidad a los usuarios
de hablar, ellos lo harán. Esta es una herramienta muy poderosa para conseguir ideas
de usabilidad que ayude directamente a los usuarios.
Flujogramas: Es una herramienta visual que permite identificar los pasos y situaciones
de importancia para mantener un buen orden en el proceso.
Customer Journey: Permite identificar las etapas por las que pasa un usuario desde el
deseo de un bien o servicio, hasta que lo adquiere.
Ficha Escenario Persona: Es una ficha en la cuela se crea el perfíl de una persona
con propiedades de los usuario. Luego de esto se forman los escenarios para
conseguir características tanto demográficas como personales para asignarles tareas
específicas que deben realizar en interacción con la aplicación. Se debe tener en
cuenta que se crea una ficha por usuario.
Herramientas
Marvel: Es una herramienta online que permite transformar bocetos en prototipos interactivos.
Balsamiq: Es un programa online para la creación de esquemas con la que se puede
trabajar desde cualquier lugar mediante su web ,
Pencil: Una herramienta gratuita para realizar Mockups para webs y aplicaciones, muy
fácil de usar y de instalar.
Axure RP Pro: Programa para creación de interfaces web que permite probar su funcionalidad
desde el mismo programa sin necesidad de subir elementos a la web.
LookBack: Potente plataforma que permite ver la interacción de los usuarios,
permitiendo identificar los problemas.