SlideShare une entreprise Scribd logo
1  sur  57
Diseño Móvil
Mejores Prácticas
Complethost Ltd.
Lo que está por delante
Introducción
Antecedentes contextuales
Exploración 1 - navegación, navegar y buscar
Exploración 2 - Diseño de Contenido
Exploración 3 - Rendimiento y Entrega
La dinámica del equipo
¿A qué están expuestos
los usuario de dispositivos móviles?
¿A qué están expuestos los usuario de dispositivos móviles?
Nuevas interfaces Mas control Rutas simplificadas Mas información
¿A qué están expuestos los usuario de dispositivos móviles?
Nuevos flujos de trabajo Retroalimentación Interacciones mas claras Mas detalles
¿A qué están expuestos los usuario de dispositivos móviles?
Múltiples Plataformas Soporte a mano
¿A qué están expuestos los usuario de dispositivos móviles?
Mas y mejores ofertas
¿Qué está impulsando este cambio?
Logística Factor Impulso Menos escasez Prueba Social
Compras libre de riesgo Tecnología del Hardware Tecnología del Software Amplios accesos
Consumidores móviles se relacionan una experiencia de calidad para:
Fiabilidad y robustez Facilidad de uso / Placer
Velocidad de la experiencia Seguridad y confianza
Tres Exploraciones
Exploración 1 - navegación, navegar y buscar
Exploración 2 - Diseño de Contenido
Exploración 3 - Rendimiento y Entrega
Exploración 1 - navegación, navegar y buscar
¿Cuáles son los desafíos?
Volumen de contenido
Muchos productos, necesitan
categorizar y clasificar para el usuario
para navegar a través
Accesibilidad rápida
Si un usuario sabe lo que él / ella
deseos, que esté disponible para
el usuario inmediatamente
Los usuarios de móviles no son conocidos por su paciencia por lo que
necesita para limitar la número de interacciones antes de llegar a las
opciones del producto.
Limite el número de opciones de menú en cada página
Incluso Amazon, con su gran cantidad de opciones de productos, sólo
ofrece seis categorías en su página principal.
Otro informe publicado en The Journal of Personality and Social
Psicología sugiere que las personas tienden a confundirse cuando se
presenta con más de seis opciones.
Obedezca la regla 44x44
Dar a cada elemento interactivo amplio espaciamiento
Que sea nativo
Utilizar las transiciones y la eficiencia de interfaz de usuario
Navegación
Mejores prácticas generales
Limite las capas de la navegación
44
Navegación: Buenas prácticas sobre iOS
Una estructura de navegación jerárquica
Vaya al hacer una elección por pantalla
En una aplicación jerárquica, los usuarios navegan al hacer una elección por la pantalla hasta que
alcanzan su destino. Para desplazarse a otro destino, los usuarios deben volver sobre algunos de sus
pasos-o empezar de nuevo desde el principio y tomar decisiones diferentes.
Navegación: Buenas prácticas sobre Android
Un cajón de navegación
Navegue por deslizar desde el borde izquierdo
El usuario puede llevar el cajón de navegación en la pantalla deslizando desde el borde izquierdo
de la pantalla o tocando el icono de la aplicación en la barra de acción
Navegación y exploración
Mirada en profundidad
Oferta mostrando producto temático o guiada
Los clientes que necesitan la inspiración antes de decidir qué tipo de productos
para comprar. para ejemplo, los pantalones de verano o los regalos de
cumpleaños para los niños de 10 años.
Diseñar una página web de fácil lectura óptica que permiten a los usuarios
tener una idea por lo que pueden hacer y esperar encontrar en su sitio.
El 80% de los usuarios desplazarse arriba y abajo por toda la página cuando se
posan sobre una página de inicio o de una lista de categorías, en lo que fue
descrito por muchos como "la obtención de una resumen de mis opciones. "
Evite subcategoría redundancia y la ambigüedad.
Más concretamente, evitar demasiado profundas y poco profundas categorías,
jerarquías ilógicas, y desajustes entre las categorías y su contenido.
Navegación y exploración
Mirada en profundidad
Diseñar una página web con facilidad de
lectura óptica y que permiten a los
usuarios tener una idea de lo que pueden
hacer y esperar encontrar en su sitio.
Path ojo confuso
Altamente gráfica
Al desorden visual
Demasiados CTAs
No jerarquía efectiva
67% de los usuarios móviles
búsquedas realizadas en la última semana
Búsqueda
Mejores Prácticas
Mobile es muy locales (40% de acuerdo a Google), centrada y oportuna.
Cuatro de cada cinco personas utilizan sus teléfonos inteligentes para buscar
información local.
Tienen mango búsqueda faltas de ortografía y, más importante aún, sinónimos.
Los usuarios tienen poco conocimiento de la jerga y palabras clave específicas
de la industria.
Un enfoque más sistemático y automatizado sería hacerlo Diccionario máquina
de búsquedas de sinónimos y agregarlos como reserva (menor ponderadas)
palabras clave en su lógica de búsqueda.
Manejar consultas de búsqueda temáticos inteligentemente preferentemente
se combina con los resultados de los productos o al menos con enlaces a
coincidir listas de categorías temáticas.
Ropa de búsqueda es a menudo difícil de usar como nombres de productos son
raramente descriptiva sino que utiliza el nombre de modelo del producto. Así
que a menos que el usuario conoce el nombre de modelo exacto de la prenda
de vestir que quiere, será difícil conseguir una lista de resultados relevantes
Buscar: Comportamiento In-store
Mejores prácticas
Neiman Marcus
Esta aplicación proporciona a los clientes la posibilidad de personalizar
la "experiencia" en la tienda de compra por marcar cierta artículos, y la
conexión con el personal de ventas.
Meatpack: Hijack
Se utiliza la tecnología GPS para detectar los usuarios de su aplicación
cuando estaban en las tiendas de la competencia, antes de enviarlos a un
mensaje con un descuento. El importe del descuento actuó como
temporizador, así que el cliente tuvo que correr a la tienda.
http://vimeo.com/58411219
Amazonas
Para realizar la búsqueda de productos aún más fácil, Amazonia
aplicaciones móviles tienen un escáner de código de barras que permite
a los usuarios encontrar de inmediato los detalles del producto y el costo
Exploración 1
Intente un ejercicio
Vamos a dibujar algo.
Romper en equipos de tres y pasar 15 minutos en una de las siguientes acciones:
¿Cómo se organiza una despensa?
¿Cómo se puede ordenar su ropa?
¿Cómo encontrar un buen restaurante
tailandés sin Internet?
Exploración 2 Diseño de Contenido
Exploración 2
Intente un ejercicio
Vamos a dibujar una tira cómica.
Romper en nuevos equipos de tres y pasar 15 minutos dibujando una tira cómica.
Usted está limitado a la presentación de tan sólo tres paneles.
Describir cómo funciona la reforma de salud
La historia de Romeo y Julieta
¿Cómo vuela un avión?
Retos con diseño de contenidos
También hay mucho que decir
El usuario no puede consumir todo
información y entrega
Todo es Importante
La pérdida de jerarquía y claridad
Diseño de Contenido: Las mejores prácticas
integridad estética
Desarrollar una integridad estética
integridad estética no mide la belleza de una aplicación de
ilustraciones o caracterizar su estilo;
Más bien, representa cómo así la apariencia y el comportamiento
de una aplicación se integra con su funcionar para enviar un
mensaje coherente.
Es una medida de qué tan bien el aspecto de su aplicación se
integra con su función.
Diseño de Contenido: Las mejores prácticas
Contextuales y conciso
Crear contenido conciso y contextual
Tenga siempre en cuenta que el contenido para móvil
tiene una diferente contexto, el enfoque debe ser
adaptado para este particular, medio.
Describa sólo lo que el usuario necesita saber.
Eliminar la redundancia, como los títulos que reiteran el
cuerpo de un cuadro de información.
Mantener texto lo más corto posible
Diseño de Contenido: Las mejores prácticas
Jerarquía Visual
Centrarse en la jerarquía visual
Contraste Color, creando énfasis visual para crear claro distinciones
Forma, diferentes formas tienen diferente peso visual
El tamaño, los elementos más grandes requieren más atención que
los más pequeños.
Continuidad Lines, un móvil muy estándar y fácil de usar elemento
de la lista
Similitud, Agrupación de elementos similares juntos tiende a crear
énfasis y demandar atención
Espacio, espacio negativo y el espacio entre elementos no sólo le da
a su sala de diseño de respirar, pero también se puede utilizar para
crear aplazamiento.
Diseño de Contenido: Estudio y Análisis
Diseño visual y contenido
Claro CTAs
Mensajería Conciso
Libre de desorden
Jerarquía definida
Exploración 3 Rendimiento y Entrega
¿Cuáles son los desafíos?
Redes y dispositivos
Potencia de procesamiento lento y limitado
y la mala calidad de la red
Experiencia del usuario
Sin comentarios, complicados flujos
y enlaces inútiles
Rendimiento: Mejores prácticas
Hardware y limitaciones de los datos
La gente espera una experiencia más rápida en el
móvil y luego se ponen en el escritorio, pero las
redes de conectarlos a su servicio son naturalmente
más lento.
Como resultado de ello, su aplicación termina la
lucha el rendimiento en ambos lados.
En estas situaciones, lo que realmente vale la pena ser optimista
Rendimiento: Mejores prácticas
Percepción del desempeño
¿Cómo la velocidad puede ser una característica de diseño?
Su parte de la experiencia básica, que necesita para apoyar el flujo de usuarios.
Preforma acciones con optimismo
Tiene una interfaz de usuario reactiva, hacer que los elementos responden más
rápido a medida que interactúa en la parte posterior. Como botones Añadir al
carro. Si se produce un error en la parte de atrás, entonces la interfaz de usuario
puede ajustar.
Amazon nueva patente para los métodos de envío.
Contenidos de forma adaptativa precarga
Escuche lo que los usuarios que el usuario está interesado y precargar esa
particular elemento en lugar de hacerlo todo a todo el contenido de una sola vez
Mover bits cuando está mirando a nadie
Cuando se puede anticipar mejor, usted puede tomar el contenido de la etapa 1
y comenzar a utilizar los datos en el momento de su en el paso 3. En el ejemplo,
cómo Instagram archivos de imágenes.
Exploración 3
Intente un ejercicio
Rediseño de una situación a aparecer más rápido
Romper en nuevos equipos de tres y pasar 20 minutos diseñar una experiencia a aparecer más rápido.
Se puede escribir, dibuja, actuó, o descrita.
Reclamación de equipaje
Esperando en la cola
El crecimiento de un jardín
Paseo Ascensor
Asegúrese de uno
Trabajando Juntos
¿Por qué la mayoría de los equipos fallan?
(y cómo se puede evitar que se)
Estructura del Equipo
Etapas de Tuckman de Desarrollo de Grupos
Formación Ideas
NormalizaciónRealización
Estructura del Equipo Etapa de formación
Formación
La recopilación de información e impresiones
Esta etapa se trata de sentirse quién más está involucrado, el alcance de la tarea, y cómo acercarse a
ella. Por lo general carente de conflicto como las opiniones son sigue posicionada como "puntos de
discusión" para más tarde.
Oportunidades
Desarrollar un entendimiento de los objetivos de cada persona / de papel
Buscar intereses comunes y hacer nuevos amigos
Ver cómo funciona cada miembro del equipo y funciones
Capacidad de construir el respeto mutuo entre los roles
Desafíos
Poca tiende a hacer en este momento debido a la prevención de conflictos
Deseo de aceptación / romance de la idea puede simplificar excesivamente las cosas
Los miembros del equipo pueden crear actividades independientes / opiniones que pueden trabajar
en contra de la imagen más grande si Los miembros del equipo tienden a centrarse en sí mismos
Comentarios - redactadas por el "nosotros" y "tal vez" - "Yo hago mi parte. Espero que lo hagas tuyo. " -
"No tenemos diferencias".
Estructura del Equipo Etapa Ideas
Diferentes ideas, que compiten para su consideración
Esta etapa puede ser emocional como miembros del equipo comienzan a cruzar caminos en las ideas ,
perspectivas y maneras de ir sobre la solución de la problema . Puede ser molesto e impulsado por el
orgullo.
Oportunidades
Comunicar las metas de opinión agnóstica del proyecto
Desarrollar un entendimiento de los objetivos de cada persona / de papel
Analizar la lógica y el razonamiento para identificar puntos comunes
Mire el problema con una perspectiva más amplia para limitar pensamiento de grupo
Crear un lugar seguro para compartir opiniones y puntos de vista
La tensión y la lucha está bien si hay adjudicación imparcial
Capacidad de construir el respeto mutuo entre los roles
Desafíos
Las pandillas y "lados" pueden formar , creando la fragmentación en el grupo
Puede ser contencioso, emocional, molesto y frustrante
Tendencia a centrarse en las minucias
La tolerancia y la paciencia es una necesidad
Comentarios - directa y desagradable
"Yo estoy haciendo mi parte . ¿Por qué no haces el tuyo ? ""No me gusta sus diferencias. "
Ideas
Estructura del Equipo Etapa de Normalización
Se necesita un plan mutuo para el equipo
Esta etapa consiste en encontrar una manera de construir un plan de inversión que
todo el mundo puede trabajar hacia. Esto implicará un toma y daca de todos los miembros con el
fin de funcionar.
Oportunidades
Desarrollar la empatía y la apropiación mutua
Mantener un foro de debate abierto y aceptado
Pinte una imagen de lo que parece el éxito
Contar con una estructura debate abierto en torno a temas divisivos
Desafíos
Puede que algunos no desean renunciar a sus ideas
Orgullo / autoridad puede crear la jerarquía insalubres
La renuencia a compartir ideas controvertidas
La pérdida de confianza o de confianza en sí mismos o unos a otros
Comentarios - Obtención de ayuda para conseguir la materia hecha
"Estamos haciendo el trabajo. Gracias por la ayuda. ""Trabajamos a través de nuestras diferencias."
Normalización
Estructura del Equipo Etapa Realización
Realización
Diferentes ideas que compiten para su consideración
Esta etapa considera que los miembros del equipo tan motivado, bien informado, y competente para
funcionar de manera autónoma. Aún se espera la disensión, pero hay confianza y respeto mutuos para
trabajar productivamente a través de él.
Oportunidades
Optimizar los procesos de toma de decisiones
Abrir, lazos directos y honestos de retroalimentación
Desarrollar un mayor nivel de habilidad y maestría
Menos de gestión o de supervisión continua
La salida de mayor calidad
La confianza mutua y el respeto de sus proyectos futuros
Tendencia de los miembros para complementar las debilidades de los otros
Desafíos
Los cambios en los miembros del equipo volverá a la etapa de formación
Gestión de tratar de controlar siempre el Grupo de Desarrollo
La inseguridad en la forma de "síndrome del impostor"
vulnerabilidades personales y cuestiones
Comentarios - sobre el trabajo y conseguir que se haga.
"Estamos muy impresionante. Vamos a hacer más cosas! ""Nuestras diferencias nos hacen más fuertes."
Estructura del Equipo
Comentario: La formación
Alto grado de orientación
necesita de gerente
Roles individuales no están claras
El proceso no bien establecido
Formación
La comprensión de cómo el equipo las
decisiones se toman
El propósito es claro, pero el equipo
relationships son borrosas
Formación Ideas
Alto grado de orientación
necesita de gerente
Roles individuales no están claras
El proceso no bien establecido
Estructura del Equipo
Comentario: La Idea
Estructura del Equipo
Comentario: La Normalización
Formación
Alto grado de orientación
necesita de gerente
Roles individuales no están claras
El proceso no bien establecido
La comprensión de cómo el equipo las
decisiones se toman
El propósito es claro, pero el equipo
relationships son borrosas
Ideas
Las relaciones son así entendida en el
equipo
Compromiso con la metas del equipo
Comienza a trabajar para optimizar
proceso de equipo
Normalización
Estructura del Equipo
Comentario: La Realización
Formación
Alto grado de orientación
necesita de gerente
Roles individuales no están claras
El proceso no bien establecido
La comprensión de cómo el equipo las
decisiones se toman
El propósito es claro, pero el equipo
relationships son borrosas
Ideas
Las relaciones son así entendida en el
equipo
Compromiso con la metas del equipo
Comienza a trabajar para optimizar
proceso de equipo
El equipo se ha comprometido
a un buen desempeño
Se centra en su carácter
estratégico
El equipo funciona bien con
poca supervisión
Realización Normalización
Estructura del Equipo
¿Quiénes son los miembros de un equipo de diseño ?
Estructura del Equipo
¿Cómo esta formado un equipo de diseño?
Diseñador de interfaz de usuario
Conjunto de habilidades
• Conocimiento del desarrollo Frontend/nativo
• Saber cómo las interacciones e interfaces relacionadas con la tecnología motivación
Tiene un profundo interés por las interacciones de contenido, color, tipografía, diseños, y los detalles visuales y
textuales más finos de una experiencia.
Lo más probable para encontrar la resonancia con
• Los diseñadores UX
• Gerentes de Producto
Estructura del Equipo
¿Cómo esta formado un equipo de diseño?
UX Designer
Conjunto de habilidades
• Algunos dev y experiencia en el diseño de interfaz de usuario
• Saber cómo las interacciones e interfaces trabajan juntos como una experiencia motivación
Tiene un profundo interés en cómo actúa la gente, pensar y tomar decisiones en
Para diseñar una experiencia intuitiva y positivamente utilizable.
Lo más probable para encontrar la resonancia con
• Gerentes de Producto
• Expertos de dominio
• Diseñadores de interfaz de usuario
Estructura del Equipo
¿Cómo esta formado un equipo de diseño?
Conjunto de habilidades
• Amplio dominio de la pila completa de tecnologías de desarrollo móvil
• Experiencia o apreciación para el diseño UI / UX
• Una capacidad de pensar de forma iterativa y en el ámbito de la creación de prototipos motivación
Tiene un profundo interés por los detalles técnicos, las relaciones de datos, la lógica de datos,
y la comprensión de cómo las diversas tecnologías se interrelacionan.
Lo más probable para encontrar la resonancia con
• Los diseñadores UX
• Gerentes de Producto
Ingeniero completa Stack
Estructura del Equipo
¿Cómo esta formado un equipo de diseño?
Conjunto de habilidades
• Un experimentado ex ingeniero o ex-diseñador de ahora el principal producto de la visión estratégica motivación
Tiene un profundo interés por una experiencia de usuario sin problemas que cumpla con todos los objetivos, y
proporciona tanto una visión cualitativa y cuantitativa para la futura estrategia de producto.
Lo más probable para encontrar la resonancia con
• Los diseñadores UX
• Expertos de dominio
Product Manager
Estructura del Equipo
¿Cómo esta formado un equipo de diseño?
Conjunto de habilidades
• la experiencia de campo profundo y conocimiento del espacio de operación
• Experiencia en el diseño de la interfaz de usuario de software / UX motivación
Tiene una profunda comprensión de cómo se relaciona el trabajo de nuevo a funcionamiento,
y lo que se necesitaría para lograr el éxito dentro de la organización.
Lo más probable para alinearse con
• Gerente de Producto
• Diseñador UX
Experto en dominios
Estructura del Equipo
¿Cómo es el proceso que realiza un equipo de diseño?
Estructura del Equipo
El proceso de realización de un equipo de diseño
Formar adecuadamente Tomar posesión Claro Dirección Comunicarse
Los equipos se nutren de la cultura y los valores compartidos
• Disfrute de la forma y el período temporal
• Definir claramente los roles individuales
• Establecer relaciones interpersonales
• Definir los límites del proyecto
Actividades para ayudar a formar adecuadamente
Aprenda más acerca de su personalidad de los miembros de su
equipo
Construir una cultura de aprecio, retroalimentación,
reconocimiento y apoyo
Ir en un viaje de retiro o días para obtener a conocer a sus
compañeros en una favorable al medio ambiente
Hacer un taller de mapeo empatía
sobre un tema relacionado a construir una cultura de grupo
Estructura del Equipo
El proceso de realización de un equipo de diseño
Formar adecuadamente Tomar posesión Claro Dirección Comunicarse
Los equipos internacionales se apropien
• Definir el éxito como un equipo
• Definir el éxito como un individuo
• Las personas y el equipo son responsables
para el producto final
• Identificar los objetivos y resultados del equipo
• Establecer un proceso de toma inclusiva
Actividades para ayudar a tomar posesión
Crear un perfil de equipo e identificar lo que falta / podría ser
más fuerte
Establecer las reglas de su cultura y organizar la forma en que
se medirán
Dividir diseños de prueba y validar con los usuarios para
reducir el debate subjetiva
Elegir a un disidente vocal (y cualquier persona) para una tarea
de diseño específico y tienen a llevar a cabo un almuerzo y
Aprende
Estructura del Equipo
El proceso de realización de un equipo de diseño
Formar adecuadamente Tomar posesión Claro Dirección Comunicarse
Todo el mundo se queda hasta al día en tiempo real
• Tener articulado individuo cómo contribuirán
• Ayudar a sí identifican fortalezas / debilidades
con el fin de llenar los vacíos
• Crear plazos claros, los hitos y eventos
• Alcance de documentación puede ser requerida
Actividades para ayudar a una dirección clara
Proyecto tarea simple orientado la administración puede ayudar
con el enfoque
Simplifique diarias monologuitos en curso
flujos de comunicación
Tener un día de reuniones gratuito para Sprint diseño inalteradas
Realice una matriz problema / declaración a replantear el problema
y proporcionar una nueva perspectiva
Estructura del Equipo
El proceso de realización de un equipo de diseño
Formar adecuadamente Tomar posesión Claro Dirección Comunicarse
Todo el mundo se queda hasta al día en tiempo real
• Crear una jerarquía de comunicación
• Mantener reuniones / Stand-ups a un horario estricto
• Trabajar de lado a lado en donde y cuando sea posible
• Evite conversaciones paralelas para que nadie-persona
tiene
para dar manualmente contexto al equipo
• Lea un resumen diario de los avances en días de gran
afluencia
• Establecer un proceso de adjudicación
Actividades para ayudar a comunicar
Crear prototipos funcionales y recoger / pista retroalimentación
diseño
Reúna detallados conocimientos comportamiento de los
usuarios en forma de vídeo y rastreado
retroalimentación para compartir entre el equipo
Utilizar una plataforma de colaboración para debates sobre las
cuotas, la investigación y actualizaciones en tiempo real de
trabajo del proyecto
Teléfono = inmediata
IM = menos de una hora
= Email para mañana
Campfire = sin respuesta necesaria
Ejercicio
Mapeo de la Empatía una experiencia de usuario
Tiempo
10 minutos
Materiales
Papel grafo, Chinchetas, notas post-it diferentes colores
Cómo
1. A gran papel grafo, dibuje la base de la empatía
mapa con cuatro cuadrantes:. 1 Say; . 2 Realice; . 3 Piense; 4. Siente.
2. Tenga en cuenta que "decir" y "no" son muy explícitos y "Pensar" y "sentir"
están implícitos.
3. Considere la experiencia de un usuario específico y caminar el mapa,
escribiendo en notas adhesivas lo que el usuario dijo, hizo, fieltro, o el
pensamiento.
4. Utilice otro color para la experiencia de otro usuario.
5. Una vez poblado, un paso atrás y reflexionar sobre el contenido. Busque
patrones e inconsistencias. Lo que está en el corazón de esta experiencia? escribir
por estas observaciones y puntos de vista.
6. Desde su discusión, escriba "Ways of ..." declaraciones que puedan sembrar una
lluvia de ideas de ideas
"No es la financiación. Ni la estrategia. Ni la tecnología.
Es el trabajo en equipo que sigue siendo la última ventaja
competitiva , tanto porque es tan poderosa y tan rara ".
Patrick Lencioni
Complethost Ltd.
Contactar
Oficinas Centrales
145-157 Saint John Street
London, EC1V 4PW
United Kingdom
+44(20)33936749 (UK)
Oficina en España
+34(96)0640074 (Spain)+34(96)0640074

