SlideShare una empresa de Scribd logo
1
Subtítulo
DE LA IDEA A LA SOLUCIÓN
DESCUBRE LAS MEJORES PRÁCTICAS UX
2
RESUMEN EJECUTIVO
Dentro d el m und o d el d esarrollo d el software, la
exp eriencia d e usuario (UX) se d efin e p or la p ercep ción
(negativa o p ositiva) q ue origina la interacción d e un usuario
con el software d esarrollad o.
Contar con d iseñad ores d e exp eriencia d e usuario (o
d iseñad ores UX) e invertir en conseguir esa b uena
exp eriencia d e usuario, influirá sin d ud a en el éxito d el
p royecto.
A la h ora d e p ensar y p lanificar un p royecto es
im p rescind ib le tener en cuenta las necesid ad es d el usuario,
ya q ue d e esta m anera sab rem os cóm o ofrecer soluciones a
su m ed id a y crearem os ap licaciones sencillas y sob re tod o
eficientes q ue h arán m ás fácil su vid a.
El ob jetivo d el exp erto UX es p or tanto crear interfaces q ue
ap ortan la m ejor satisfacción y exp eriencia p osib les d e un
p rod ucto o servicio con el m ín im o esfuerzo p ara los
usuarios. Im p lantar un p roceso m ultid iscip linar d ond e se
usan d iferentes técnicas es la clave p ara conseguir este
ob jetivo, centránd ose siem p re y en tod o m om ento en las
necesid ad es, exp ectativas, m otivaciones y cap acid ad es d e
los usuarios.
3
6 CLAVES DE UX PARA GARANTIZAR
UNA EXPERIENCIA DE USUARIO ÓPTIMA
1
¿POR QUÉ INVERTIR EN UX?2
METODOLOGÍA3
ÍNDICE DE CONTENIDO
FASE DE CONSULTORÍA UX4
FASE DE DISEÑO UI5
FASE DE MAQUETACIÓN6
PROPUESTAS DE MEJORA Y VALOR AÑADIDO7
A- ETAPA DE ANÁLISIS "RESEARCH": INFORMACIÓN E INTERACCIÓN
B- ETAPA DE PROTOTIPO Y DISEÑO DE INTERACCIÓN UxD
¿CUÁLES SON LAS MEJORES PRÁCTICAS RECOMENDADAS POR EL
CENTRO EXPERTO UX DE ATSISTEMAS?
4
6 CLAVES DE UX PARA UNA
EXPERIENCIA DE USUARIO ÓPTIMA
1
5
La Experiencia de Usuario o User Experience (UX) es el grado de satisfacción del usuario al interactuar con un producto digital.
6 CLAVES DE UX PARA GARANTIZAR UNA EXPERIENCIA DE USUARIO ÓPTIMA1
01.
ANALIZAR
el contexto y el
m ercado del
cliente
03. MATERIALIZAR
05. MEDIR
la satisfacción
del usuario
02. INVESTIGAR
el com portam iento y
experiencia de los
usuarios
04. DISEÑAR
la interfaz del usuario
y su codificación
06. ACTUAR
para la m ejora continua
el concepto en
wirefram es y prototipos
6
¿POR QUÉ INVERTIR EN UX?2
7
¿POR QUÉ INVERTIR EN UX?2
PORQUE REDUCE LOS COSTES A LARGO PLAZO
Optim ización del diseño en las fases iniciales para dism inuir
los cam bios m ás costosos en fases de desarrollo
PORQUE MEJORA EL
POSICIONAMIENTO SEO
PORQUE FIDELIZA Y
SATISFACE AL USUARIO
Respuesta a las necesidades
del usuario con interfaces
intuitivas
PORQUE AUMENTA LA
TASA DE CONVERSIÓN
Mejora de la ventas, presencia
y núm ero de visitas
PORQUE INCREMENTA
LA PRODUCTIVIDAD Y
EFICIENCIA
Minim ización del trabajo
innecesario
Apuesta firm e por el diseño
responsive
8
METODOLOGÍA3
9
Bias &Mayh ew
“SI EL SISTEMA ESTÁ EN FASE DE PRODUCCIÓN, CORREGIR
EL ERROR COSTARÁ DE 50 A 100 VECES MÁS QUE HACERLO
DURANTE EL DISEÑO”.
¿CUÁLES SON LAS MEJORES PRÁCTICAS UX?
METODOLOGÍA3
En el Centro Experto de UX/UI de atSistem as, hem os consolidado las m ejores prácticas UX, trabajando siguiendo estándares, m etodologías y técnicas
que se centran en el contacto continuo con el cliente y su validación en todas las fases. De este m odo m inim izam os los riesgos y costes de
m odificaciones en etapas o fases m ás avanzadas. En cada fase la interacción es continua con el cliente, realizando entregables para su validación y
perm itiendo una constante visibilidad del proyecto a tiem po real. Conseguim os garantizar un producto de calidad, evitando así m odificaciones en el
periodo de m aquetación o desarrollo por un m al planteam iento inicial.
10
METODOLOGÍA3
Las d iferentes fases d e la m etod ología
11
FASE DE CONSULTORÍA UX4
12
Cristina Piguillem
Resp onsab le d e Negocio UX/UI
“ES CLAVE DISEÑAR LA EXPERIENCIA DEL USUARIO, CONOCIENDO
CÓMO CAMBIA Y AVANZA LA TECNOLOGÍA, COMBINANDO A LA VEZ
TÉCNICA, INTUICIÓN, CONOCIMIENTOS Y CREATIVIDAD”.
13
FASE DE CONSULTORÍA UX4
En la fase de consultoría UX, es el m om ento de conceptualizar y diseñar la solución del proyecto. Para la construcción del diseño
de Experiencia de Usuario, recom endam os trabajar en dos etapas diferenciadas:
ETAPA DE PROTOTIPO Y
DISEÑO DE INTERACCIÓN
UxD
Se plasm an los resultados de la
etapa anterior, con los
requerim ientos técnicos.
ETAPA DE ANÁLISIS
"RESEARCH ": INFORMACIÓN E
INTERACCIÓN
En esta etap a se ob tien e tod a la
in form ación p osib le d el p royecto,
clien te, usuarios y p rod ucto a d iseñ ar
p ara con vertirlo en un p rod ucto.
FASE
UX
14
En el inicio d e un p royecto se id entifican las necesid ad es d el cliente. Ad em ás d e las reuniones d e tom a d e
req uisitos a las q ue asisten junto con los analistas funcion ales, los exp ertos en Research d efinen los stakeholders
con los q ue entrevistarse p ara ob tener la inform ación necesaria p revio al inicio d el p royecto.
Los exp ertos en Research id entifican y d eterm inan las técnicas q ue se van a em p lear, con la finalid ad d e p oner
en com ún las n ecesid ad es d e los clientes y los ob jetivos d e la em p resa. Cad a m étod o d e estud io ap orta una
in form ación concreta q ue el exp erto en Research transform a en un as conclusiones (“entregab le”) q ue servirá d e
guía p ara la siguiente fase d e construcción d el p rototip o elab orad o p or el exp erto UX en d iseño d e interacción.
FASE DE CONSULTORÍA UX4
ETAPA DE ANÁLISIS "RESEARCH "
Consiste en un proceso de análisis basado en el “Diseño Centrado en el Usuario” (User Centric Design). Para
realizar el estud io, em p leam os un os m étod os d e an álisis con un os p rop ósitos y ob jetivos con cretos.
Defin ición d e
stakeholders
Ob ten ción d e
in form ación
n ecesaria
Id en tificación d e
técn icas a
em p lear
Defin ir
n ecesid ad es d el
clien te y ob jetivos
d e la em p resa
15
Las técnicas em p lead as en función d el p royecto son las siguientes:
FASE DE CONSULTORÍA UX4
ETAPA DE ANÁLISIS "RESEARCH "
Personas
TÉCNICAS
DE
RESEARCH
Scope
Canvas
Focus Group
Análisis
DAFO
Diagnóstico
Sectorial
Benchm ark
Mapa de
Tendencias
Mapa de
Em patía
Análisis de
Casos de
Uso
Card
Shorting
Test de
Usuario
What if
Test
H eurístico
Test A/B
16
TÉCNICA OBJETIVO MECÁNICA ENTREGABLE
Personas
Identificar cuáles son los usuarios reales de nuestro
producto. Definir los perfiles de usuario para dirigir
nuestras acciones.
Los expertos en Research, tras una labor
de investigación a través de cuestionarios
y entrevistas, describen los perfiles de los
usuarios: edad, sexo, nivel de estudios,
nivel social, empleo, tareas cotidianas,
gustos, valores, experiencia, completando
así el perfil del usuario objetivo y creando
un perfil aproximado.
Documento con los perfiles de usuario
del producto.
Scope Canvas
Conectar las necesidades de los usuarios con los
objetivos de negocio de la organización. Al definir los
conceptos visualmente nos ayuda a ordenarlos y
jerarquizarlos, constituyendo un pilar fundamental
para el desarrollo del UX.
El equipo de UX enumera y completa los
siguiente factores: necesidades,
motivaciones, propósitos, impacto y
objetivos.
Cuadro con el resultado del estudio, las
acciones propuestas y las métricas que se
realizarán para garantizar el
cumplimiento de los objetivos.
Focus Group
• Determinar objetivos del proyecto a través de un
Focus Group con stakeholders.
• Conocer datos cualitativos de los clientes a través
de un Focus Group con cliente final.
Se organiza una reunión con los
involucrados en cada caso. El rol del
consultor UX en esta reunión es de
moderador, nunca para intervenir con
opiniones, guiará las reuniones en función
de los objetivos establecidos
previamente.
Un acta de reunión con las conclusiones
del consultor UX tras evaluar los datos
obtenidos.
Análisis DAFO
Identificar los valores que diferencian a nuestro
cliente de su competencia.
Una vez realizado un estudio de la
empresa y sus clientes, el equipo de UX va
incluyendo en un cuadrante los
conceptos de: debilidades, amenazas,
fortalezas y oportunidades.
Documento donde se exponen las
amenazas, debilidades, fortalezas y
oportunidades del estudio. En base a
estos resultados se confecciona el mapa
de jerarquía del proyecto.
FASE DE CONSULTORÍA UX4
TÉCNICAS DE ANÁLISIS "RESEARCH “ (I)
17
FASE DE CONSULTORÍA UX4
TÉCNICAS DE ANÁLISIS "RESEARCH “ (II)
TÉCNICA OBJETIVO MECÁNICA ENTREGABLE
Diagnóstico de la
industria
Analizar el nivel de integración de la empresa en su
sector.
Cuestionario que analiza 7 atributos que
la empresa debe cumplir para formar
parte de la industria. Conexión, nivel de
automatización, flexibilidad, inteligencia,
nivel social, eco-sostenibilidad y
“smartización” del producto/servicio que
genera.
Un documento con los 7 atributos que
debería de cumplir la empresa para
formar parte de la industria y si se está
cumpliéndolos o no. En caso de tener
deficiencias, cómo solventarlas.
Benchmark
Conocer las mejores prácticas en el mercado donde
se engloba el producto. Con ello, podremos detectar
los estándares de navegación y recursos utilizados en
productos de la competencia, sobre todo los que se
han convertido en referencia de mercado.
Se comparan diferentes marcas con
contenidos similares para buscar
patrones de navegación comunes.
Los árboles de navegación de las marcas
comparadas indicando los patrones
comunes que se han de seguir.
Mapa de tendencias
Encontrar la marca de éxito con mayor afinidad a
nuestro cliente, así como las marcas con líneas de
negocio comunes a la nuestra. Nos ayuda a
encaminar el producto de cara al UX y
posteriormente al diseño.
Se ubica el producto en el “Mapa de
Tendencias Digitales de Information
Architects Inc.” en relación a sus servicios,
con herramientas específicas existentes
en el mercado.
El “Mapa gráfico de Tendencias Digitales
de Information Architects Inc.”
Mapa de empatía
Identificar con exactitud cómo serán los clientes que
utilizarán la Web/App.
Trazar un perfil aproximado de los clientes, los
esfuerzos que realizan y los beneficios que esperan
obtener.
Se realiza un cuestionario que arroja
datos precisos sobre como serán los
clientes que utilizarán la Web/App: qué
ve, qué dice y hace, qué oye, qué piensa y
siente.
Mapa con el resultado del estudio y las
respuestas a las cuestiones planteadas a
los usuarios.
18
FASE DE CONSULTORÍA UX4
TÉCNICAS DE ANÁLISIS "RESEARCH “ (III)
TÉCNICA OBJETIVO MECÁNICA ENTREGABLE
Análisis de casos de uso
Listar todas las funcionalidades de la Web/App con
el objetivo de generar una descripción de los
pasos necesarios para llevar a cabo los procesos.
Se recoge en un documento todas las
acciones que se han de poder realizar
sobre la Web/App como por ejemplo;
“contactar con la empresa”, “información
de servicios”, “bolsa de empleo”,
“comprar”, etc.
Informe de todos los casos de uso, sus
funcionalidades y cómo se resuelven.
Card Sorting
Jerarquizar y agrupar los contenidos, asociándolos a
secciones de la Web/App para definir una correcta
Arquitectura de la Información.
Se crean tarjetas con todo el contenido
de la aplicación y se solicita a las personas
involucradas, que asocien dichas tarjetas
a las secciones indicadas. De esta forma
se tiene una comparativa de dónde
esperan los usuarios encontrar cada
elemento y con ello construimos el mapa
de navegación.
Diagrama de contenidos por secciones.
Test de usuario
Conocer cuáles son los patrones de comportamiento
de los usuarios. Con ello podemos extraer los puntos
fuertes que necesitamos incluir en el proyecto.
Consiste en que personas afines a las
necesidades de la marca prueben la
Web/App del cliente o de la competencia
en caso de que el cliente no disponga
todavía del producto creado.
Vídeo de la navegación y las impresiones
de cada usuario.
Mapas de calor de las zonas en las que los
usuarios han navegado más.
Estadísticas de clicks.
Cuestionario que el sujeto de prueba
rellena al final del test.
What If
Conocer los problemas y errores que pueden surgir
así como qué se debe evitar al conceptualizar el
producto.
Se trata de reunirse con los involucrados
para que expresen las connotaciones
negativas que puede haber en el
producto.
Documento con el listado de elementos y
acciones a evitar en la fase de
conceptualización del proyecto.
19
FASE DE CONSULTORÍA UX4
TÉCNICAS DE ANÁLISIS "RESEARCH“ (IV)
TÉCNICA OBJETIVO MECÁNICA ENTREGABLE
Test heurístico
Detectar si una Web/App muestra algún error de
usabilidad.
Se realiza el test sobre estándares de
navegación sobre el producto.
Excel con las conclusiones del consultor
UX tras estudiar los datos obtenidos.
Test A/B
Comparar variantes en cuanto a páginas o
funcionalidades concretas que son mostradas al
usuario de forma aleatoria o controlada. De esta
forma, mediante la analítica Web se obtienen
resultados sobre de qué variante obtiene una mejor
conversión.
Se define inicialmente qué se quiere
evaluar y se genera dos versiones
distintas con los cambios realizados (a
nivel visual o funcional). Se define cuánto
tiempo se mostrarán y se analiza.
Documento con el informe del análisis
obtenido en cada una de las variantes.
Journey Map
Comprender y entender la experiencia de cliente
desde el inicio o acceso, hasta el fin (en
eCommerce postventa).
Consiste en conocer las experiencias y
emociones de los usuarios, con el fin de
mejorarlos. Para ello definimos en un
mapa temporal la experiencia del
usuario: etapas, interacciones, canales,
problemas, elementos y acciones a
realizar por un usuario.
Un gráfico con coordenadas:
• X: espacio temporal donde se
incluyen las fases.
• Y: registro de las experiencias del
usuario, destacando las positivas en
verde y las negativas en rojo, creando
tonalidades intermedias en función
del grado positivo o negativo.
Documento de conclusiones para mejorar
y resolver problemas del sistema.
Walkthrough/Recorrido
Cognitivo
Herramienta de rápida implementación para
localizar posibles fallos de navegación que un
proyecto pudiera tener.
Sobre un prototipo rápido en papel, se
realizan tareas concretas y se localiza
así los posibles fallos de navegación
que pudieran surgir antes de abordar la
fase de diseño UI y/o maquetación.
Con todas las anotaciones de los
comentarios de los usuarios y el sistema,
y una vez analizados los datos resultantes
del walkthough, informe con las
oportunidades de mejora de la aplicación.
20
FASE DE CONSULTORÍA UX4
ETAPA DE PROTOTIPO Y DISEÑO DE INTERACCIÓN UXD
Consiste en un proceso de construcción del prototipo navegable a través de wirefram es y d iseñ o d e in teracción . El
d iseñ o d e in teracción b usca alin ear al in terfaz con el usuario. Los exp ertos en UxD se en cargan d e con figurar el
d ocum en to d escrib ien d o las in teraccion es. La clave es el trab ajo en eq uip o q ue p erm ite d iscutir id eas y p rop uestas,
con el fin d e con trastar y d ecid ir la m ejor solución .
En cad a p royecto, en atSistem as ten em os p autad a un a estructura d e trab ajo, y ésta p ued e verse m od ificad a en algún
caso según las características d el p royecto.
ARQUITECTURA
DE
INFORMACIÓN
ÁRBOL
DE
CONTENIDO
FLUJO
DE
NAVEGACIÓN
PROTOTIPO
NAVEGABLE
DISEÑO DE
INTERACCIÓN
HERRAMIENTAS RECOMENDADAS
Basad o en la exp erien cia d e n uestros esp ecialistas en d iseñ o d e in teracción , recom en d am os, en fun ción d e la
n ecesid ad d el p royecto, d iversas h erram ien tas p ara el d iseñ o d e in teracción (flujos, d iagram as, esp ecificacion es, ...) y
p ara la creación d el p rototip o en wirefram es: Axure, p or ser un a h erram ien ta m uy com p leta q ue p erm ite el d iseñ o d e
in teracción y el p rototip o n avegab le, Justin m in d , Ad ob e XD, Balsam iq e In vision .
HERRAMIENTAS
21
ETAPA DE PROTOTIPO Y DISEÑO DE INTERACCIÓN UXD
FASE DE CONSULTORÍA UX4
ARQUITECTURA
DE
INFORMACIÓN
ÁRBOL
DE
CONTENIDO
FLUJO
DE
NAVEGACIÓN
PROTOTIPO
NAVEGABLE
DISEÑO DE
INTERACCIÓN
Se d efin e y recop ila la
in form ación q ue va a
con ten er tod o el p royecto.
En este p un to se req uiere la
totalid ad d e d ocum en tación
fun cion al:
• organ ización d e la
in form ación
• Etiq uetad o ya q ue es
im p ortan te d efin ir el
len guaje utilizad o,
com p ren sib le,
estan d arizad o y fiel al
b ran d in g d e la em p resa
• n ecesid ad es d el usuario,
resp uesta a sus
b úsq ued as p roactivas y
reactivas
El árb ol d e con ten id os es
un a p ieza clave d e la
Usab ilid ad d el p royecto. Para
un a correcta d efin ición , los
exp ertos en d iseñ o d e
in teracción se n utren d e la
in form ación recop ilad a en la
etap a d e Research (Card
Sorting), fun d am e n tal p ara
crear un árb ol con solid ad o y
q ue resp on d a a las
n ecesid ad es d el usuario.
Es la rep resen tación gráfica
d el cam in o q ue realiza el
usuario en la realización d e
las tareas. In icialm en te los
exp ertos en d iseñ o d e
in teracción realizan un
esq ueleto en p ap el,
d iferen cian d o las fases, los
ob jetos y las tareas d el
p roceso. El exp erto d e UX
tien e com o p rem isa los
estud ios p revios d e la etap a
d e Research, con el fin d e
en ten d er cuál es el
com p ortam ien to real d e los
usuarios y d efin ir el flujo q ue
resp on d e a sus accion es,
d iferen cian d o en el
d iagram a sus activid ad es y
sus d ecision es.
El p rototip o n avegab le se
realiza a través d e
wirefram es , o d iseñ o d e
b aja calid ad , d on d e el
exp erto en UxD in cluye a
m od o rep resen tativo los
elem en tos q ue con form an
cad a un a d e p an tallas, así
com o la n avegación en tre
ellas.
El exp erto d e UxD m od ela
las in teraccion es d e la
in terfaz, d efin ien d o cóm o el
usuario in teractúa con el
sistem a. Defin e cad a un o d e
los elem en tos q ue com p on e
cad a vista y cóm o se
com p orta en cad a caso
(over, click, select, errores,
avisos, ...). Para la realización
d el m ism o tien e en cuen ta
las ap ortacion es d e los
estud ios realizad os d el
exp erto en Research.
22
FASE DE DISEÑO UI5
23
FASE DE DISEÑO UI5
En la fase de diseño UI y en base a la docum entación entregada por el experto en UxD, el experto en diseño visual
prepara el diseño a incluir en la interfaz. El objetivo del equipo UI es la elaboración de un producto que responda a las
necesidades de los usuarios.
El diseño es un elem ento vivo, en continuo cam bio. Los expertos de atSistem as en diseño, conscientes de su
im portancia, dedican parte de su trabajo a la investigación y form ación en nuevas tendencias de diseño en todos las
plataform as del m ercado. Esto nos sitúa a la vanguardia en nuestros diseños.
Para conseguir unos resultados exitosos, disponem os de una organización de trabajo específica:
HERRAMIENTAS RECOMENDADAS:
Actualm ente, recom endam os en base a la experiencia de nuestros diseñadores, diseñar con la herram ienta Sketc. Esta
herram ienta perm ite diseñar Interfaces a tam año real y adem ás aporta com plem entos de las diferentes plataform as
actuales. Tam bién perm ite la publicación del diseño en la herram ienta Zeplin que utilizan los equipos de
m aquetación. Aporta m ucho m ás valor que una guía de estilos y perm ite descargar autom áticam ente los assets sin
n ecesid ad d e in vertir tiem p o d e d iseñ o en esta lab or. Otras h erram ien tas utilizad as en fun ción d e la n ecesid ad d el
p royecto p or los d iseñ ad ores UI son Sketch , Zep lin p ara la p ub licación , Illustrator, Ph otosh op e In d esign .
HERRAMIENTAS
24
5 FASE DE DISEÑO UI
El experto en UI analiza la
inform ación obtenida de
UX. Será la base del diseño
y la estructura que debe
utilizar, así com o de los
elem entos que configuran
cada una de las pantallas
del proyecto.
Teniendo bien definido
el m arco del proyecto, el
experto UI realiza una
labor de investigación
sobre el diseño de los
productos com petencia.
De este m odo, puede
obtener patrones de
diseño com unes a tener
en cuenta, y en m uchos
casos que se convierten
en m andatorios.
En este punto, el
equipo de diseño junto
con el cliente debe
definir cuál será la línea
de diseño a seguir. Para
ello se suele preparar
varias propuestas. En
caso de existir guía de
estilo previa, se
propone evoluciones y
m ejoras según las
tendencias del
m om ento.
El experto de UI
diseña cada una de
las pantallas que
conform an el
proyecto, incluyendo
los m ensajes, avisos y
elem entos
com plem entarios.
Una vez finalizados los
diseños y aprobados, se
genera una guía de estilo
del producto. La
iconografía, las im ágenes y
los elem entos incluidos en
el diseño, deben ser
separados com o elem entos
independientes (assets)
p ara p od er ser in cluid os en
la fase d e m aq uetación .
25
FASE DE MAQUETACIÓN6
26
Los exp ertos en m aq uetación trab ajan con d iferentes tecnologías y p lataform as
FASE DE MAQUETACIÓN6
Es clave disponer de un equipo experto
en diseño front-end, esp ecializad o en
d iferentes tecn ologías y en continua
form ación sob re las últim as h erram ientas
d el m ercad o.
Es clave seguir una m etod ología q ue
cub re tod as las fases d el d iseño, y
d isp oner d e exp ertos en cad a una d e las
fases. Cad a fase es testeada con los
d istin tos esp ecialistas, form and o un único
eq uip o y garantizand o así el éxito d el
p royecto.
Tod o esto evita errores d e interp retación y
d iferencias entre el d iseño ap rob ad o y la
m aq uetación final. Ap orta com p licid ad
entre los exp ertos d e las d istintas
esp ecialid ad es, favoreciend o el ap oyo
en tre sí en las d iferentes etap as d el
p royecto.
TECNOLOGÍAS
CSS 3
JavaScript, Web Com ponent,
An gular.js, Nod e.js
Responsive Web Design
y Adaptative Web
Design
ECOMMERCE
CMS
MAQUETACIÓN
MOBILE
Magen to
SalesForce
Magn olia
Word Press
Joom la
Nativo
Hyb reed
PLATAFORMAS
27
PROPUESTAS DE MEJORA Y
VALOR AÑADIDO
7
28
• Metodología propia que incluye
todas las fases de diseño y
m aquetación: evitam os errores
de diseño al adaptarnos a cada
tecnología y m inim izam os
diferencias entre el diseño
aprobado y la m aquetación final.
• Conocim iento y uso de las
herram ientas m ás actuales y que
aportan m ayores beneficios al
proyecto.
• Equipo m ultidisciplinar UX/UI
con conocim iento de varias
tecnologías y técnicas.
• Metodología de trabajo que
facilita el cum plim iento del
estándar de calidad y la
satisfacción del cliente: cada paso
requiere de una validación previa
con el cliente, garantizando la
evolución del proyecto según las
expectativas.
• Menores costes de desarrollo:
invertim os desde el inicio en un
diseño adecuado y m inim izam os
las iteraciones en fases posteriores
• Mayor calidad y diseños
adaptados a las tecnologías de
desarrollo: nuestros expertos
saben de distintas tecnologías, y
facilitan la m aquetación y
program ación con diseños
adaptados a cada una de estas
tecnologías.
• Aum ento de las ventas y del
ROI: tenem os una experiencia
dem ostrada en proyectos de
eCom m erce con grand es m arcas
• Mayor productividad y eficacia:
utilizam os las últim as
h erram ientas d e m ercad o y
realizam os d iseños q ue red ucen
el trab ajo innecesario y
red und ante
• Mayores cuotas d e fid elización y
satisfacción d el usuario; n uestro
m un d o gira alred ed or d e la
exp eriencia d e uso y nuestros
clientes p ercib en el cam b io.
PROPUESTAS DE MEJORA Y VALOR AÑADIDO DE ATSISTEMAS7
29
www.atsistemas.com
902 888 902
GRACIAS
Madrid
C/Valle de Alcudia.3 Edificio 2,
planta 1. 28232. Las Rozas, Madrid
Barcelona
Plaça de Catalunya, 21 - 2ª
08002, Barcelona
Cádiz
Edificio Jerez Parque Empresarial,
Calle del Desarrollo 2; oficina 12,
planta 1, 11047, Jerez de la Frontera, Cádiz
Zaragoza
Centro Tecnológico TIC XXI C/Bari, 57
Plataforma Logística (PLA-ZA),
50197, Zaragoza
A Coruña
Edificio Mans, Polígono de Pocomaco,
parcela D22, 15190 A Coruña
Islas Baleares
Regus Palma - Polígono de Son Castello
Carrer Gremi de Sabaters, 21, 2º - 24B
07009 Palma de Mallorca Illes Balears