Contenu connexe

Similaire à Diseño web-moviles

10 heurísticas de usabilidad para el diseño de.pptx
10 heurísticas de usabilidad para el diseño de.pptx10 heurísticas de usabilidad para el diseño de.pptx
10 heurísticas de usabilidad para el diseño de.pptxRafaelZapata26
 
Pruebas De Usabilidad
Pruebas De UsabilidadPruebas De Usabilidad
Pruebas De Usabilidadguest041f5db
 
Creaacion de apps
Creaacion de appsCreaacion de apps
Creaacion de appsLuisGabba
 
Principios de Usabilidad para Dominar la Red
Principios de Usabilidad para Dominar la RedPrincipios de Usabilidad para Dominar la Red
Principios de Usabilidad para Dominar la RedJose Maria Diaz
 
Las 25 técnicas infalibles para tener un mejor sitio móvil | Google
Las 25 técnicas infalibles para tener un mejor sitio móvil | GoogleLas 25 técnicas infalibles para tener un mejor sitio móvil | Google
Las 25 técnicas infalibles para tener un mejor sitio móvil | GoogleNicolas Valenzuela
 
Consideraciones del usuario en transacciones del comercio electrónico
Consideraciones del usuario en transacciones del comercio electrónicoConsideraciones del usuario en transacciones del comercio electrónico
Consideraciones del usuario en transacciones del comercio electrónicovikingmetallord
 
Clínica de experiencia de usuario para aplicaciones móviles
Clínica de experiencia de usuario para aplicaciones móvilesClínica de experiencia de usuario para aplicaciones móviles
Clínica de experiencia de usuario para aplicaciones móvilesMauricio Angulo
 
Conecta experiencia de usuario
Conecta experiencia de usuarioConecta experiencia de usuario
Conecta experiencia de usuarioconectarc
 
Arquitectura de la información y usabilidad
Arquitectura de la información y usabilidadArquitectura de la información y usabilidad
Arquitectura de la información y usabilidadJesús Tramullas
 
Dia de la usabillidad 2013 - Clínica de UX para apps
Dia de la usabillidad 2013 - Clínica de UX para appsDia de la usabillidad 2013 - Clínica de UX para apps
Dia de la usabillidad 2013 - Clínica de UX para appsMauricio Angulo
 
Usabilidad y Arquitectura de Información, un pretexto para hablar de la satis...
Usabilidad y Arquitectura de Información, un pretexto para hablar de la satis...Usabilidad y Arquitectura de Información, un pretexto para hablar de la satis...
Usabilidad y Arquitectura de Información, un pretexto para hablar de la satis...Alexa Zárrate
 

Similaire à Diseño web-moviles (20)

10 heurísticas de usabilidad para el diseño de.pptx
10 heurísticas de usabilidad para el diseño de.pptx10 heurísticas de usabilidad para el diseño de.pptx
10 heurísticas de usabilidad para el diseño de.pptx
 