Más contenido relacionado

La actualidad más candente

Herramientas de la Gerencia Social
Herramientas de la Gerencia SocialHerramientas de la Gerencia Social
Herramientas de la Gerencia Social
SistemadeEstudiosMed
 
Cuestionario inicial - gestión de proyectos - conocimiento y buenas prácticas
Cuestionario inicial - gestión de proyectos - conocimiento y buenas prácticasCuestionario inicial - gestión de proyectos - conocimiento y buenas prácticas
Cuestionario inicial - gestión de proyectos - conocimiento y buenas prácticas
Ramon Costa i Pujol
 
Usabilidad de los sitios web, métodos y evaluación
Usabilidad de los sitios web, métodos y evaluación Usabilidad de los sitios web, métodos y evaluación
Usabilidad de los sitios web, métodos y evaluación
JULIETH SALCEDO
 
Mobile Day - User research
Mobile Day - User researchMobile Day - User research
Mobile Day - User research
Software Guru
 
Articulo
Articulo Articulo
Articulo
arlington99
 
Marco Logico
Marco LogicoMarco Logico
Marco Logico
fvelastegui
 

La actualidad más candente (6)

Herramientas de la Gerencia Social
Herramientas de la Gerencia SocialHerramientas de la Gerencia Social
Herramientas de la Gerencia Social
 
Cuestionario inicial - gestión de proyectos - conocimiento y buenas prácticas
Cuestionario inicial - gestión de proyectos - conocimiento y buenas prácticasCuestionario inicial - gestión de proyectos - conocimiento y buenas prácticas
Cuestionario inicial - gestión de proyectos - conocimiento y buenas prácticas
 
Usabilidad de los sitios web, métodos y evaluación
Usabilidad de los sitios web, métodos y evaluación Usabilidad de los sitios web, métodos y evaluación
Usabilidad de los sitios web, métodos y evaluación
 
Mobile Day - User research
Mobile Day - User researchMobile Day - User research
Mobile Day - User research
 
Articulo
Articulo Articulo
Articulo
 
Marco Logico
Marco LogicoMarco Logico
Marco Logico
 

Similar a DE LA IDEA A LA SOLUCIÓN. DESCUBRE LAS MEJORES PRÁCTICAS UX

Diseño de negocios exponenciales I
Diseño de negocios exponenciales IDiseño de negocios exponenciales I
Diseño de negocios exponenciales IJuan Mejia
 
I Edición Curso de Especialización en Experiencia de usuario (UX) y usabilida...
I Edición Curso de Especialización en Experiencia de usuario (UX) y usabilida...I Edición Curso de Especialización en Experiencia de usuario (UX) y usabilida...
I Edición Curso de Especialización en Experiencia de usuario (UX) y usabilida...
Virginia Aguirre
 
Curso Experiencia de usuario (UX) y Usabilidad - Mondragon Unibertsitatea (MU)
Curso Experiencia de usuario (UX) y Usabilidad - Mondragon Unibertsitatea (MU)Curso Experiencia de usuario (UX) y Usabilidad - Mondragon Unibertsitatea (MU)
Curso Experiencia de usuario (UX) y Usabilidad - Mondragon Unibertsitatea (MU)
Virginia Aguirre
 
UX metodología y acciones
UX metodología y accionesUX metodología y acciones
UX metodología y acciones
Christian Irack 🚀
 
Documento - Webinar ux
Documento - Webinar uxDocumento - Webinar ux
Documento - Webinar ux
Carlos Martin
 
DSUC 01: UX Research
DSUC 01: UX ResearchDSUC 01: UX Research
DSUC 01: UX Research
Rodrigo Vera
 
UX product mindset - Product Tank Santiago.
UX product mindset - Product Tank Santiago.UX product mindset - Product Tank Santiago.
UX product mindset - Product Tank Santiago.
Gustavo Soto Miño
 
5 razones de por qué incorporar user research
5 razones de por qué incorporar user research5 razones de por qué incorporar user research
5 razones de por qué incorporar user research
Multiplica
 