Presentacion AticSoft "comercio electrónico". Cámara de Comercio de Castellón
Presentacion AticSoft "comercio electrónico". Cámara de Comercio de CastellónPresentacion AticSoft "comercio electrónico". Cámara de Comercio de Castellón
Presentacion AticSoft "comercio electrónico". Cámara de Comercio de Castellón
 
Usabilidad web
Usabilidad webUsabilidad web
Usabilidad web
 
Pruebas De Usabilidad
Pruebas De UsabilidadPruebas De Usabilidad
Pruebas De Usabilidad
 
Creaacion de apps
Creaacion de appsCreaacion de apps
Creaacion de apps
 
Principios de Usabilidad para Dominar la Red
Principios de Usabilidad para Dominar la RedPrincipios de Usabilidad para Dominar la Red
Principios de Usabilidad para Dominar la Red
 
Las 25 técnicas infalibles para tener un mejor sitio móvil | Google
Las 25 técnicas infalibles para tener un mejor sitio móvil | GoogleLas 25 técnicas infalibles para tener un mejor sitio móvil | Google
Las 25 técnicas infalibles para tener un mejor sitio móvil | Google
 
Pauta en Moviles
Pauta en MovilesPauta en Moviles
Pauta en Moviles
 
Aplicaciones Móviles
Aplicaciones MóvilesAplicaciones Móviles
Aplicaciones Móviles
 
Consideraciones del usuario en transacciones del comercio electrónico
Consideraciones del usuario en transacciones del comercio electrónicoConsideraciones del usuario en transacciones del comercio electrónico
Consideraciones del usuario en transacciones del comercio electrónico
 
Clínica de experiencia de usuario para aplicaciones móviles
Clínica de experiencia de usuario para aplicaciones móvilesClínica de experiencia de usuario para aplicaciones móviles
Clínica de experiencia de usuario para aplicaciones móviles
 
Conecta experiencia de usuario
Conecta experiencia de usuarioConecta experiencia de usuario
Conecta experiencia de usuario
 
Exc Ago07 2
Exc Ago07 2Exc Ago07 2
Exc Ago07 2
 
Curso ucab ntw-agosto2010
Curso ucab ntw-agosto2010Curso ucab ntw-agosto2010
Curso ucab ntw-agosto2010
 
Arquitectura de la información y usabilidad
Arquitectura de la información y usabilidadArquitectura de la información y usabilidad
Arquitectura de la información y usabilidad
 
Dia de la usabillidad 2013 - Clínica de UX para apps
Dia de la usabillidad 2013 - Clínica de UX para appsDia de la usabillidad 2013 - Clínica de UX para apps
Dia de la usabillidad 2013 - Clínica de UX para apps
 
Inter tecno usabilidad
Inter tecno   usabilidadInter tecno   usabilidad
Inter tecno usabilidad
 
Usabilidad y Arquitectura de Información, un pretexto para hablar de la satis...
Usabilidad y Arquitectura de Información, un pretexto para hablar de la satis...Usabilidad y Arquitectura de Información, un pretexto para hablar de la satis...
Usabilidad y Arquitectura de Información, un pretexto para hablar de la satis...
 
Interfaces de usuario
Interfaces de usuarioInterfaces de usuario
Interfaces de usuario
 
Usabilidad web
Usabilidad webUsabilidad web
Usabilidad web
 

Plus de Complethost Soluciones Internet

Configurar exchange active sync en el teléfono o tablet android
Configurar exchange active sync en el teléfono o tablet androidConfigurar exchange active sync en el teléfono o tablet android
Configurar exchange active sync en el teléfono o tablet androidComplethost Soluciones Internet
 

Plus de Complethost Soluciones Internet (20)

Configurar exchange active sync en el teléfono o tablet android
Configurar exchange active sync en el teléfono o tablet androidConfigurar exchange active sync en el teléfono o tablet android
Configurar exchange active sync en el teléfono o tablet android
 
G+ autoría en slide share
G+ autoría en slide shareG+ autoría en slide share
G+ autoría en slide share
 
Diseño web salamanca
Diseño web salamancaDiseño web salamanca
Diseño web salamanca
 
Diseño web santa cruz de tenerife
Diseño web santa cruz de tenerifeDiseño web santa cruz de tenerife
Diseño web santa cruz de tenerife
 
Diseño web segovia
Diseño web segoviaDiseño web segovia
Diseño web segovia
 
Diseño web soria
Diseño web soriaDiseño web soria
Diseño web soria
 
Diseño web tarragona
Diseño web tarragonaDiseño web tarragona
Diseño web tarragona
 
Diseño web teruel
Diseño web teruelDiseño web teruel
Diseño web teruel
 
Diseño web toledo
Diseño web toledoDiseño web toledo
Diseño web toledo
 
Diseño web valencia
Diseño web valenciaDiseño web valencia
Diseño web valencia
 
Diseño web valladolid
Diseño web valladolidDiseño web valladolid
Diseño web valladolid
 
Diseño web vizcaya
Diseño web vizcayaDiseño web vizcaya
Diseño web vizcaya
 
Diseño web zamora
Diseño web zamoraDiseño web zamora
Diseño web zamora
 
Diseño web zaragoza
Diseño web zaragozaDiseño web zaragoza
Diseño web zaragoza
 
Diseño web navarra
Diseño web navarraDiseño web navarra
Diseño web navarra
 
Diseño web murcia
Diseño web murciaDiseño web murcia
Diseño web murcia
 
Diseño web melilla
Diseño web melillaDiseño web melilla
Diseño web melilla
 
Diseño web málaga
Diseño web málagaDiseño web málaga
Diseño web málaga
 
Diseño web madrid
Diseño web madridDiseño web madrid
Diseño web madrid
 
Diseño web lugo
Diseño web lugoDiseño web lugo
Diseño web lugo
 

Dernier

TIPOS DE LINEAS utilizados en dibujo técnico mecánico
TIPOS DE LINEAS utilizados en dibujo técnico mecánicoTIPOS DE LINEAS utilizados en dibujo técnico mecánico
TIPOS DE LINEAS utilizados en dibujo técnico mecánicoWilsonChambi4
 
Brochure Tuna Haus _ Hecho para mascotas.pdf
Brochure Tuna Haus _ Hecho para mascotas.pdfBrochure Tuna Haus _ Hecho para mascotas.pdf
Brochure Tuna Haus _ Hecho para mascotas.pdfhellotunahaus
 
Slaimen Barakat - SLIDESHARE TAREA 2.pdf
Slaimen Barakat - SLIDESHARE TAREA 2.pdfSlaimen Barakat - SLIDESHARE TAREA 2.pdf
Slaimen Barakat - SLIDESHARE TAREA 2.pdfslaimenbarakat
 