Tutorial Lean UX Workshop - MexIHC 2016
Tutorial Lean UX Workshop - MexIHC 2016Tutorial Lean UX Workshop - MexIHC 2016
Tutorial Lean UX Workshop - MexIHC 2016
Víctor Manuel García Luna
 
Dossier Programa Superior en Diseño Centrado en el Usuario, Experiencia de Us...
Dossier Programa Superior en Diseño Centrado en el Usuario, Experiencia de Us...Dossier Programa Superior en Diseño Centrado en el Usuario, Experiencia de Us...
Dossier Programa Superior en Diseño Centrado en el Usuario, Experiencia de Us...
Virginia Aguirre
 
Product discovery con frameworks de ux y agile inception
 Product discovery con frameworks de ux y agile inception Product discovery con frameworks de ux y agile inception
Product discovery con frameworks de ux y agile inception
Giovanny Cifuentes
 
UXMasterclass Madrid 2013
UXMasterclass Madrid 2013UXMasterclass Madrid 2013
UXMasterclass Madrid 2013
UserZoom&Xperience Consulting
 
Introduccion a ux - IxDA Mendoza - Taller UX
Introduccion a ux  - IxDA Mendoza - Taller UXIntroduccion a ux  - IxDA Mendoza - Taller UX
Introduccion a ux - IxDA Mendoza - Taller UX
Flavia Ibañez
 
Introduccion a ux - IxDA Mendoza - Taller UX
Introduccion a ux - IxDA Mendoza - Taller UXIntroduccion a ux - IxDA Mendoza - Taller UX
Introduccion a ux - IxDA Mendoza - Taller UX
IxDA Mendoza
 
Real UX Whitepaper
Real UX WhitepaperReal UX Whitepaper
Real UX Whitepaper
Raona
 
Real UX Raona Whitepaper
Real UX Raona WhitepaperReal UX Raona Whitepaper
Real UX Raona WhitepaperOscar Oto
 
Sem 2_El diseño, tipos y caracteristicas. (2).pdf
Sem 2_El diseño, tipos y caracteristicas. (2).pdfSem 2_El diseño, tipos y caracteristicas. (2).pdf
Sem 2_El diseño, tipos y caracteristicas. (2).pdf
NelsonMartinez771386
 
UX2012 - Casos y Experiencias de un equipo de UX
UX2012 - Casos y Experiencias de un equipo de UXUX2012 - Casos y Experiencias de un equipo de UX
UX2012 - Casos y Experiencias de un equipo de UX
Emiliano Horcada
 
Kit CiT User Experience
Kit CiT User ExperienceKit CiT User Experience
Kit CiT User Experience
Roger Federico Rybak
 

Similar a DE LA IDEA A LA SOLUCIÓN. DESCUBRE LAS MEJORES PRÁCTICAS UX (20)

Diseño de negocios exponenciales I
Diseño de negocios exponenciales IDiseño de negocios exponenciales I
Diseño de negocios exponenciales I
 
I Edición Curso de Especialización en Experiencia de usuario (UX) y usabilida...
I Edición Curso de Especialización en Experiencia de usuario (UX) y usabilida...I Edición Curso de Especialización en Experiencia de usuario (UX) y usabilida...
I Edición Curso de Especialización en Experiencia de usuario (UX) y usabilida...
 
Curso Experiencia de usuario (UX) y Usabilidad - Mondragon Unibertsitatea (MU)
Curso Experiencia de usuario (UX) y Usabilidad - Mondragon Unibertsitatea (MU)Curso Experiencia de usuario (UX) y Usabilidad - Mondragon Unibertsitatea (MU)
Curso Experiencia de usuario (UX) y Usabilidad - Mondragon Unibertsitatea (MU)
 
UX metodología y acciones
UX metodología y accionesUX metodología y acciones
UX metodología y acciones
 
Documento - Webinar ux
Documento - Webinar uxDocumento - Webinar ux
Documento - Webinar ux
 
DSUC 01: UX Research
DSUC 01: UX ResearchDSUC 01: UX Research
DSUC 01: UX Research
 
Sesiones UXMasterclass
Sesiones UXMasterclassSesiones UXMasterclass
Sesiones UXMasterclass
 
UX product mindset - Product Tank Santiago.
UX product mindset - Product Tank Santiago.UX product mindset - Product Tank Santiago.
UX product mindset - Product Tank Santiago.
 
5 razones de por qué incorporar user research
5 razones de por qué incorporar user research5 razones de por qué incorporar user research
5 razones de por qué incorporar user research
 
Tutorial Lean UX Workshop - MexIHC 2016
Tutorial Lean UX Workshop - MexIHC 2016Tutorial Lean UX Workshop - MexIHC 2016
Tutorial Lean UX Workshop - MexIHC 2016
 
Dossier Programa Superior en Diseño Centrado en el Usuario, Experiencia de Us...
Dossier Programa Superior en Diseño Centrado en el Usuario, Experiencia de Us...Dossier Programa Superior en Diseño Centrado en el Usuario, Experiencia de Us...
Dossier Programa Superior en Diseño Centrado en el Usuario, Experiencia de Us...
 
Product discovery con frameworks de ux y agile inception
 Product discovery con frameworks de ux y agile inception Product discovery con frameworks de ux y agile inception
Product discovery con frameworks de ux y agile inception
 
UXMasterclass Madrid 2013
UXMasterclass Madrid 2013UXMasterclass Madrid 2013
UXMasterclass Madrid 2013
 
Introduccion a ux - IxDA Mendoza - Taller UX
Introduccion a ux  - IxDA Mendoza - Taller UXIntroduccion a ux  - IxDA Mendoza - Taller UX
Introduccion a ux - IxDA Mendoza - Taller UX
 
Introduccion a ux - IxDA Mendoza - Taller UX
Introduccion a ux - IxDA Mendoza - Taller UXIntroduccion a ux - IxDA Mendoza - Taller UX
Introduccion a ux - IxDA Mendoza - Taller UX
 
Real UX Whitepaper
Real UX WhitepaperReal UX Whitepaper
Real UX Whitepaper
 
Real UX Raona Whitepaper
Real UX Raona WhitepaperReal UX Raona Whitepaper
Real UX Raona Whitepaper
 
Sem 2_El diseño, tipos y caracteristicas. (2).pdf
Sem 2_El diseño, tipos y caracteristicas. (2).pdfSem 2_El diseño, tipos y caracteristicas. (2).pdf
Sem 2_El diseño, tipos y caracteristicas. (2).pdf
 
UX2012 - Casos y Experiencias de un equipo de UX
UX2012 - Casos y Experiencias de un equipo de UXUX2012 - Casos y Experiencias de un equipo de UX
UX2012 - Casos y Experiencias de un equipo de UX
 
Kit CiT User Experience
Kit CiT User ExperienceKit CiT User Experience
Kit CiT User Experience
 

Más de atSistemas

Agile itsm con atlassian
Agile itsm con atlassianAgile itsm con atlassian
Agile itsm con atlassian
atSistemas
 
Bizz Chat metamorfosis digital
Bizz Chat metamorfosis digital Bizz Chat metamorfosis digital
Bizz Chat metamorfosis digital
atSistemas
 
Webinar 5 net5-2021
Webinar 5 net5-2021Webinar 5 net5-2021
Webinar 5 net5-2021
atSistemas
 
Webinar Speed Up Academy: Acelera la incorporación de talento.
Webinar Speed Up Academy: Acelera la incorporación de talento.Webinar Speed Up Academy: Acelera la incorporación de talento.
Webinar Speed Up Academy: Acelera la incorporación de talento.
atSistemas
 
Webinar: Descubre los diferentes servicios Cloud Native en Azure
Webinar: Descubre los diferentes servicios Cloud Native en AzureWebinar: Descubre los diferentes servicios Cloud Native en Azure
Webinar: Descubre los diferentes servicios Cloud Native en Azure
atSistemas
 
El futuro del trabajo en equipo
El futuro del trabajo en equipoEl futuro del trabajo en equipo
El futuro del trabajo en equipo
atSistemas
 
La tecnología al servicio de la agilidad empresarial
La tecnología al servicio de la agilidad empresarialLa tecnología al servicio de la agilidad empresarial
La tecnología al servicio de la agilidad empresarial
atSistemas
 
Transformación Agile
Transformación AgileTransformación Agile
Transformación Agile
atSistemas
 
Transformación cultural
Transformación culturalTransformación cultural
Transformación cultural
atSistemas
 
Technical considerations for Blockchain networks with AWS
Technical considerations for Blockchain networks with AWSTechnical considerations for Blockchain networks with AWS
Technical considerations for Blockchain networks with AWS
atSistemas
 
Blockchain Spain II Edición - Ángel Miguel Martínez
Blockchain Spain II Edición - Ángel Miguel MartínezBlockchain Spain II Edición - Ángel Miguel Martínez
Blockchain Spain II Edición - Ángel Miguel Martínez
atSistemas
 
Blockchain Spain - Néstor Gándara
Blockchain Spain - Néstor GándaraBlockchain Spain - Néstor Gándara
Blockchain Spain - Néstor Gándara
atSistemas
 
Blockchain Spain - Juan Luis Gozalo
Blockchain Spain - Juan Luis GozaloBlockchain Spain - Juan Luis Gozalo
Blockchain Spain - Juan Luis Gozalo
atSistemas
 
Blockchain Spain - Ramón Abruña
Blockchain Spain - Ramón AbruñaBlockchain Spain - Ramón Abruña
Blockchain Spain - Ramón Abruña
atSistemas
 
Blockchain Spain - Santiago Chamat
Blockchain Spain - Santiago ChamatBlockchain Spain - Santiago Chamat
Blockchain Spain - Santiago Chamat
atSistemas
 
Blockchain Spain - Antonio Gómez
Blockchain Spain - Antonio GómezBlockchain Spain - Antonio Gómez
Blockchain Spain - Antonio Gómez
atSistemas
 
Blockchain Spain - Miguel Ángel Rojas
Blockchain Spain - Miguel Ángel RojasBlockchain Spain - Miguel Ángel Rojas
Blockchain Spain - Miguel Ángel Rojas
atSistemas
 
Blockchain Spain - Andrés Sánchez
Blockchain Spain - Andrés SánchezBlockchain Spain - Andrés Sánchez
Blockchain Spain - Andrés Sánchez
atSistemas
 