PDU - PLAN DE DESARROLLO URBANO DE LA CIUDAD DE CHICLAYO
PDU - PLAN DE DESARROLLO URBANO DE LA CIUDAD DE CHICLAYOPDU - PLAN DE DESARROLLO URBANO DE LA CIUDAD DE CHICLAYO
PDU - PLAN DE DESARROLLO URBANO DE LA CIUDAD DE CHICLAYOManuelBustamante49
 
Torre 222 sobre instalaciones de este mismo edificio
Torre 222 sobre instalaciones de este mismo edificioTorre 222 sobre instalaciones de este mismo edificio
Torre 222 sobre instalaciones de este mismo edificio2021ArqROLDANBERNALD
 
Proceso de percepción visual y de reconocimiento
Proceso de percepción visual y de reconocimientoProceso de percepción visual y de reconocimiento
Proceso de percepción visual y de reconocimientoJorge Fernandez
 
guia de talles de camitas cucciolos 2024.pdf
guia de talles de camitas cucciolos 2024.pdfguia de talles de camitas cucciolos 2024.pdf
guia de talles de camitas cucciolos 2024.pdfcucciolosfabrica
 
Espacios únicos creados por nuestros clientes
Espacios únicos creados por nuestros clientesEspacios únicos creados por nuestros clientes
Espacios únicos creados por nuestros clientesespejosflorida
 
Normas de convivencia para imprimir gratis
Normas de convivencia para imprimir gratisNormas de convivencia para imprimir gratis
Normas de convivencia para imprimir gratisbrasilyamile
 
CERTIFICACIÓN DE CAPACITACIÓN PARA EL CENSO - tfdxwBRz6f3AP7QU.pdf
CERTIFICACIÓN DE CAPACITACIÓN PARA EL CENSO - tfdxwBRz6f3AP7QU.pdfCERTIFICACIÓN DE CAPACITACIÓN PARA EL CENSO - tfdxwBRz6f3AP7QU.pdf
CERTIFICACIÓN DE CAPACITACIÓN PARA EL CENSO - tfdxwBRz6f3AP7QU.pdfasnsdt
 
Presentacion de 100 psicologos dijeron.pptx
Presentacion de 100 psicologos dijeron.pptxPresentacion de 100 psicologos dijeron.pptx
Presentacion de 100 psicologos dijeron.pptxbarbaracantuflr
 
diseño de plantas agroindustriales unidad
diseño de plantas agroindustriales unidaddiseño de plantas agroindustriales unidad
diseño de plantas agroindustriales unidaddabuitragoi
 
Le Corbusier y Mies van der Rohe: Aportes a la Arquitectura Moderna
Le Corbusier y Mies van der Rohe: Aportes a la Arquitectura ModernaLe Corbusier y Mies van der Rohe: Aportes a la Arquitectura Moderna
Le Corbusier y Mies van der Rohe: Aportes a la Arquitectura Modernasofpaolpz
 
Diseño de sifones y alcantarillas para obras hidraulicas
Diseño de sifones y alcantarillas para obras hidraulicasDiseño de sifones y alcantarillas para obras hidraulicas
Diseño de sifones y alcantarillas para obras hidraulicasRiegosVeracruz
 
Presentación Proyecto Vintage Scrapbook Marrón (1).pdf
Presentación Proyecto Vintage Scrapbook Marrón (1).pdfPresentación Proyecto Vintage Scrapbook Marrón (1).pdf
Presentación Proyecto Vintage Scrapbook Marrón (1).pdfAdrianaCarolinaMoral2
 
Jesus Diaz afiche Manierismo .pdf arquitectura
Jesus Diaz afiche Manierismo .pdf arquitecturaJesus Diaz afiche Manierismo .pdf arquitectura
Jesus Diaz afiche Manierismo .pdf arquitecturajesusgrosales12
 
APORTES Y CARACTERISTICAS DE LAS OBRAS DE CORBUSIER. MIES VAN DER ROHE
APORTES Y CARACTERISTICAS DE LAS OBRAS DE  CORBUSIER. MIES VAN DER ROHEAPORTES Y CARACTERISTICAS DE LAS OBRAS DE  CORBUSIER. MIES VAN DER ROHE
APORTES Y CARACTERISTICAS DE LAS OBRAS DE CORBUSIER. MIES VAN DER ROHEgonzalezdfidelibus
 
Arquitectura moderna nazareth bermudez PSM
Arquitectura moderna nazareth bermudez PSMArquitectura moderna nazareth bermudez PSM
Arquitectura moderna nazareth bermudez PSMNaza59
 
Arquitectura Moderna Walter Gropius- Frank Lloyd Wright
Arquitectura Moderna  Walter Gropius- Frank Lloyd WrightArquitectura Moderna  Walter Gropius- Frank Lloyd Wright
Arquitectura Moderna Walter Gropius- Frank Lloyd Wrightimariagsg
 

Dernier (20)

TIPOS DE LINEAS utilizados en dibujo técnico mecánico
TIPOS DE LINEAS utilizados en dibujo técnico mecánicoTIPOS DE LINEAS utilizados en dibujo técnico mecánico
TIPOS DE LINEAS utilizados en dibujo técnico mecánico
 
Brochure Tuna Haus _ Hecho para mascotas.pdf
Brochure Tuna Haus _ Hecho para mascotas.pdfBrochure Tuna Haus _ Hecho para mascotas.pdf
Brochure Tuna Haus _ Hecho para mascotas.pdf
 
Slaimen Barakat - SLIDESHARE TAREA 2.pdf
Slaimen Barakat - SLIDESHARE TAREA 2.pdfSlaimen Barakat - SLIDESHARE TAREA 2.pdf
Slaimen Barakat - SLIDESHARE TAREA 2.pdf
 
PDU - PLAN DE DESARROLLO URBANO DE LA CIUDAD DE CHICLAYO
PDU - PLAN DE DESARROLLO URBANO DE LA CIUDAD DE CHICLAYOPDU - PLAN DE DESARROLLO URBANO DE LA CIUDAD DE CHICLAYO
PDU - PLAN DE DESARROLLO URBANO DE LA CIUDAD DE CHICLAYO
 
Torre 222 sobre instalaciones de este mismo edificio
Torre 222 sobre instalaciones de este mismo edificioTorre 222 sobre instalaciones de este mismo edificio
Torre 222 sobre instalaciones de este mismo edificio
 
Proceso de percepción visual y de reconocimiento
Proceso de percepción visual y de reconocimientoProceso de percepción visual y de reconocimiento
Proceso de percepción visual y de reconocimiento
 
guia de talles de camitas cucciolos 2024.pdf
guia de talles de camitas cucciolos 2024.pdfguia de talles de camitas cucciolos 2024.pdf
guia de talles de camitas cucciolos 2024.pdf
 
Espacios únicos creados por nuestros clientes
Espacios únicos creados por nuestros clientesEspacios únicos creados por nuestros clientes
Espacios únicos creados por nuestros clientes
 
Normas de convivencia para imprimir gratis
Normas de convivencia para imprimir gratisNormas de convivencia para imprimir gratis
Normas de convivencia para imprimir gratis
 
1.La locomoción de los seres vivos diseño
1.La locomoción de los seres vivos diseño1.La locomoción de los seres vivos diseño
1.La locomoción de los seres vivos diseño
 
CERTIFICACIÓN DE CAPACITACIÓN PARA EL CENSO - tfdxwBRz6f3AP7QU.pdf
CERTIFICACIÓN DE CAPACITACIÓN PARA EL CENSO - tfdxwBRz6f3AP7QU.pdfCERTIFICACIÓN DE CAPACITACIÓN PARA EL CENSO - tfdxwBRz6f3AP7QU.pdf
CERTIFICACIÓN DE CAPACITACIÓN PARA EL CENSO - tfdxwBRz6f3AP7QU.pdf
 
Presentacion de 100 psicologos dijeron.pptx
Presentacion de 100 psicologos dijeron.pptxPresentacion de 100 psicologos dijeron.pptx
Presentacion de 100 psicologos dijeron.pptx
 
diseño de plantas agroindustriales unidad
diseño de plantas agroindustriales unidaddiseño de plantas agroindustriales unidad
diseño de plantas agroindustriales unidad
 
Le Corbusier y Mies van der Rohe: Aportes a la Arquitectura Moderna
Le Corbusier y Mies van der Rohe: Aportes a la Arquitectura ModernaLe Corbusier y Mies van der Rohe: Aportes a la Arquitectura Moderna
Le Corbusier y Mies van der Rohe: Aportes a la Arquitectura Moderna
 