Blockchain Spain II Edición - Autoridad Portuaria de Cartagena, Ilboc, Repsol
Blockchain Spain II Edición - Autoridad Portuaria de Cartagena, Ilboc, RepsolBlockchain Spain II Edición - Autoridad Portuaria de Cartagena, Ilboc, Repsol
Blockchain Spain II Edición - Autoridad Portuaria de Cartagena, Ilboc, Repsol
atSistemas
 
Blockchain Spain II Edición - Juan Manuel Martínez
Blockchain Spain II Edición - Juan Manuel MartínezBlockchain Spain II Edición - Juan Manuel Martínez
Blockchain Spain II Edición - Juan Manuel Martínez
atSistemas
 

Más de atSistemas (20)

Agile itsm con atlassian
Agile itsm con atlassianAgile itsm con atlassian
Agile itsm con atlassian
 
Bizz Chat metamorfosis digital
Bizz Chat metamorfosis digital Bizz Chat metamorfosis digital
Bizz Chat metamorfosis digital
 
Webinar 5 net5-2021
Webinar 5 net5-2021Webinar 5 net5-2021
Webinar 5 net5-2021
 
Webinar Speed Up Academy: Acelera la incorporación de talento.
Webinar Speed Up Academy: Acelera la incorporación de talento.Webinar Speed Up Academy: Acelera la incorporación de talento.
Webinar Speed Up Academy: Acelera la incorporación de talento.
 
Webinar: Descubre los diferentes servicios Cloud Native en Azure
Webinar: Descubre los diferentes servicios Cloud Native en AzureWebinar: Descubre los diferentes servicios Cloud Native en Azure
Webinar: Descubre los diferentes servicios Cloud Native en Azure
 
El futuro del trabajo en equipo
El futuro del trabajo en equipoEl futuro del trabajo en equipo
El futuro del trabajo en equipo
 
La tecnología al servicio de la agilidad empresarial
La tecnología al servicio de la agilidad empresarialLa tecnología al servicio de la agilidad empresarial
La tecnología al servicio de la agilidad empresarial
 
Transformación Agile
Transformación AgileTransformación Agile
Transformación Agile
 
Transformación cultural
Transformación culturalTransformación cultural
Transformación cultural
 
Technical considerations for Blockchain networks with AWS
Technical considerations for Blockchain networks with AWSTechnical considerations for Blockchain networks with AWS
Technical considerations for Blockchain networks with AWS
 
Blockchain Spain II Edición - Ángel Miguel Martínez
Blockchain Spain II Edición - Ángel Miguel MartínezBlockchain Spain II Edición - Ángel Miguel Martínez
Blockchain Spain II Edición - Ángel Miguel Martínez
 
Blockchain Spain - Néstor Gándara
Blockchain Spain - Néstor GándaraBlockchain Spain - Néstor Gándara
Blockchain Spain - Néstor Gándara
 
Blockchain Spain - Juan Luis Gozalo
Blockchain Spain - Juan Luis GozaloBlockchain Spain - Juan Luis Gozalo
Blockchain Spain - Juan Luis Gozalo
 
Blockchain Spain - Ramón Abruña
Blockchain Spain - Ramón AbruñaBlockchain Spain - Ramón Abruña
Blockchain Spain - Ramón Abruña
 
Blockchain Spain - Santiago Chamat
Blockchain Spain - Santiago ChamatBlockchain Spain - Santiago Chamat
Blockchain Spain - Santiago Chamat
 
Blockchain Spain - Antonio Gómez
Blockchain Spain - Antonio GómezBlockchain Spain - Antonio Gómez
Blockchain Spain - Antonio Gómez
 
Blockchain Spain - Miguel Ángel Rojas
Blockchain Spain - Miguel Ángel RojasBlockchain Spain - Miguel Ángel Rojas
Blockchain Spain - Miguel Ángel Rojas
 
Blockchain Spain - Andrés Sánchez
Blockchain Spain - Andrés SánchezBlockchain Spain - Andrés Sánchez
Blockchain Spain - Andrés Sánchez
 
Blockchain Spain II Edición - Autoridad Portuaria de Cartagena, Ilboc, Repsol
Blockchain Spain II Edición - Autoridad Portuaria de Cartagena, Ilboc, RepsolBlockchain Spain II Edición - Autoridad Portuaria de Cartagena, Ilboc, Repsol
Blockchain Spain II Edición - Autoridad Portuaria de Cartagena, Ilboc, Repsol
 
Blockchain Spain II Edición - Juan Manuel Martínez
Blockchain Spain II Edición - Juan Manuel MartínezBlockchain Spain II Edición - Juan Manuel Martínez
Blockchain Spain II Edición - Juan Manuel Martínez
 

Último

Diagrama de flujo soporte técnico 5to semestre
Diagrama de flujo soporte técnico 5to semestreDiagrama de flujo soporte técnico 5to semestre
Diagrama de flujo soporte técnico 5to semestre
rafaelsalazar0615
 
Estructuras Básicas_ Conceptos Basicos De Programacion.pdf
Estructuras Básicas_ Conceptos Basicos De Programacion.pdfEstructuras Básicas_ Conceptos Basicos De Programacion.pdf
Estructuras Básicas_ Conceptos Basicos De Programacion.pdf
IsabellaRubio6
 
biogas industrial para guiarse en proyectos
biogas industrial para guiarse en proyectosbiogas industrial para guiarse en proyectos
biogas industrial para guiarse en proyectos
Luis Enrique Zafra Haro
 
Posnarrativas en la era de la IA generativa
Posnarrativas en la era de la IA generativaPosnarrativas en la era de la IA generativa
Posnarrativas en la era de la IA generativa
Fernando Villares
 
(PROYECTO) Límites entre el Arte, los Medios de Comunicación y la Informática
(PROYECTO) Límites entre el Arte, los Medios de Comunicación y la Informática(PROYECTO) Límites entre el Arte, los Medios de Comunicación y la Informática
(PROYECTO) Límites entre el Arte, los Medios de Comunicación y la Informática
vazquezgarciajesusma
 
EduFlex, una educación accesible para quienes no entienden en clases
EduFlex, una educación accesible para quienes no entienden en clasesEduFlex, una educación accesible para quienes no entienden en clases
EduFlex, una educación accesible para quienes no entienden en clases
PABLOCESARGARZONBENI
 
Estructuras básicas_ conceptos de programación (1).docx
Estructuras básicas_ conceptos de programación  (1).docxEstructuras básicas_ conceptos de programación  (1).docx
Estructuras básicas_ conceptos de programación (1).docx
SamuelRamirez83524
 
trabajo de tecnologia, segundo periodo 9-6f
trabajo de tecnologia, segundo periodo 9-6ftrabajo de tecnologia, segundo periodo 9-6f
trabajo de tecnologia, segundo periodo 9-6f
zoecaicedosalazar
 
Alan Turing Vida o biografía resumida como presentación
Alan Turing Vida o biografía resumida como presentaciónAlan Turing Vida o biografía resumida como presentación
Alan Turing Vida o biografía resumida como presentación
JuanPrez962115
 
Trabajo Coding For kids 1 y 2 grado 9-4.pdf
Trabajo Coding For kids 1 y 2 grado 9-4.pdfTrabajo Coding For kids 1 y 2 grado 9-4.pdf
Trabajo Coding For kids 1 y 2 grado 9-4.pdf
cj3806354
 
3Redu: Responsabilidad, Resiliencia y Respeto
3Redu: Responsabilidad, Resiliencia y Respeto3Redu: Responsabilidad, Resiliencia y Respeto
3Redu: Responsabilidad, Resiliencia y Respeto
cdraco
 
Desarrollo de Habilidades de Pensamiento.
Desarrollo de Habilidades de Pensamiento.Desarrollo de Habilidades de Pensamiento.
Desarrollo de Habilidades de Pensamiento.
AlejandraCasallas7
 
Diagrama de flujo basada en la reparacion de automoviles.pdf
Diagrama de flujo basada en la reparacion de automoviles.pdfDiagrama de flujo basada en la reparacion de automoviles.pdf
Diagrama de flujo basada en la reparacion de automoviles.pdf
ManuelCampos464987
 
TRABAJO DESARROLLO DE HABILIDADES DE PENSAMIENTO.pdf
TRABAJO DESARROLLO DE HABILIDADES DE PENSAMIENTO.pdfTRABAJO DESARROLLO DE HABILIDADES DE PENSAMIENTO.pdf
TRABAJO DESARROLLO DE HABILIDADES DE PENSAMIENTO.pdf
thomasdcroz38
 
INFORME DE LAS FICHAS.docx.pdf LICEO DEPARTAMENTAL
INFORME DE LAS FICHAS.docx.pdf LICEO DEPARTAMENTALINFORME DE LAS FICHAS.docx.pdf LICEO DEPARTAMENTAL
INFORME DE LAS FICHAS.docx.pdf LICEO DEPARTAMENTAL
CrystalRomero18
 
Desarrollo de Habilidades de Pensamiento.docx (3).pdf
Desarrollo de Habilidades de Pensamiento.docx (3).pdfDesarrollo de Habilidades de Pensamiento.docx (3).pdf
Desarrollo de Habilidades de Pensamiento.docx (3).pdf
AlejandraCasallas7
 
DESARROLO DE HABILIDADES DE PENSAMIENTO.pdf
DESARROLO DE HABILIDADES DE PENSAMIENTO.pdfDESARROLO DE HABILIDADES DE PENSAMIENTO.pdf
DESARROLO DE HABILIDADES DE PENSAMIENTO.pdf
marianabz2403
 
ACTIVIDAD DE TECNOLOGÍA AÑO LECTIVO 2024
ACTIVIDAD DE TECNOLOGÍA AÑO LECTIVO 2024ACTIVIDAD DE TECNOLOGÍA AÑO LECTIVO 2024
ACTIVIDAD DE TECNOLOGÍA AÑO LECTIVO 2024
DanielErazoMedina
 
Trabajo Coding For kids 1 y 2 grado 9-4.pdf
Trabajo Coding For kids 1 y 2 grado 9-4.pdfTrabajo Coding For kids 1 y 2 grado 9-4.pdf
Trabajo Coding For kids 1 y 2 grado 9-4.pdf
jjfch3110
 
Diagrama de flujo - ingenieria de sistemas 5to semestre
Diagrama de flujo - ingenieria de sistemas 5to semestreDiagrama de flujo - ingenieria de sistemas 5to semestre
Diagrama de flujo - ingenieria de sistemas 5to semestre
DiegoCampos433849
 

Último (20)

Diagrama de flujo soporte técnico 5to semestre
Diagrama de flujo soporte técnico 5to semestreDiagrama de flujo soporte técnico 5to semestre
Diagrama de flujo soporte técnico 5to semestre
 