Diseño de sifones y alcantarillas para obras hidraulicas
Diseño de sifones y alcantarillas para obras hidraulicasDiseño de sifones y alcantarillas para obras hidraulicas
Diseño de sifones y alcantarillas para obras hidraulicas
 
Presentación Proyecto Vintage Scrapbook Marrón (1).pdf
Presentación Proyecto Vintage Scrapbook Marrón (1).pdfPresentación Proyecto Vintage Scrapbook Marrón (1).pdf
Presentación Proyecto Vintage Scrapbook Marrón (1).pdf
 
Jesus Diaz afiche Manierismo .pdf arquitectura
Jesus Diaz afiche Manierismo .pdf arquitecturaJesus Diaz afiche Manierismo .pdf arquitectura
Jesus Diaz afiche Manierismo .pdf arquitectura
 
APORTES Y CARACTERISTICAS DE LAS OBRAS DE CORBUSIER. MIES VAN DER ROHE
APORTES Y CARACTERISTICAS DE LAS OBRAS DE  CORBUSIER. MIES VAN DER ROHEAPORTES Y CARACTERISTICAS DE LAS OBRAS DE  CORBUSIER. MIES VAN DER ROHE
APORTES Y CARACTERISTICAS DE LAS OBRAS DE CORBUSIER. MIES VAN DER ROHE
 
Arquitectura moderna nazareth bermudez PSM
Arquitectura moderna nazareth bermudez PSMArquitectura moderna nazareth bermudez PSM
Arquitectura moderna nazareth bermudez PSM
 
Arquitectura Moderna Walter Gropius- Frank Lloyd Wright
Arquitectura Moderna  Walter Gropius- Frank Lloyd WrightArquitectura Moderna  Walter Gropius- Frank Lloyd Wright
Arquitectura Moderna Walter Gropius- Frank Lloyd Wright
 

Diseño web-moviles

  • 2. Lo que está por delante Introducción Antecedentes contextuales Exploración 1 - navegación, navegar y buscar Exploración 2 - Diseño de Contenido Exploración 3 - Rendimiento y Entrega La dinámica del equipo
  • 3. ¿A qué están expuestos los usuario de dispositivos móviles?
  • 4. ¿A qué están expuestos los usuario de dispositivos móviles? Nuevas interfaces Mas control Rutas simplificadas Mas información
  • 5. ¿A qué están expuestos los usuario de dispositivos móviles? Nuevos flujos de trabajo Retroalimentación Interacciones mas claras Mas detalles
  • 6. ¿A qué están expuestos los usuario de dispositivos móviles? Múltiples Plataformas Soporte a mano
  • 7. ¿A qué están expuestos los usuario de dispositivos móviles? Mas y mejores ofertas
  • 8. ¿Qué está impulsando este cambio? Logística Factor Impulso Menos escasez Prueba Social Compras libre de riesgo Tecnología del Hardware Tecnología del Software Amplios accesos
  • 9. Consumidores móviles se relacionan una experiencia de calidad para: Fiabilidad y robustez Facilidad de uso / Placer Velocidad de la experiencia Seguridad y confianza
  • 10. Tres Exploraciones Exploración 1 - navegación, navegar y buscar Exploración 2 - Diseño de Contenido Exploración 3 - Rendimiento y Entrega
  • 11. Exploración 1 - navegación, navegar y buscar
  • 12. ¿Cuáles son los desafíos? Volumen de contenido Muchos productos, necesitan categorizar y clasificar para el usuario para navegar a través Accesibilidad rápida Si un usuario sabe lo que él / ella deseos, que esté disponible para el usuario inmediatamente
  • 13. Los usuarios de móviles no son conocidos por su paciencia por lo que necesita para limitar la número de interacciones antes de llegar a las opciones del producto. Limite el número de opciones de menú en cada página Incluso Amazon, con su gran cantidad de opciones de productos, sólo ofrece seis categorías en su página principal. Otro informe publicado en The Journal of Personality and Social Psicología sugiere que las personas tienden a confundirse cuando se presenta con más de seis opciones. Obedezca la regla 44x44 Dar a cada elemento interactivo amplio espaciamiento Que sea nativo Utilizar las transiciones y la eficiencia de interfaz de usuario Navegación Mejores prácticas generales Limite las capas de la navegación 44
  • 14. Navegación: Buenas prácticas sobre iOS Una estructura de navegación jerárquica Vaya al hacer una elección por pantalla En una aplicación jerárquica, los usuarios navegan al hacer una elección por la pantalla hasta que alcanzan su destino. Para desplazarse a otro destino, los usuarios deben volver sobre algunos de sus pasos-o empezar de nuevo desde el principio y tomar decisiones diferentes.
  • 15. Navegación: Buenas prácticas sobre Android Un cajón de navegación Navegue por deslizar desde el borde izquierdo El usuario puede llevar el cajón de navegación en la pantalla deslizando desde el borde izquierdo de la pantalla o tocando el icono de la aplicación en la barra de acción
  • 16. Navegación y exploración Mirada en profundidad Oferta mostrando producto temático o guiada Los clientes que necesitan la inspiración antes de decidir qué tipo de productos para comprar. para ejemplo, los pantalones de verano o los regalos de cumpleaños para los niños de 10 años. Diseñar una página web de fácil lectura óptica que permiten a los usuarios tener una idea por lo que pueden hacer y esperar encontrar en su sitio. El 80% de los usuarios desplazarse arriba y abajo por toda la página cuando se posan sobre una página de inicio o de una lista de categorías, en lo que fue descrito por muchos como "la obtención de una resumen de mis opciones. " Evite subcategoría redundancia y la ambigüedad. Más concretamente, evitar demasiado profundas y poco profundas categorías, jerarquías ilógicas, y desajustes entre las categorías y su contenido.
  • 17. Navegación y exploración Mirada en profundidad Diseñar una página web con facilidad de lectura óptica y que permiten a los usuarios tener una idea de lo que pueden hacer y esperar encontrar en su sitio. Path ojo confuso Altamente gráfica Al desorden visual Demasiados CTAs No jerarquía efectiva
  • 18. 67% de los usuarios móviles búsquedas realizadas en la última semana
  • 19. Búsqueda Mejores Prácticas Mobile es muy locales (40% de acuerdo a Google), centrada y oportuna. Cuatro de cada cinco personas utilizan sus teléfonos inteligentes para buscar información local. Tienen mango búsqueda faltas de ortografía y, más importante aún, sinónimos. Los usuarios tienen poco conocimiento de la jerga y palabras clave específicas de la industria. Un enfoque más sistemático y automatizado sería hacerlo Diccionario máquina de búsquedas de sinónimos y agregarlos como reserva (menor ponderadas) palabras clave en su lógica de búsqueda. Manejar consultas de búsqueda temáticos inteligentemente preferentemente se combina con los resultados de los productos o al menos con enlaces a coincidir listas de categorías temáticas. Ropa de búsqueda es a menudo difícil de usar como nombres de productos son raramente descriptiva sino que utiliza el nombre de modelo del producto. Así que a menos que el usuario conoce el nombre de modelo exacto de la prenda de vestir que quiere, será difícil conseguir una lista de resultados relevantes
  • 20. Buscar: Comportamiento In-store Mejores prácticas Neiman Marcus Esta aplicación proporciona a los clientes la posibilidad de personalizar la "experiencia" en la tienda de compra por marcar cierta artículos, y la conexión con el personal de ventas. Meatpack: Hijack Se utiliza la tecnología GPS para detectar los usuarios de su aplicación cuando estaban en las tiendas de la competencia, antes de enviarlos a un mensaje con un descuento. El importe del descuento actuó como temporizador, así que el cliente tuvo que correr a la tienda. http://vimeo.com/58411219 Amazonas Para realizar la búsqueda de productos aún más fácil, Amazonia aplicaciones móviles tienen un escáner de código de barras que permite a los usuarios encontrar de inmediato los detalles del producto y el costo
  • 21. Exploración 1 Intente un ejercicio Vamos a dibujar algo. Romper en equipos de tres y pasar 15 minutos en una de las siguientes acciones: ¿Cómo se organiza una despensa? ¿Cómo se puede ordenar su ropa? ¿Cómo encontrar un buen restaurante tailandés sin Internet?
  • 22. Exploración 2 Diseño de Contenido
  • 23. Exploración 2 Intente un ejercicio Vamos a dibujar una tira cómica. Romper en nuevos equipos de tres y pasar 15 minutos dibujando una tira cómica. Usted está limitado a la presentación de tan sólo tres paneles. Describir cómo funciona la reforma de salud La historia de Romeo y Julieta ¿Cómo vuela un avión?
  • 24. Retos con diseño de contenidos También hay mucho que decir El usuario no puede consumir todo información y entrega Todo es Importante La pérdida de jerarquía y claridad
  • 25. Diseño de Contenido: Las mejores prácticas integridad estética Desarrollar una integridad estética integridad estética no mide la belleza de una aplicación de ilustraciones o caracterizar su estilo; Más bien, representa cómo así la apariencia y el comportamiento de una aplicación se integra con su funcionar para enviar un mensaje coherente. Es una medida de qué tan bien el aspecto de su aplicación se integra con su función.
  • 26. Diseño de Contenido: Las mejores prácticas Contextuales y conciso Crear contenido conciso y contextual Tenga siempre en cuenta que el contenido para móvil tiene una diferente contexto, el enfoque debe ser adaptado para este particular, medio. Describa sólo lo que el usuario necesita saber. Eliminar la redundancia, como los títulos que reiteran el cuerpo de un cuadro de información. Mantener texto lo más corto posible
  • 27. Diseño de Contenido: Las mejores prácticas Jerarquía Visual Centrarse en la jerarquía visual Contraste Color, creando énfasis visual para crear claro distinciones Forma, diferentes formas tienen diferente peso visual El tamaño, los elementos más grandes requieren más atención que los más pequeños. Continuidad Lines, un móvil muy estándar y fácil de usar elemento de la lista Similitud, Agrupación de elementos similares juntos tiende a crear énfasis y demandar atención Espacio, espacio negativo y el espacio entre elementos no sólo le da a su sala de diseño de respirar, pero también se puede utilizar para crear aplazamiento.
  • 28. Diseño de Contenido: Estudio y Análisis Diseño visual y contenido Claro CTAs Mensajería Conciso Libre de desorden Jerarquía definida
  • 30. ¿Cuáles son los desafíos? Redes y dispositivos Potencia de procesamiento lento y limitado y la mala calidad de la red Experiencia del usuario Sin comentarios, complicados flujos y enlaces inútiles
  • 31. Rendimiento: Mejores prácticas Hardware y limitaciones de los datos La gente espera una experiencia más rápida en el móvil y luego se ponen en el escritorio, pero las redes de conectarlos a su servicio son naturalmente más lento. Como resultado de ello, su aplicación termina la lucha el rendimiento en ambos lados. En estas situaciones, lo que realmente vale la pena ser optimista
  • 32. Rendimiento: Mejores prácticas Percepción del desempeño ¿Cómo la velocidad puede ser una característica de diseño? Su parte de la experiencia básica, que necesita para apoyar el flujo de usuarios. Preforma acciones con optimismo Tiene una interfaz de usuario reactiva, hacer que los elementos responden más rápido a medida que interactúa en la parte posterior. Como botones Añadir al carro. Si se produce un error en la parte de atrás, entonces la interfaz de usuario puede ajustar. Amazon nueva patente para los métodos de envío. Contenidos de forma adaptativa precarga Escuche lo que los usuarios que el usuario está interesado y precargar esa particular elemento en lugar de hacerlo todo a todo el contenido de una sola vez Mover bits cuando está mirando a nadie Cuando se puede anticipar mejor, usted puede tomar el contenido de la etapa 1 y comenzar a utilizar los datos en el momento de su en el paso 3. En el ejemplo, cómo Instagram archivos de imágenes.
  • 33. Exploración 3 Intente un ejercicio Rediseño de una situación a aparecer más rápido Romper en nuevos equipos de tres y pasar 20 minutos diseñar una experiencia a aparecer más rápido. Se puede escribir, dibuja, actuó, o descrita. Reclamación de equipaje Esperando en la cola El crecimiento de un jardín Paseo Ascensor Asegúrese de uno
  • 34. Trabajando Juntos ¿Por qué la mayoría de los equipos fallan? (y cómo se puede evitar que se)
  • 35. Estructura del Equipo Etapas de Tuckman de Desarrollo de Grupos Formación Ideas NormalizaciónRealización
  • 36. Estructura del Equipo Etapa de formación Formación La recopilación de información e impresiones Esta etapa se trata de sentirse quién más está involucrado, el alcance de la tarea, y cómo acercarse a ella. Por lo general carente de conflicto como las opiniones son sigue posicionada como "puntos de discusión" para más tarde. Oportunidades Desarrollar un entendimiento de los objetivos de cada persona / de papel Buscar intereses comunes y hacer nuevos amigos Ver cómo funciona cada miembro del equipo y funciones Capacidad de construir el respeto mutuo entre los roles Desafíos Poca tiende a hacer en este momento debido a la prevención de conflictos Deseo de aceptación / romance de la idea puede simplificar excesivamente las cosas Los miembros del equipo pueden crear actividades independientes / opiniones que pueden trabajar en contra de la imagen más grande si Los miembros del equipo tienden a centrarse en sí mismos Comentarios - redactadas por el "nosotros" y "tal vez" - "Yo hago mi parte. Espero que lo hagas tuyo. " - "No tenemos diferencias".
  • 37. Estructura del Equipo Etapa Ideas Diferentes ideas, que compiten para su consideración Esta etapa puede ser emocional como miembros del equipo comienzan a cruzar caminos en las ideas , perspectivas y maneras de ir sobre la solución de la problema . Puede ser molesto e impulsado por el orgullo. Oportunidades Comunicar las metas de opinión agnóstica del proyecto Desarrollar un entendimiento de los objetivos de cada persona / de papel Analizar la lógica y el razonamiento para identificar puntos comunes Mire el problema con una perspectiva más amplia para limitar pensamiento de grupo Crear un lugar seguro para compartir opiniones y puntos de vista La tensión y la lucha está bien si hay adjudicación imparcial Capacidad de construir el respeto mutuo entre los roles Desafíos Las pandillas y "lados" pueden formar , creando la fragmentación en el grupo Puede ser contencioso, emocional, molesto y frustrante Tendencia a centrarse en las minucias La tolerancia y la paciencia es una necesidad Comentarios - directa y desagradable "Yo estoy haciendo mi parte . ¿Por qué no haces el tuyo ? ""No me gusta sus diferencias. " Ideas
  • 38. Estructura del Equipo Etapa de Normalización Se necesita un plan mutuo para el equipo Esta etapa consiste en encontrar una manera de construir un plan de inversión que todo el mundo puede trabajar hacia. Esto implicará un toma y daca de todos los miembros con el fin de funcionar. Oportunidades Desarrollar la empatía y la apropiación mutua Mantener un foro de debate abierto y aceptado Pinte una imagen de lo que parece el éxito Contar con una estructura debate abierto en torno a temas divisivos Desafíos Puede que algunos no desean renunciar a sus ideas Orgullo / autoridad puede crear la jerarquía insalubres La renuencia a compartir ideas controvertidas La pérdida de confianza o de confianza en sí mismos o unos a otros Comentarios - Obtención de ayuda para conseguir la materia hecha "Estamos haciendo el trabajo. Gracias por la ayuda. ""Trabajamos a través de nuestras diferencias." Normalización
  • 39. Estructura del Equipo Etapa Realización Realización Diferentes ideas que compiten para su consideración Esta etapa considera que los miembros del equipo tan motivado, bien informado, y competente para funcionar de manera autónoma. Aún se espera la disensión, pero hay confianza y respeto mutuos para trabajar productivamente a través de él. Oportunidades Optimizar los procesos de toma de decisiones Abrir, lazos directos y honestos de retroalimentación Desarrollar un mayor nivel de habilidad y maestría Menos de gestión o de supervisión continua La salida de mayor calidad La confianza mutua y el respeto de sus proyectos futuros Tendencia de los miembros para complementar las debilidades de los otros Desafíos Los cambios en los miembros del equipo volverá a la etapa de formación Gestión de tratar de controlar siempre el Grupo de Desarrollo La inseguridad en la forma de "síndrome del impostor" vulnerabilidades personales y cuestiones Comentarios - sobre el trabajo y conseguir que se haga. "Estamos muy impresionante. Vamos a hacer más cosas! ""Nuestras diferencias nos hacen más fuertes."
  • 40. Estructura del Equipo Comentario: La formación Alto grado de orientación necesita de gerente Roles individuales no están claras El proceso no bien establecido Formación
  • 41. La comprensión de cómo el equipo las decisiones se toman El propósito es claro, pero el equipo relationships son borrosas Formación Ideas Alto grado de orientación necesita de gerente Roles individuales no están claras El proceso no bien establecido Estructura del Equipo Comentario: La Idea
  • 42. Estructura del Equipo Comentario: La Normalización Formación Alto grado de orientación necesita de gerente Roles individuales no están claras El proceso no bien establecido La comprensión de cómo el equipo las decisiones se toman El propósito es claro, pero el equipo relationships son borrosas Ideas Las relaciones son así entendida en el equipo Compromiso con la metas del equipo Comienza a trabajar para optimizar proceso de equipo Normalización
  • 43. Estructura del Equipo Comentario: La Realización Formación Alto grado de orientación necesita de gerente Roles individuales no están claras El proceso no bien establecido La comprensión de cómo el equipo las decisiones se toman El propósito es claro, pero el equipo relationships son borrosas Ideas Las relaciones son así entendida en el equipo Compromiso con la metas del equipo Comienza a trabajar para optimizar proceso de equipo El equipo se ha comprometido a un buen desempeño Se centra en su carácter estratégico El equipo funciona bien con poca supervisión Realización Normalización
  • 44. Estructura del Equipo ¿Quiénes son los miembros de un equipo de diseño ?
  • 45. Estructura del Equipo ¿Cómo esta formado un equipo de diseño? Diseñador de interfaz de usuario Conjunto de habilidades • Conocimiento del desarrollo Frontend/nativo • Saber cómo las interacciones e interfaces relacionadas con la tecnología motivación Tiene un profundo interés por las interacciones de contenido, color, tipografía, diseños, y los detalles visuales y textuales más finos de una experiencia. Lo más probable para encontrar la resonancia con • Los diseñadores UX • Gerentes de Producto
  • 46. Estructura del Equipo ¿Cómo esta formado un equipo de diseño? UX Designer Conjunto de habilidades • Algunos dev y experiencia en el diseño de interfaz de usuario • Saber cómo las interacciones e interfaces trabajan juntos como una experiencia motivación Tiene un profundo interés en cómo actúa la gente, pensar y tomar decisiones en Para diseñar una experiencia intuitiva y positivamente utilizable. Lo más probable para encontrar la resonancia con • Gerentes de Producto • Expertos de dominio • Diseñadores de interfaz de usuario
  • 47. Estructura del Equipo ¿Cómo esta formado un equipo de diseño? Conjunto de habilidades • Amplio dominio de la pila completa de tecnologías de desarrollo móvil • Experiencia o apreciación para el diseño UI / UX • Una capacidad de pensar de forma iterativa y en el ámbito de la creación de prototipos motivación Tiene un profundo interés por los detalles técnicos, las relaciones de datos, la lógica de datos, y la comprensión de cómo las diversas tecnologías se interrelacionan. Lo más probable para encontrar la resonancia con • Los diseñadores UX • Gerentes de Producto Ingeniero completa Stack
  • 48. Estructura del Equipo ¿Cómo esta formado un equipo de diseño? Conjunto de habilidades • Un experimentado ex ingeniero o ex-diseñador de ahora el principal producto de la visión estratégica motivación Tiene un profundo interés por una experiencia de usuario sin problemas que cumpla con todos los objetivos, y proporciona tanto una visión cualitativa y cuantitativa para la futura estrategia de producto. Lo más probable para encontrar la resonancia con • Los diseñadores UX • Expertos de dominio Product Manager
  • 49. Estructura del Equipo ¿Cómo esta formado un equipo de diseño? Conjunto de habilidades • la experiencia de campo profundo y conocimiento del espacio de operación • Experiencia en el diseño de la interfaz de usuario de software / UX motivación Tiene una profunda comprensión de cómo se relaciona el trabajo de nuevo a funcionamiento, y lo que se necesitaría para lograr el éxito dentro de la organización. Lo más probable para alinearse con • Gerente de Producto • Diseñador UX Experto en dominios
  • 50. Estructura del Equipo ¿Cómo es el proceso que realiza un equipo de diseño?
  • 51. Estructura del Equipo El proceso de realización de un equipo de diseño Formar adecuadamente Tomar posesión Claro Dirección Comunicarse Los equipos se nutren de la cultura y los valores compartidos • Disfrute de la forma y el período temporal • Definir claramente los roles individuales • Establecer relaciones interpersonales • Definir los límites del proyecto Actividades para ayudar a formar adecuadamente Aprenda más acerca de su personalidad de los miembros de su equipo Construir una cultura de aprecio, retroalimentación, reconocimiento y apoyo Ir en un viaje de retiro o días para obtener a conocer a sus compañeros en una favorable al medio ambiente Hacer un taller de mapeo empatía sobre un tema relacionado a construir una cultura de grupo
  • 52. Estructura del Equipo El proceso de realización de un equipo de diseño Formar adecuadamente Tomar posesión Claro Dirección Comunicarse Los equipos internacionales se apropien • Definir el éxito como un equipo • Definir el éxito como un individuo • Las personas y el equipo son responsables para el producto final • Identificar los objetivos y resultados del equipo • Establecer un proceso de toma inclusiva Actividades para ayudar a tomar posesión Crear un perfil de equipo e identificar lo que falta / podría ser más fuerte Establecer las reglas de su cultura y organizar la forma en que se medirán Dividir diseños de prueba y validar con los usuarios para reducir el debate subjetiva Elegir a un disidente vocal (y cualquier persona) para una tarea de diseño específico y tienen a llevar a cabo un almuerzo y Aprende
  • 53. Estructura del Equipo El proceso de realización de un equipo de diseño Formar adecuadamente Tomar posesión Claro Dirección Comunicarse Todo el mundo se queda hasta al día en tiempo real • Tener articulado individuo cómo contribuirán • Ayudar a sí identifican fortalezas / debilidades con el fin de llenar los vacíos • Crear plazos claros, los hitos y eventos • Alcance de documentación puede ser requerida Actividades para ayudar a una dirección clara Proyecto tarea simple orientado la administración puede ayudar con el enfoque Simplifique diarias monologuitos en curso flujos de comunicación Tener un día de reuniones gratuito para Sprint diseño inalteradas Realice una matriz problema / declaración a replantear el problema y proporcionar una nueva perspectiva
  • 54. Estructura del Equipo El proceso de realización de un equipo de diseño Formar adecuadamente Tomar posesión Claro Dirección Comunicarse Todo el mundo se queda hasta al día en tiempo real • Crear una jerarquía de comunicación • Mantener reuniones / Stand-ups a un horario estricto • Trabajar de lado a lado en donde y cuando sea posible • Evite conversaciones paralelas para que nadie-persona tiene para dar manualmente contexto al equipo • Lea un resumen diario de los avances en días de gran afluencia • Establecer un proceso de adjudicación Actividades para ayudar a comunicar Crear prototipos funcionales y recoger / pista retroalimentación diseño Reúna detallados conocimientos comportamiento de los usuarios en forma de vídeo y rastreado retroalimentación para compartir entre el equipo Utilizar una plataforma de colaboración para debates sobre las cuotas, la investigación y actualizaciones en tiempo real de trabajo del proyecto Teléfono = inmediata IM = menos de una hora = Email para mañana Campfire = sin respuesta necesaria
  • 55. Ejercicio Mapeo de la Empatía una experiencia de usuario Tiempo 10 minutos Materiales Papel grafo, Chinchetas, notas post-it diferentes colores Cómo 1. A gran papel grafo, dibuje la base de la empatía mapa con cuatro cuadrantes:. 1 Say; . 2 Realice; . 3 Piense; 4. Siente. 2. Tenga en cuenta que "decir" y "no" son muy explícitos y "Pensar" y "sentir" están implícitos. 3. Considere la experiencia de un usuario específico y caminar el mapa, escribiendo en notas adhesivas lo que el usuario dijo, hizo, fieltro, o el pensamiento. 4. Utilice otro color para la experiencia de otro usuario. 5. Una vez poblado, un paso atrás y reflexionar sobre el contenido. Busque patrones e inconsistencias. Lo que está en el corazón de esta experiencia? escribir por estas observaciones y puntos de vista. 6. Desde su discusión, escriba "Ways of ..." declaraciones que puedan sembrar una lluvia de ideas de ideas
  • 56. "No es la financiación. Ni la estrategia. Ni la tecnología. Es el trabajo en equipo que sigue siendo la última ventaja competitiva , tanto porque es tan poderosa y tan rara ". Patrick Lencioni
  • 57. Complethost Ltd. Contactar Oficinas Centrales 145-157 Saint John Street London, EC1V 4PW United Kingdom +44(20)33936749 (UK) Oficina en España +34(96)0640074 (Spain)+34(96)0640074