Estructuras Básicas_ Conceptos Basicos De Programacion.pdf
Estructuras Básicas_ Conceptos Basicos De Programacion.pdfEstructuras Básicas_ Conceptos Basicos De Programacion.pdf
Estructuras Básicas_ Conceptos Basicos De Programacion.pdf
 
biogas industrial para guiarse en proyectos
biogas industrial para guiarse en proyectosbiogas industrial para guiarse en proyectos
biogas industrial para guiarse en proyectos
 
Posnarrativas en la era de la IA generativa
Posnarrativas en la era de la IA generativaPosnarrativas en la era de la IA generativa
Posnarrativas en la era de la IA generativa
 
(PROYECTO) Límites entre el Arte, los Medios de Comunicación y la Informática
(PROYECTO) Límites entre el Arte, los Medios de Comunicación y la Informática(PROYECTO) Límites entre el Arte, los Medios de Comunicación y la Informática
(PROYECTO) Límites entre el Arte, los Medios de Comunicación y la Informática
 
EduFlex, una educación accesible para quienes no entienden en clases
EduFlex, una educación accesible para quienes no entienden en clasesEduFlex, una educación accesible para quienes no entienden en clases
EduFlex, una educación accesible para quienes no entienden en clases
 
Estructuras básicas_ conceptos de programación (1).docx
Estructuras básicas_ conceptos de programación  (1).docxEstructuras básicas_ conceptos de programación  (1).docx
Estructuras básicas_ conceptos de programación (1).docx
 
trabajo de tecnologia, segundo periodo 9-6f
trabajo de tecnologia, segundo periodo 9-6ftrabajo de tecnologia, segundo periodo 9-6f
trabajo de tecnologia, segundo periodo 9-6f
 
Alan Turing Vida o biografía resumida como presentación
Alan Turing Vida o biografía resumida como presentaciónAlan Turing Vida o biografía resumida como presentación
Alan Turing Vida o biografía resumida como presentación
 
Trabajo Coding For kids 1 y 2 grado 9-4.pdf
Trabajo Coding For kids 1 y 2 grado 9-4.pdfTrabajo Coding For kids 1 y 2 grado 9-4.pdf
Trabajo Coding For kids 1 y 2 grado 9-4.pdf
 
3Redu: Responsabilidad, Resiliencia y Respeto
3Redu: Responsabilidad, Resiliencia y Respeto3Redu: Responsabilidad, Resiliencia y Respeto
3Redu: Responsabilidad, Resiliencia y Respeto
 
Desarrollo de Habilidades de Pensamiento.
Desarrollo de Habilidades de Pensamiento.Desarrollo de Habilidades de Pensamiento.
Desarrollo de Habilidades de Pensamiento.
 
Diagrama de flujo basada en la reparacion de automoviles.pdf
Diagrama de flujo basada en la reparacion de automoviles.pdfDiagrama de flujo basada en la reparacion de automoviles.pdf
Diagrama de flujo basada en la reparacion de automoviles.pdf
 
TRABAJO DESARROLLO DE HABILIDADES DE PENSAMIENTO.pdf
TRABAJO DESARROLLO DE HABILIDADES DE PENSAMIENTO.pdfTRABAJO DESARROLLO DE HABILIDADES DE PENSAMIENTO.pdf
TRABAJO DESARROLLO DE HABILIDADES DE PENSAMIENTO.pdf
 
INFORME DE LAS FICHAS.docx.pdf LICEO DEPARTAMENTAL
INFORME DE LAS FICHAS.docx.pdf LICEO DEPARTAMENTALINFORME DE LAS FICHAS.docx.pdf LICEO DEPARTAMENTAL
INFORME DE LAS FICHAS.docx.pdf LICEO DEPARTAMENTAL
 
Desarrollo de Habilidades de Pensamiento.docx (3).pdf
Desarrollo de Habilidades de Pensamiento.docx (3).pdfDesarrollo de Habilidades de Pensamiento.docx (3).pdf
Desarrollo de Habilidades de Pensamiento.docx (3).pdf
 
DESARROLO DE HABILIDADES DE PENSAMIENTO.pdf
DESARROLO DE HABILIDADES DE PENSAMIENTO.pdfDESARROLO DE HABILIDADES DE PENSAMIENTO.pdf
DESARROLO DE HABILIDADES DE PENSAMIENTO.pdf
 
ACTIVIDAD DE TECNOLOGÍA AÑO LECTIVO 2024
ACTIVIDAD DE TECNOLOGÍA AÑO LECTIVO 2024ACTIVIDAD DE TECNOLOGÍA AÑO LECTIVO 2024
ACTIVIDAD DE TECNOLOGÍA AÑO LECTIVO 2024
 
Trabajo Coding For kids 1 y 2 grado 9-4.pdf
Trabajo Coding For kids 1 y 2 grado 9-4.pdfTrabajo Coding For kids 1 y 2 grado 9-4.pdf
Trabajo Coding For kids 1 y 2 grado 9-4.pdf
 
Diagrama de flujo - ingenieria de sistemas 5to semestre
Diagrama de flujo - ingenieria de sistemas 5to semestreDiagrama de flujo - ingenieria de sistemas 5to semestre
Diagrama de flujo - ingenieria de sistemas 5to semestre
 

DE LA IDEA A LA SOLUCIÓN. DESCUBRE LAS MEJORES PRÁCTICAS UX

  • 1. 1 Subtítulo DE LA IDEA A LA SOLUCIÓN DESCUBRE LAS MEJORES PRÁCTICAS UX
  • 2. 2 RESUMEN EJECUTIVO Dentro d el m und o d el d esarrollo d el software, la exp eriencia d e usuario (UX) se d efin e p or la p ercep ción (negativa o p ositiva) q ue origina la interacción d e un usuario con el software d esarrollad o. Contar con d iseñad ores d e exp eriencia d e usuario (o d iseñad ores UX) e invertir en conseguir esa b uena exp eriencia d e usuario, influirá sin d ud a en el éxito d el p royecto. A la h ora d e p ensar y p lanificar un p royecto es im p rescind ib le tener en cuenta las necesid ad es d el usuario, ya q ue d e esta m anera sab rem os cóm o ofrecer soluciones a su m ed id a y crearem os ap licaciones sencillas y sob re tod o eficientes q ue h arán m ás fácil su vid a. El ob jetivo d el exp erto UX es p or tanto crear interfaces q ue ap ortan la m ejor satisfacción y exp eriencia p osib les d e un p rod ucto o servicio con el m ín im o esfuerzo p ara los usuarios. Im p lantar un p roceso m ultid iscip linar d ond e se usan d iferentes técnicas es la clave p ara conseguir este ob jetivo, centránd ose siem p re y en tod o m om ento en las necesid ad es, exp ectativas, m otivaciones y cap acid ad es d e los usuarios.
  • 3. 3 6 CLAVES DE UX PARA GARANTIZAR UNA EXPERIENCIA DE USUARIO ÓPTIMA 1 ¿POR QUÉ INVERTIR EN UX?2 METODOLOGÍA3 ÍNDICE DE CONTENIDO FASE DE CONSULTORÍA UX4 FASE DE DISEÑO UI5 FASE DE MAQUETACIÓN6 PROPUESTAS DE MEJORA Y VALOR AÑADIDO7 A- ETAPA DE ANÁLISIS "RESEARCH": INFORMACIÓN E INTERACCIÓN B- ETAPA DE PROTOTIPO Y DISEÑO DE INTERACCIÓN UxD ¿CUÁLES SON LAS MEJORES PRÁCTICAS RECOMENDADAS POR EL CENTRO EXPERTO UX DE ATSISTEMAS?
  • 4. 4 6 CLAVES DE UX PARA UNA EXPERIENCIA DE USUARIO ÓPTIMA 1
  • 5. 5 La Experiencia de Usuario o User Experience (UX) es el grado de satisfacción del usuario al interactuar con un producto digital. 6 CLAVES DE UX PARA GARANTIZAR UNA EXPERIENCIA DE USUARIO ÓPTIMA1 01. ANALIZAR el contexto y el m ercado del cliente 03. MATERIALIZAR 05. MEDIR la satisfacción del usuario 02. INVESTIGAR el com portam iento y experiencia de los usuarios 04. DISEÑAR la interfaz del usuario y su codificación 06. ACTUAR para la m ejora continua el concepto en wirefram es y prototipos
  • 7. 7 ¿POR QUÉ INVERTIR EN UX?2 PORQUE REDUCE LOS COSTES A LARGO PLAZO Optim ización del diseño en las fases iniciales para dism inuir los cam bios m ás costosos en fases de desarrollo PORQUE MEJORA EL POSICIONAMIENTO SEO PORQUE FIDELIZA Y SATISFACE AL USUARIO Respuesta a las necesidades del usuario con interfaces intuitivas PORQUE AUMENTA LA TASA DE CONVERSIÓN Mejora de la ventas, presencia y núm ero de visitas PORQUE INCREMENTA LA PRODUCTIVIDAD Y EFICIENCIA Minim ización del trabajo innecesario Apuesta firm e por el diseño responsive
  • 9. 9 Bias &Mayh ew “SI EL SISTEMA ESTÁ EN FASE DE PRODUCCIÓN, CORREGIR EL ERROR COSTARÁ DE 50 A 100 VECES MÁS QUE HACERLO DURANTE EL DISEÑO”. ¿CUÁLES SON LAS MEJORES PRÁCTICAS UX? METODOLOGÍA3 En el Centro Experto de UX/UI de atSistem as, hem os consolidado las m ejores prácticas UX, trabajando siguiendo estándares, m etodologías y técnicas que se centran en el contacto continuo con el cliente y su validación en todas las fases. De este m odo m inim izam os los riesgos y costes de m odificaciones en etapas o fases m ás avanzadas. En cada fase la interacción es continua con el cliente, realizando entregables para su validación y perm itiendo una constante visibilidad del proyecto a tiem po real. Conseguim os garantizar un producto de calidad, evitando así m odificaciones en el periodo de m aquetación o desarrollo por un m al planteam iento inicial.
  • 10. 10 METODOLOGÍA3 Las d iferentes fases d e la m etod ología
  • 12. 12 Cristina Piguillem Resp onsab le d e Negocio UX/UI “ES CLAVE DISEÑAR LA EXPERIENCIA DEL USUARIO, CONOCIENDO CÓMO CAMBIA Y AVANZA LA TECNOLOGÍA, COMBINANDO A LA VEZ TÉCNICA, INTUICIÓN, CONOCIMIENTOS Y CREATIVIDAD”.
  • 13. 13 FASE DE CONSULTORÍA UX4 En la fase de consultoría UX, es el m om ento de conceptualizar y diseñar la solución del proyecto. Para la construcción del diseño de Experiencia de Usuario, recom endam os trabajar en dos etapas diferenciadas: ETAPA DE PROTOTIPO Y DISEÑO DE INTERACCIÓN UxD Se plasm an los resultados de la etapa anterior, con los requerim ientos técnicos. ETAPA DE ANÁLISIS "RESEARCH ": INFORMACIÓN E INTERACCIÓN En esta etap a se ob tien e tod a la in form ación p osib le d el p royecto, clien te, usuarios y p rod ucto a d iseñ ar p ara con vertirlo en un p rod ucto. FASE UX
  • 14. 14 En el inicio d e un p royecto se id entifican las necesid ad es d el cliente. Ad em ás d e las reuniones d e tom a d e req uisitos a las q ue asisten junto con los analistas funcion ales, los exp ertos en Research d efinen los stakeholders con los q ue entrevistarse p ara ob tener la inform ación necesaria p revio al inicio d el p royecto. Los exp ertos en Research id entifican y d eterm inan las técnicas q ue se van a em p lear, con la finalid ad d e p oner en com ún las n ecesid ad es d e los clientes y los ob jetivos d e la em p resa. Cad a m étod o d e estud io ap orta una in form ación concreta q ue el exp erto en Research transform a en un as conclusiones (“entregab le”) q ue servirá d e guía p ara la siguiente fase d e construcción d el p rototip o elab orad o p or el exp erto UX en d iseño d e interacción. FASE DE CONSULTORÍA UX4 ETAPA DE ANÁLISIS "RESEARCH " Consiste en un proceso de análisis basado en el “Diseño Centrado en el Usuario” (User Centric Design). Para realizar el estud io, em p leam os un os m étod os d e an álisis con un os p rop ósitos y ob jetivos con cretos. Defin ición d e stakeholders Ob ten ción d e in form ación n ecesaria Id en tificación d e técn icas a em p lear Defin ir n ecesid ad es d el clien te y ob jetivos d e la em p resa
  • 15. 15 Las técnicas em p lead as en función d el p royecto son las siguientes: FASE DE CONSULTORÍA UX4 ETAPA DE ANÁLISIS "RESEARCH " Personas TÉCNICAS DE RESEARCH Scope Canvas Focus Group Análisis DAFO Diagnóstico Sectorial Benchm ark Mapa de Tendencias Mapa de Em patía Análisis de Casos de Uso Card Shorting Test de Usuario What if Test H eurístico Test A/B
  • 16. 16 TÉCNICA OBJETIVO MECÁNICA ENTREGABLE Personas Identificar cuáles son los usuarios reales de nuestro producto. Definir los perfiles de usuario para dirigir nuestras acciones. Los expertos en Research, tras una labor de investigación a través de cuestionarios y entrevistas, describen los perfiles de los usuarios: edad, sexo, nivel de estudios, nivel social, empleo, tareas cotidianas, gustos, valores, experiencia, completando así el perfil del usuario objetivo y creando un perfil aproximado. Documento con los perfiles de usuario del producto. Scope Canvas Conectar las necesidades de los usuarios con los objetivos de negocio de la organización. Al definir los conceptos visualmente nos ayuda a ordenarlos y jerarquizarlos, constituyendo un pilar fundamental para el desarrollo del UX. El equipo de UX enumera y completa los siguiente factores: necesidades, motivaciones, propósitos, impacto y objetivos. Cuadro con el resultado del estudio, las acciones propuestas y las métricas que se realizarán para garantizar el cumplimiento de los objetivos. Focus Group • Determinar objetivos del proyecto a través de un Focus Group con stakeholders. • Conocer datos cualitativos de los clientes a través de un Focus Group con cliente final. Se organiza una reunión con los involucrados en cada caso. El rol del consultor UX en esta reunión es de moderador, nunca para intervenir con opiniones, guiará las reuniones en función de los objetivos establecidos previamente. Un acta de reunión con las conclusiones del consultor UX tras evaluar los datos obtenidos. Análisis DAFO Identificar los valores que diferencian a nuestro cliente de su competencia. Una vez realizado un estudio de la empresa y sus clientes, el equipo de UX va incluyendo en un cuadrante los conceptos de: debilidades, amenazas, fortalezas y oportunidades. Documento donde se exponen las amenazas, debilidades, fortalezas y oportunidades del estudio. En base a estos resultados se confecciona el mapa de jerarquía del proyecto. FASE DE CONSULTORÍA UX4 TÉCNICAS DE ANÁLISIS "RESEARCH “ (I)
  • 17. 17 FASE DE CONSULTORÍA UX4 TÉCNICAS DE ANÁLISIS "RESEARCH “ (II) TÉCNICA OBJETIVO MECÁNICA ENTREGABLE Diagnóstico de la industria Analizar el nivel de integración de la empresa en su sector. Cuestionario que analiza 7 atributos que la empresa debe cumplir para formar parte de la industria. Conexión, nivel de automatización, flexibilidad, inteligencia, nivel social, eco-sostenibilidad y “smartización” del producto/servicio que genera. Un documento con los 7 atributos que debería de cumplir la empresa para formar parte de la industria y si se está cumpliéndolos o no. En caso de tener deficiencias, cómo solventarlas. Benchmark Conocer las mejores prácticas en el mercado donde se engloba el producto. Con ello, podremos detectar los estándares de navegación y recursos utilizados en productos de la competencia, sobre todo los que se han convertido en referencia de mercado. Se comparan diferentes marcas con contenidos similares para buscar patrones de navegación comunes. Los árboles de navegación de las marcas comparadas indicando los patrones comunes que se han de seguir. Mapa de tendencias Encontrar la marca de éxito con mayor afinidad a nuestro cliente, así como las marcas con líneas de negocio comunes a la nuestra. Nos ayuda a encaminar el producto de cara al UX y posteriormente al diseño. Se ubica el producto en el “Mapa de Tendencias Digitales de Information Architects Inc.” en relación a sus servicios, con herramientas específicas existentes en el mercado. El “Mapa gráfico de Tendencias Digitales de Information Architects Inc.” Mapa de empatía Identificar con exactitud cómo serán los clientes que utilizarán la Web/App. Trazar un perfil aproximado de los clientes, los esfuerzos que realizan y los beneficios que esperan obtener. Se realiza un cuestionario que arroja datos precisos sobre como serán los clientes que utilizarán la Web/App: qué ve, qué dice y hace, qué oye, qué piensa y siente. Mapa con el resultado del estudio y las respuestas a las cuestiones planteadas a los usuarios.
  • 18. 18 FASE DE CONSULTORÍA UX4 TÉCNICAS DE ANÁLISIS "RESEARCH “ (III) TÉCNICA OBJETIVO MECÁNICA ENTREGABLE Análisis de casos de uso Listar todas las funcionalidades de la Web/App con el objetivo de generar una descripción de los pasos necesarios para llevar a cabo los procesos. Se recoge en un documento todas las acciones que se han de poder realizar sobre la Web/App como por ejemplo; “contactar con la empresa”, “información de servicios”, “bolsa de empleo”, “comprar”, etc. Informe de todos los casos de uso, sus funcionalidades y cómo se resuelven. Card Sorting Jerarquizar y agrupar los contenidos, asociándolos a secciones de la Web/App para definir una correcta Arquitectura de la Información. Se crean tarjetas con todo el contenido de la aplicación y se solicita a las personas involucradas, que asocien dichas tarjetas a las secciones indicadas. De esta forma se tiene una comparativa de dónde esperan los usuarios encontrar cada elemento y con ello construimos el mapa de navegación. Diagrama de contenidos por secciones. Test de usuario Conocer cuáles son los patrones de comportamiento de los usuarios. Con ello podemos extraer los puntos fuertes que necesitamos incluir en el proyecto. Consiste en que personas afines a las necesidades de la marca prueben la Web/App del cliente o de la competencia en caso de que el cliente no disponga todavía del producto creado. Vídeo de la navegación y las impresiones de cada usuario. Mapas de calor de las zonas en las que los usuarios han navegado más. Estadísticas de clicks. Cuestionario que el sujeto de prueba rellena al final del test. What If Conocer los problemas y errores que pueden surgir así como qué se debe evitar al conceptualizar el producto. Se trata de reunirse con los involucrados para que expresen las connotaciones negativas que puede haber en el producto. Documento con el listado de elementos y acciones a evitar en la fase de conceptualización del proyecto.
  • 19. 19 FASE DE CONSULTORÍA UX4 TÉCNICAS DE ANÁLISIS "RESEARCH“ (IV) TÉCNICA OBJETIVO MECÁNICA ENTREGABLE Test heurístico Detectar si una Web/App muestra algún error de usabilidad. Se realiza el test sobre estándares de navegación sobre el producto. Excel con las conclusiones del consultor UX tras estudiar los datos obtenidos. Test A/B Comparar variantes en cuanto a páginas o funcionalidades concretas que son mostradas al usuario de forma aleatoria o controlada. De esta forma, mediante la analítica Web se obtienen resultados sobre de qué variante obtiene una mejor conversión. Se define inicialmente qué se quiere evaluar y se genera dos versiones distintas con los cambios realizados (a nivel visual o funcional). Se define cuánto tiempo se mostrarán y se analiza. Documento con el informe del análisis obtenido en cada una de las variantes. Journey Map Comprender y entender la experiencia de cliente desde el inicio o acceso, hasta el fin (en eCommerce postventa). Consiste en conocer las experiencias y emociones de los usuarios, con el fin de mejorarlos. Para ello definimos en un mapa temporal la experiencia del usuario: etapas, interacciones, canales, problemas, elementos y acciones a realizar por un usuario. Un gráfico con coordenadas: • X: espacio temporal donde se incluyen las fases. • Y: registro de las experiencias del usuario, destacando las positivas en verde y las negativas en rojo, creando tonalidades intermedias en función del grado positivo o negativo. Documento de conclusiones para mejorar y resolver problemas del sistema. Walkthrough/Recorrido Cognitivo Herramienta de rápida implementación para localizar posibles fallos de navegación que un proyecto pudiera tener. Sobre un prototipo rápido en papel, se realizan tareas concretas y se localiza así los posibles fallos de navegación que pudieran surgir antes de abordar la fase de diseño UI y/o maquetación. Con todas las anotaciones de los comentarios de los usuarios y el sistema, y una vez analizados los datos resultantes del walkthough, informe con las oportunidades de mejora de la aplicación.
  • 20. 20 FASE DE CONSULTORÍA UX4 ETAPA DE PROTOTIPO Y DISEÑO DE INTERACCIÓN UXD Consiste en un proceso de construcción del prototipo navegable a través de wirefram es y d iseñ o d e in teracción . El d iseñ o d e in teracción b usca alin ear al in terfaz con el usuario. Los exp ertos en UxD se en cargan d e con figurar el d ocum en to d escrib ien d o las in teraccion es. La clave es el trab ajo en eq uip o q ue p erm ite d iscutir id eas y p rop uestas, con el fin d e con trastar y d ecid ir la m ejor solución . En cad a p royecto, en atSistem as ten em os p autad a un a estructura d e trab ajo, y ésta p ued e verse m od ificad a en algún caso según las características d el p royecto. ARQUITECTURA DE INFORMACIÓN ÁRBOL DE CONTENIDO FLUJO DE NAVEGACIÓN PROTOTIPO NAVEGABLE DISEÑO DE INTERACCIÓN HERRAMIENTAS RECOMENDADAS Basad o en la exp erien cia d e n uestros esp ecialistas en d iseñ o d e in teracción , recom en d am os, en fun ción d e la n ecesid ad d el p royecto, d iversas h erram ien tas p ara el d iseñ o d e in teracción (flujos, d iagram as, esp ecificacion es, ...) y p ara la creación d el p rototip o en wirefram es: Axure, p or ser un a h erram ien ta m uy com p leta q ue p erm ite el d iseñ o d e in teracción y el p rototip o n avegab le, Justin m in d , Ad ob e XD, Balsam iq e In vision . HERRAMIENTAS
  • 21. 21 ETAPA DE PROTOTIPO Y DISEÑO DE INTERACCIÓN UXD FASE DE CONSULTORÍA UX4 ARQUITECTURA DE INFORMACIÓN ÁRBOL DE CONTENIDO FLUJO DE NAVEGACIÓN PROTOTIPO NAVEGABLE DISEÑO DE INTERACCIÓN Se d efin e y recop ila la in form ación q ue va a con ten er tod o el p royecto. En este p un to se req uiere la totalid ad d e d ocum en tación fun cion al: • organ ización d e la in form ación • Etiq uetad o ya q ue es im p ortan te d efin ir el len guaje utilizad o, com p ren sib le, estan d arizad o y fiel al b ran d in g d e la em p resa • n ecesid ad es d el usuario, resp uesta a sus b úsq ued as p roactivas y reactivas El árb ol d e con ten id os es un a p ieza clave d e la Usab ilid ad d el p royecto. Para un a correcta d efin ición , los exp ertos en d iseñ o d e in teracción se n utren d e la in form ación recop ilad a en la etap a d e Research (Card Sorting), fun d am e n tal p ara crear un árb ol con solid ad o y q ue resp on d a a las n ecesid ad es d el usuario. Es la rep resen tación gráfica d el cam in o q ue realiza el usuario en la realización d e las tareas. In icialm en te los exp ertos en d iseñ o d e in teracción realizan un esq ueleto en p ap el, d iferen cian d o las fases, los ob jetos y las tareas d el p roceso. El exp erto d e UX tien e com o p rem isa los estud ios p revios d e la etap a d e Research, con el fin d e en ten d er cuál es el com p ortam ien to real d e los usuarios y d efin ir el flujo q ue resp on d e a sus accion es, d iferen cian d o en el d iagram a sus activid ad es y sus d ecision es. El p rototip o n avegab le se realiza a través d e wirefram es , o d iseñ o d e b aja calid ad , d on d e el exp erto en UxD in cluye a m od o rep resen tativo los elem en tos q ue con form an cad a un a d e p an tallas, así com o la n avegación en tre ellas. El exp erto d e UxD m od ela las in teraccion es d e la in terfaz, d efin ien d o cóm o el usuario in teractúa con el sistem a. Defin e cad a un o d e los elem en tos q ue com p on e cad a vista y cóm o se com p orta en cad a caso (over, click, select, errores, avisos, ...). Para la realización d el m ism o tien e en cuen ta las ap ortacion es d e los estud ios realizad os d el exp erto en Research.
  • 23. 23 FASE DE DISEÑO UI5 En la fase de diseño UI y en base a la docum entación entregada por el experto en UxD, el experto en diseño visual prepara el diseño a incluir en la interfaz. El objetivo del equipo UI es la elaboración de un producto que responda a las necesidades de los usuarios. El diseño es un elem ento vivo, en continuo cam bio. Los expertos de atSistem as en diseño, conscientes de su im portancia, dedican parte de su trabajo a la investigación y form ación en nuevas tendencias de diseño en todos las plataform as del m ercado. Esto nos sitúa a la vanguardia en nuestros diseños. Para conseguir unos resultados exitosos, disponem os de una organización de trabajo específica: HERRAMIENTAS RECOMENDADAS: Actualm ente, recom endam os en base a la experiencia de nuestros diseñadores, diseñar con la herram ienta Sketc. Esta herram ienta perm ite diseñar Interfaces a tam año real y adem ás aporta com plem entos de las diferentes plataform as actuales. Tam bién perm ite la publicación del diseño en la herram ienta Zeplin que utilizan los equipos de m aquetación. Aporta m ucho m ás valor que una guía de estilos y perm ite descargar autom áticam ente los assets sin n ecesid ad d e in vertir tiem p o d e d iseñ o en esta lab or. Otras h erram ien tas utilizad as en fun ción d e la n ecesid ad d el p royecto p or los d iseñ ad ores UI son Sketch , Zep lin p ara la p ub licación , Illustrator, Ph otosh op e In d esign . HERRAMIENTAS
  • 24. 24 5 FASE DE DISEÑO UI El experto en UI analiza la inform ación obtenida de UX. Será la base del diseño y la estructura que debe utilizar, así com o de los elem entos que configuran cada una de las pantallas del proyecto. Teniendo bien definido el m arco del proyecto, el experto UI realiza una labor de investigación sobre el diseño de los productos com petencia. De este m odo, puede obtener patrones de diseño com unes a tener en cuenta, y en m uchos casos que se convierten en m andatorios. En este punto, el equipo de diseño junto con el cliente debe definir cuál será la línea de diseño a seguir. Para ello se suele preparar varias propuestas. En caso de existir guía de estilo previa, se propone evoluciones y m ejoras según las tendencias del m om ento. El experto de UI diseña cada una de las pantallas que conform an el proyecto, incluyendo los m ensajes, avisos y elem entos com plem entarios. Una vez finalizados los diseños y aprobados, se genera una guía de estilo del producto. La iconografía, las im ágenes y los elem entos incluidos en el diseño, deben ser separados com o elem entos independientes (assets) p ara p od er ser in cluid os en la fase d e m aq uetación .
  • 26. 26 Los exp ertos en m aq uetación trab ajan con d iferentes tecnologías y p lataform as FASE DE MAQUETACIÓN6 Es clave disponer de un equipo experto en diseño front-end, esp ecializad o en d iferentes tecn ologías y en continua form ación sob re las últim as h erram ientas d el m ercad o. Es clave seguir una m etod ología q ue cub re tod as las fases d el d iseño, y d isp oner d e exp ertos en cad a una d e las fases. Cad a fase es testeada con los d istin tos esp ecialistas, form and o un único eq uip o y garantizand o así el éxito d el p royecto. Tod o esto evita errores d e interp retación y d iferencias entre el d iseño ap rob ad o y la m aq uetación final. Ap orta com p licid ad entre los exp ertos d e las d istintas esp ecialid ad es, favoreciend o el ap oyo en tre sí en las d iferentes etap as d el p royecto. TECNOLOGÍAS CSS 3 JavaScript, Web Com ponent, An gular.js, Nod e.js Responsive Web Design y Adaptative Web Design ECOMMERCE CMS MAQUETACIÓN MOBILE Magen to SalesForce Magn olia Word Press Joom la Nativo Hyb reed PLATAFORMAS
  • 27. 27 PROPUESTAS DE MEJORA Y VALOR AÑADIDO 7
  • 28. 28 • Metodología propia que incluye todas las fases de diseño y m aquetación: evitam os errores de diseño al adaptarnos a cada tecnología y m inim izam os diferencias entre el diseño aprobado y la m aquetación final. • Conocim iento y uso de las herram ientas m ás actuales y que aportan m ayores beneficios al proyecto. • Equipo m ultidisciplinar UX/UI con conocim iento de varias tecnologías y técnicas. • Metodología de trabajo que facilita el cum plim iento del estándar de calidad y la satisfacción del cliente: cada paso requiere de una validación previa con el cliente, garantizando la evolución del proyecto según las expectativas. • Menores costes de desarrollo: invertim os desde el inicio en un diseño adecuado y m inim izam os las iteraciones en fases posteriores • Mayor calidad y diseños adaptados a las tecnologías de desarrollo: nuestros expertos saben de distintas tecnologías, y facilitan la m aquetación y program ación con diseños adaptados a cada una de estas tecnologías. • Aum ento de las ventas y del ROI: tenem os una experiencia dem ostrada en proyectos de eCom m erce con grand es m arcas • Mayor productividad y eficacia: utilizam os las últim as h erram ientas d e m ercad o y realizam os d iseños q ue red ucen el trab ajo innecesario y red und ante • Mayores cuotas d e fid elización y satisfacción d el usuario; n uestro m un d o gira alred ed or d e la exp eriencia d e uso y nuestros clientes p ercib en el cam b io. PROPUESTAS DE MEJORA Y VALOR AÑADIDO DE ATSISTEMAS7
  • 29. 29 www.atsistemas.com 902 888 902 GRACIAS Madrid C/Valle de Alcudia.3 Edificio 2, planta 1. 28232. Las Rozas, Madrid Barcelona Plaça de Catalunya, 21 - 2ª 08002, Barcelona Cádiz Edificio Jerez Parque Empresarial, Calle del Desarrollo 2; oficina 12, planta 1, 11047, Jerez de la Frontera, Cádiz Zaragoza Centro Tecnológico TIC XXI C/Bari, 57 Plataforma Logística (PLA-ZA), 50197, Zaragoza A Coruña Edificio Mans, Polígono de Pocomaco, parcela D22, 15190 A Coruña Islas Baleares Regus Palma - Polígono de Son Castello Carrer Gremi de Sabaters, 21, 2º - 24B 07009 Palma de Mallorca Illes Balears