UX Crash Course: 31 Fundamentos

Mi resolución de Año Nuevo para 2014 era llegar a más personas comenzaron en la experiencia del
usuario (UX) Diseño. He publicado una lección cada día en enero, y miles de personas vinieron a
aprender!

A continuación encontrará enlaces a todas las 31 clases diarias.

Principios básicos UX: Cómo empezar

La siguiente lista no es todo lo que se puede aprender en UX. Es una visión general rápida, por lo que
puede ir de cero a héroe lo más rápido posible. Usted recibirá un sabor práctica de todas las grandes
partes de UX, y un sentido de donde usted necesita para aprender más. El orden de las clases sigue un
proceso UX en la vida real (más o menos) para que pueda aplicar estas ideas as-you-go. Cada lección
también se encuentra solo, así que siéntase libre para ellos marcar como referencia!

****

Introducción e ideas clave

# 01 - ¿Qué es UX?

# 02 - Objetivos de usuario y los objetivos de negocio

# 03 - Los 5 ingredientes principales de UX

****

Cómo entender Usuarios

# 04 - ¿Qué es la Investigación usuario?

# 05 - ¿Cómo preguntas a la gente

# 06 - Creación de perfiles de usuario

# 07 - Diseñar para dispositivos

- # 08 Patrones de diseño

****

Arquitectura de la Información

# 09 - ¿Qué es la Arquitectura de la Información?

# 10 - Historias y Tipos de Arquitectura de la información de usuario

# 11 - ¿Qué es un Wireframe?

****
Principios de Diseño Visual

# 12 - Visual Peso, contraste y profundidad

# 13 - Color

# 14 - Repetición y patrón-Breaking

# 15 - Tensión Línea y Borde Tension

# 16 - Alineación y Proximidad

****

Disposición de diseño funcional

# 17 - Z-patrón, el F-Patrón, y la Jerarquía Visual

# 18 - Navegando vs Buscando vs Descubrimiento

# 19 - Marco de Página

# 20 - El pliegue, Imágenes y Noticias

# 21 - El Eje de la Interacción

# 22 - Formularios

N º 23 - Las llamadas a la acción, Instrucciones y Etiquetas

- # 24 botones primarios y secundarios

****

Psicología del usuario

# 25 - Acondicionado

# 26 - Persuasion

# 27 - ¿Cómo experimentan cambios Experiencia

****

Diseñar con datos

# 28 - ¿Qué es Data?

# 29 - Resumen Estadístico

# 30 - Gráfico Shapes

- # 31 Las pruebas A / B
Diario UX Crash Course: # 1 de 31
Mi misión de este mes es conseguir que más diseñadores (o aspirantes a diseñadores) comenzaron en el
diseño de la experiencia del usuario. El mejor lugar para comenzar cualquier tipo de educación es por el
principio:

¿Qué es UX?

Todo tiene una experiencia de usuario. Nuestro trabajo no es crear la experiencia del usuario. Es
nuestro trabajo para que sea bueno.

Y lo que quiero decir con "buena" experiencia de usuario?

Es común pensar que una buena experiencia del usuario es la que hace que los usuarios felices. No es
cierto! Si la felicidad es nuestro único objetivo, podríamos lanzar en algunos Lolcats y aleatorios elogios
y nos vamos a casa. Pero - aunque eso no es lo peor universo me puedo imaginar - su jefe puede no estar
satisfecho con los resultados.

El objetivo de un diseñador UX es hacer que los usuarios efectivos.

La experiencia de un usuario es sólo la punta del iceberg:

Muchas personas piensan erróneamente que "UX" se entiende la experiencia del usuario, pero es
realmente acerca de "hacer" el proceso de Diseño de Experiencia de Usuario.

Experiencia individual de un usuario es su opinión consciente subjetiva de su aplicación o sitio.

Comentarios de los usuarios es importante - a veces - pero los diseñadores UX necesita hacer mucho más
que eso.

"Hacer" UX:

UX Design (también llamado a veces UXD) implica un proceso muy similar a hacer ciencia : hacemos la
investigación para entender los usuarios, desarrollamos ideas para resolver las necesidades de los usuarios
- y las necesidades de la empresa - y que construimos y medimos esas soluciones en el mundo real para
ver si funcionan.

Usted aprenderá acerca de todo eso este mes. O si eso no es su cosa, Lolcats son todavía una opción.
Diario UX Crash Course: # 2 de 31
Al iniciar un nuevo proyecto UX - antes de diseñar cualquier cosa - es necesario entender sus metas. Dos
de ellos, para ser específico. Todo lo que haces se basa en estos dos goles y no hay nada más importante
para su éxito como diseñador UX:

Objetivos y metas de los usuarios empresariales.

(Si te perdiste Lección # 1, es posible que desee leer que uno primero! )

Objetivos de Usuario:

Los usuarios siempre quieren algo, porque son personas, y la gente siempre quiere algo. Ya sea que están
tratando de echar un polvo en un sitio de citas, en busca de estornudos pandas en YouTube, o acecho
antiguos novios en Facebook, quieren algo. También puede ser que desee hacer algo productivo (o eso me
han dicho).

(Vamos a ver los métodos de investigación de usuarios en las próximas lecciones. Por ahora, simplemente
asumimos que sabemos cosas.)

Objetivos de negocio:

Cada organización tiene una razón para la creación de un sitio o aplicación en el primer lugar. Por lo
general se trata de dinero, sino que podría ser la conciencia de marca, o conseguir nuevos miembros para
una comunidad, etc

El tipo específico de objetivo de negocio es importante. Si desea mostrar más anuncios su estrategia UX
será muy diferente que si usted quiere vender productos o promover a través de los medios de
comunicación social.

Estas cosas son a menudo llamados "indicadores" o "KPI" por la gente de negocios y.

Alinear los objetivos:

La verdadera prueba de un diseñador UX es lo bien que se puede alinear los objetivos por lo que los
beneficios para el negocio cuando el usuario llega a su meta. (No al revés!)

YouTube hace dinero a través de anuncios, y los usuarios quieren encontrar buenos videos. Por lo tanto,
poner anuncios en los vídeos (o en la misma página) tiene sentido. Pero más que eso, por lo que es fácil
de buscar videos y encontrar vídeos similares recibirá a los usuarios ver más, lo que hace YouTube más
dinero.

Si las metas no están alineadas a continuación o bien los usuarios pueden conseguir lo que quieren, sin
ayudar a la empresa (muchos usuarios, sin éxito), o los usuarios no consiguen lo que quieren (no usuarios,
sin éxito). Si YouTube te hizo ver 60 segundos de anuncios por cada 30 segundos de vídeos, morirían de
una muerte rápida y dolorosa. No es que nadie tiene tiempo para 'dat. Pero a los pocos segundos de los
anuncios es un pequeño precio a pagar por los dulces, pandas estornudos dulces ...

****
Diario UX Crash Course: # 3 de 31
UX es un proceso, y estas lecciones siguen más o menos ese proceso, pero hay 5 cosas que usted siempre
debe tener en cuenta, en todo el proceso:

Los 5 principales ingredientes de UX:

Psicología, Usabilidad, Diseño, Redacción y Análisis.

(Si acaba de unirse al diario UX Crash Course, es posible que desee comenzar por el principio! )

Cualquiera de estos 5 ingredientes podrían tener un curso acelerado de su cuenta, así que será
simplificar un poco. Este es un curso acelerado, no Wikipedia.

Aunque, para ser justos, estoy bastante seguro de que la página de Wikipedia UX fue escrito por un
hombre que se enteró de UX vez ... esa cosa ... ese tiempo ...

****

1) Psicología

La mente de un usuario es compleja. Usted debe saber, usted tiene uno (supongo). UXers trabajan con los
pensamientos y los sentimientos subjetivos mucho, ya que pueden hacer o deshacer sus resultados. Y el
diseñador debe hacer caso omiso de su propia psicología a veces demasiado, y eso es duro! Pregúntate a ti
mismo:

• ¿Cuál es la motivación del usuario para estar aquí en primer lugar?

• ¿Cómo te hace sentir?
• ¿Cuánto trabajo que el usuario tiene que hacer para conseguir lo que quieren?
• ¿Qué hábitos se crean si hacen esto una y otra vez?
• ¿Qué esperan cuando hagan clic en esto?
• Tiene pensado que ellos saben algo que ellos no han aprendido todavía?
• ¿Es esto algo que quieren hacer de nuevo? ¿Por qué? ¿Con qué frecuencia?
• ¿Está pensando en los deseos y las necesidades del usuario, o en su propio?
• ¿Cómo estás premiando la buena conducta?

****

2) Usabilidad

Si la psicología usuario es mayormente inconsciente, la usabilidad es en su mayoría consciente. Usted

sabe cuando algo es confuso. Hay casos en los que es más divertido si algo es difícil - como un juego -
pero para todo lo demás, queremos que sea tan fácil que hasta un adolescente concursante de Miss
[Link]. podría utilizarlo. Pregúntate a ti mismo:

• ¿Podría usted hacer el trabajo con menos intervención del usuario?

• ¿Hay errores de los usuarios que podría evitar? (Pista: Sí, los hay.)
• ¿Estás siendo claro y directo, o esto es un poco demasiado inteligente?
• ¿Es fácil de encontrar (bueno), difícil de perder (mejor), o inconscientemente esperaba (mejor)?
• ¿Está usted trabajando con los supuestos del usuario, o en contra de ellos?
• ¿Ha proporcionado todo lo que el usuario necesita saber?
• Podría resolver este igual de bien al hacer algo más común?
• ¿Está basando sus decisiones en su propia lógica o categorías, o la intuición del usuario?
¿Cómo lo sabes?
 • Si el usuario no lee la letra pequeña, ¿todavía funciona / tiene sentido?

****

3) Diseño

Como diseñador UX, su definición de "diseño" será mucho menos artística que un montón de
diseñadores. Ya sea que "me gusta" es irrelevante. En UX, el diseño es cómo funciona, y es algo que se
puede probar, no es una cuestión de estilo. Pregúntate a ti mismo:

• ¿Los usuarios piensan que se ve bien? ¿Confían en que de inmediato?

• ¿Comunica el propósito y la función sin palabras?
• ¿Representa la marca? ¿Se siente como todo el mismo sitio?
• ¿El diseño lleva los ojos del usuario a los lugares correctos? ¿Cómo lo sabes?
• ¿Los colores, las formas y la tipografía ayudan a las personas a encontrar lo que quieren y
mejorar la usabilidad de los detalles?
• Hacer las cosas se puede hacer clic se ven diferentes que las cosas no se puede hacer clic?

****

4) Redacción

Hay una enorme diferencia entre la copia de la escritura de la marca (texto) y copia de la escritura UX.
Copia Marca soporta la imagen de la empresa. Copia UX consigue mierda hecha la forma más directa y
sencilla posible. Pregúntate a ti mismo:

• ¿Suena confianza y decirle al usuario qué hacer?

• ¿Se motiva al usuario a completar su objetivo? ¿Es eso lo que queremos?
• Es el texto más grande el texto más importante? ¿Por qué no?
• ¿Se informará al usuario o se asume que ellos ya saben lo que su alrededor?
• ¿Reduce la ansiedad?
• ¿Está claro, directo, sencillo y funcional?

****

5) Análisis

En mi opinión, el punto débil la mayor parte de los diseñadores es el análisis. Pero podemos arreglar eso!
El análisis es lo principal que separa UX de otros tipos de diseño, y eso te hace muy valioso. Es,
literalmente, vale la pena ser bueno en ello. Así, pregúntese:

• ¿Está utilizando los datos para demostrar que tienes razón, o para conocer la verdad?
• ¿Está buscando opiniones personales o hechos objetivos?
• Ha reunido información que le puede dar ese tipo de respuestas?
• ¿Sabes por qué los usuarios hacen eso, o estás interpretando su comportamiento?
• ¿Está buscando a las cifras absolutas o relativas mejoras?
• ¿Cómo va a medir esto? ¿Está midiendo las cosas correctas?
• ¿Está buscando malos resultados también? ¿Por qué no?
• ¿Cómo se puede utilizar este análisis para hacer mejoras?

****

Diario UX Crash Course: # 4 de 31

Ah, los usuarios. El sol en el sistema solar UX y la espina en nuestro lado. Una de las Sagradas Leyes de
UX es "nunca culpar al usuario" a pesar de que - seamos honestos - a veces es jodidamente tentador. Sin
embargo, si usted se siente de esa manera, es porque usted no entiende a sus usuarios, así que hoy vamos
a aprender:

¿Qué es la Investigación usuario?

 
(¿Eres nuevo en el Crash Course UX? Empieza aquí. )

Diferentes personas van a decir que Research usuario pasa en las diferentes etapas del proceso. Algunos
dicen que lo hace primero. Algunos dicen que usted haga algunos dibujos y hacerlo entonces. Algunos
dicen que lo hagas después de construir un producto de trabajo.

Ellos están bien. Nunca es un mal momento para hacer la investigación del usuario. Hazlo temprano,
hacerlo a menudo.

La pregunta importante no es cuándo Es lo que como en:.. ¿Qué estás tratando de aprender acerca de
sus usuarios?

Hay dos tipos principales de información que se puede obtener a partir de una investigación que involucra
a las personas: subjetivos y objetivos.

 
Investigación subjetiva:

La palabra "subjetiva" significa que se trata de una opinión o un recuerdo, o su impresión de algo. La
sensación que te da. Las expectativas que genera. No es un hecho.

• "¿Cuál  es  tu  color  favorito?"    

• "¿Confías  en  esta  empresa?"    
• "¿Mi  culo  grasa  de  la  mirada  de  estos  pantalones?"    

es decir, - No hay una respuesta correcta.

Para obtener información subjetiva que tiene que preguntar a otras personas.

 
Investigación Objetivo:

La palabra "objetivo" significa un hecho. Algo cierto. Algo que usted puede probar. Su opinión no
cambia, no importa lo mucho que lo desee.

• "¿Cuánto  tiempo  pasaste  utilizando  nuestra  aplicación?"    

• "¿Dónde  encontraste  el  enlace  a  nuestro  sitio?"    
• "¿Cuántas  personas  han  visitado  nuestra  página  web  hoy  en  día?"    

Si la gente tuviera recuerdos perfectos y nunca mintieron (sobre todo a ellos mismos) podríamos
preguntar acerca de estas cosas. Si usted encuentra a alguien así, hágamelo saber.
Datos objetivos viene en la forma de mediciones y estadísticas. Pero sólo porque usted puede contar algo
no significa que sea objetiva.

Por ejemplo: Si 102 personas dicen que algo es bueno y 50 personas dicen que es mala, la única
información objetiva que tenemos es el número de personas que votaron. Ya se trate de "bueno" o "malo"
sigue siendo subjetiva.

Con mí hasta ahora?

(Si no, voy a culpar a mí mismo para explicar mal, no por leer mal.)

 
Tamaño de la muestra:

Como regla general, más personas hace que la información más fiable, incluso si es subjetiva. 1 opinión
podría estar completamente equivocado. Si un millón de personas están de acuerdo, es una buena
representación de las creencias de la multitud (pero aún podría ser falsa, objetivamente). Así que recoger
tanta información como sea posible para su investigación.

 
Un montón de información subjetiva pueden llegar a ser ... casi objetiva?!

Si le preguntas a un montón de gente que adivinar la respuesta a algo objetivo - como caramelos en un
frasco - la estimación promedio será a menudo muy cerca de lo real, objetiva, respuesta.

Pero la "sabiduría de la multitud" de algo subjetivo también puede causar disturbios y obtener George W.
Bush eligió, así que ... sí. Ten cuidado.

****

Diario UX Crash Course: # 5 de 31

A menudo en la UX - sobre todo en el comienzo de algo nuevo - que tendrá que obtener información de
la gente real. Así, hoy vamos a aprender:

Cómo pedir Personas Preguntas

 
(Nuevo en el Crash Course UX? Haga clic aquí. )

****

3 tipos básicos de preguntas:

Preguntas abiertas - "¿Cómo me describirías?" - Esto permite una amplia gama de respuestas, y
funciona bien cuando se desea toda la retroalimentación que puede obtener.

Liderando Preguntas - "¿Cuáles son mis características más sexy?" - Esto estrecha las respuestas a un
determinado tipo. Mi ejemplo se supone que tengo algunas cualidades atractivas, que podrían no ser
ciertas Be careful: este tipo de pregunta también excluye respuestas que usted puede ser que desee saber!
/ Las preguntas directas cerradas - "que es más sexy, los codos o las rodillas?" - Este tipo de pregunta
ofrece una opción. Sí o no. Esto o aquello. Pero recuerde: si las opciones son estúpidos, los resultados
serán estúpido.

 
****

Algunos ejemplos de la investigación subjetiva:

Entrevistas - Trae a alguien y pedir que un conjunto de preguntas, una por una.

Observación - dar a la gente las tareas o instrucciones y ver cómo usan su diseño, sin la ayuda Después,
puede hacerles preguntas..

Grupos de Enfoque - Obtener un montón de gente en una habitación juntos y pídales que discutan su
[Link]: Las personas confiadas a menudo persuadir a otros en el grupo, y algunas personas al
azar son un ejemplo poco fiable de nada, y por eso prefiero establecer yo mismo en el fuego de hacer un
grupo de enfoque en la vida real.

Encuestas - un formulario, el cual las personas responden en papel o en línea. Estos realmente pueden
sentirse anónima, que es útil.

Card-Sorting - Cada persona tiene un conjunto de ideas o categorías (sobre cartulinas o post-its), a la que
una especie en grupos que tengan sentido. Después de mucha gente ha hecho esto te da una idea de cómo
su menú debe mirar ProTip:. No utilice sus colegas para esto. Use los usuarios normales.

Google - Es increíble la cantidad de opiniones útil que se puede encontrar en línea, de forma gratuita, en
estos momentos.

****

Importante:

• Haga  las  mismas  preguntas,  de  la  misma  manera,  a  todos.    

• Evite  interpretar  preguntas  o  sugerir  respuestas.    
• La  gente  puede  mentir  para  evitar  la  vergüenza  o  si  parece  que  prefiere  una  
respuesta  en  particular.    
• Tome  notas  o  grabar  la  entrevista.  No  confíe  en  su  memoria,  nunca.    
• No  coma  la  nieve  amarilla.    

Diario UX Crash Course: # 6 de 31

Al igual que los vendedores tienen un público objetivo, UX diseñadores tienen las Personas de usuario /
perfiles: descripciones de los usuarios, basados en la investigación. Pero los nuestros son muy diferentes.
Así que hoy vamos a aprender un poco más acerca de:

Creación de perfiles de usuario

 
(Apenas comenzando el Crash Course UX? Haga clic aquí. )
****

En primer lugar, vamos a concretar lo Personas o perfiles no son:

• Tipos  de  personalidad    

• Demografía    
• Los  personajes  de  su  "historia  de  la  marca"    
• Los  estereotipos  sobre  la  base  de  su  experiencia    
• Shallow  o  1-­‐dimensional    
• Conceptos    
• Predicciones    

****

Entonces, ¿qué es un perfil de persona / usuario?

En él se describen los objetivos, expectativas, motivaciones y comportamientos de las personas reales.

¿Por qué vienen a su sitio? ¿Qué es lo que buscan? ¿Qué los pone nerviosos? Y así sucesivamente.

Toda la información que necesita debe estar en su investigación y los datos. Si no puede realizar copias
de seguridad con la investigación o los datos, sólo estás haciendo mierda y usted debe parar.

****

Mala Perfil: Persona A es una mujer, entre las edades de 35 a 45 con una renta superior a la media y la
educación. Ellos tienen al menos un hijo y poseen por lo menos un vehículo nuevo. Son saliente y con
orientación profesional, y tienden a ser pensadores del hemisferio derecho.

¿Por qué es malo: Eso podría ser grande si usted está vendiendo anuncios, pero en lo que va UX, ese
perfil es básicamente inútil. ¿Por qué? Debido a que no le permite decir "no" a todas las ideas cuentan.
¿Qué tipo de características necesita una mujer entre 35-45? Podría ser cualquier cosa!

****

Perfil útil: Persona A es un administrador con experiencia, en su mayoría interesados en una o dos áreas
de especialización. Ellos visitan a menudo, pero que están presionados por el tiempo, por lo que se
centran en "la recolección de" contenido para leer en los fines de semana. Tienden a ser partícipes de
medios sociales prolíficos, sobre todo a Twitter y LinkedIn. Se consideran líderes pensamiento, imagen
de manera pública es importante.

¿Por qué es útil: Ahora usted tiene una gran cantidad de información para su uso! Usted sabe que el
contenido esponjoso no será popular, auto-comisariado será un gran problema y usted tiene una base para
el establecimiento de categorías de contenido. Necesitan un acceso fácil a compartir, y sólo ciertos tipos
de intercambio social serán relevantes.

También tienes que decir "no" a una campaña en Facebook, debido a que estos usuarios no pierden el
tiempo allí, y digerir los correos electrónicos serán mejores que las notificaciones frecuentes debido a que
estas personas ya están presionados por el tiempo.

****

Piensa en los usuarios "Ideal". Varios de ellos!

Cuando usted piensa acerca de las características, piense en la versión más valiosa de los usuarios que se
ven en la vida real. Usted no está tratando de apoyar el comportamiento actual, que está tratando de
empujar a los usuarios hacia una versión "ideal" de sí mismos.

Asimismo, recuerda que todos los usuarios son iguales! Es probable que tenga un par de diferentes grupos
de comportamiento, y todos ellos merecen un buen perfil.

****

Diario UX Crash Course: # 7 de 31

En el mundo actual, no sólo estamos hablando de un teléfono o un ordenador portátil. Probablemente
estamos hablando de los dos, más una tableta, y, probablemente, los dispositivos "portátiles" como un
smartwatch o Google Glass pronto. Así que hoy vamos a hablar sobre:

Diseñar para dispositivos

 
****

(Sólo unirse al Crash Course UX? Haga clic aquí! )

Paso 1: ¿Cómo se siente al ser tocado con el dedo o el puntero del ratón? Yo no voy a cubrir que en
este artículo, porque ya he escrito este ProTip sobre Touch vs interfaces de Ratón. Debería empezar.

Paso 2: Comience con algo pequeño. Muchas personas piensan "móvil primero" tiene algo que ver con
ser popular móvil. Un poco, pero no mucho: si se quiere diseñar para el dispositivo más pequeño, menos
potente en primer lugar, entonces usted va a centrarse en el contenido y la funcionalidad de su núcleo.
Eso lleva a hermosas aplicaciones simples,. Si lo haces al revés, va a ser como tratar de poner un
malvavisco en una hucha, que no es ni simple, ni hermoso.

Paso 3: ¿Qué poderes especiales tiene este dispositivo Los dispositivos móviles viajan con nosotros así
que - sorpresa - que pasamos más tiempo en ellos y el lugar se convierte en un factor?. Ellos también son
pequeños, por lo que mover el dispositivo en sí puede ser una característica. Laptops, por otro lado, no
viajar así, pero ellos son más poderosos, tienen enormes pantallas y teclados y el ratón permite
selecciones y funciones más precisas. No se preocupe por "coherencia" tanto - diferentes dispositivos
requieren pensamiento diferente a veces.

Paso 4:. Considere el software "Mac vs PC" es más que una campaña linda anuncio. Leer a través de las
directrices UX antes de empezar. También, iOS7 o Windows 8 se ven diferentes de iOS6 o Windows
Vista. Es posible que tenga que elegir qué versiones que apoyará y que va a pasar por alto. Cada vez que
usted apoya uno multiplica el diseño, el desarrollo y el mantenimiento en el futuro. Piense en el futuro!

Paso 5: Sea receptivo ¿Es en la web.? ¿Es compatible con unos pocos tipos diferentes de teléfonos? ¿Y
si Apple hace un nuevo iPhone que es un poco diferente? El internet moderno - si se trata de un sitio web
o una aplicación - funciona en todos los dispositivos, así que asegúrese de suyo puede estirar o adaptarse
a cualquier dispositivo que el usuario decida utilizar.

Paso 6:. Piensa en más de una pantalla a la vez Éste es un poco avanzado, pero creo que ya está listo
para ello. ¿Se puede utilizar el teléfono y el equipo en conjunto, como un control remoto para el televisor?
¿Podría un grupo de teléfonos controlar un juego en una tablilla, en la misma habitación? ¿Qué pasa si
usted está conectado a dos dispositivos, se puede "tirar" los datos de una a la otra? ¿Qué pasa con la
información sincronización; hará que las cuestiones de causa, en tiempo real? Dale un poco de
pensamiento!
****

Diario UX Crash Course: # 8 de 31

Cuando muchos diseñadores tienen el mismo desafío, (por ejemplo - los menús de aplicaciones móviles)
y alguien la resuelve de una manera elegante (por ejemplo - menú oculto de Facebook) y muchos
diseñadores utilizan esta solución, que ayuda a los usuarios a entender los sitios y aplicaciones más
rápido, porque ven la misma solución de una y otra.

Estas soluciones de uso común se denominan:

Patrones de diseño

 
(Si se acaba uniendo el Crash Course UX, comience aquí. )

****

Un diseño no es necesariamente bueno sólo porque es común. Para ser un "buen" modelo de
diseño, una solución debe ser común y utilizable.

Algunas ideas de diseño se convierten en populares porque permiten a los diseñadores de interfaz de
usuario perezosos para ignorar una característica desafiante. Es como poner una bolsa en la cabeza de
alguien porque son feos.

Por ejemplo: de Facebook botón de "hamburguesa" - que representa el menú oculto en muchas de las
aplicaciones móviles - ha empezado a aparecer en los sitios web de gran tamaño que tienen un montón de
espacio para un menú. Es común, ya que oculta el menú es más fácil que el diseño de un buen uno, no
porque los resultados son mejores.

En la vida real, muchos usuarios no se dan cuenta del menú oculto en absoluto, y de retirarse del lugar o
se pierden.

Eso es malo.

Y perezoso.

"No lo hagas, perra." - Jesse Pinkman.

****

Ahora, hay cientos de patrones de diseño y que están cambiando todo el tiempo como los dispositivos y
las tecnologías evolucionan, por lo que no puedo realmente hacer una lista.

Pero aquí hay algunos enlaces para explorar:

1) GoodUI - Una gran lista de ideas simples, ilustradas que son por lo general las cosas buenas que
hacer, o al menos lo intenten, la hora de diseñar.

2) PatternTap . - Una biblioteca de ejemplos enviados por los usuarios de todas las partes de un sitio
web que usted puede ser que necesite Nota: Algunos son buenos, otros son malos, pero mirando a través
de ejemplos sin duda le dará una idea de lo que es común y lo que no es .

3) La Anatomía de una Landing Perfect Page - Este artículo no es muy nuevo, pero todavía sostiene. A
raíz de esto le permitirá crear rápidamente una página genérica, pero eficaz para los usuarios que se
encuentran a través de la búsqueda. es decir, - la primera página la gente ve. Si usted es lovin él, te
recomiendo el blog de Unbounce.

4) Los patrones Mobile - Similar a PatternTap, esto no es una lista de diseños perfectos, pero es una
buena manera de ver un montón de diseños de aplicaciones móviles y tener una idea de lo que es
"común".

5) Timoa en Pinterest - Una colección muy organizado de elementos de interfaz de usuario, ordenados
por la característica.

6) ¿Me he perdido un buen sitio de patrones? Dime en Twitter.

****

Diario UX Crash Course: # 9 de 31

Hasta ahora hemos hablado principalmente las maneras de entender y plan de diseño UX. Hoy,
empezamos realmente hacer mierda. El primer paso para diseñar una solución real es la estructura general
de la cosa. Eso significa que usted va a necesitar una introducción a:

¿Qué es la Arquitectura de la Información?

 
(Si usted está empezando el Crash Course UX: Empiece aquí )

****

Si la idea de la creación de la "estructura" de la "información" es completamente nuevo para usted, esta

presentación puede ayudar a empezar: Comprensión de la información Arquitectura .

Arquitectura de la Información (IA) puede ser relativamente simple, con un proyecto pequeño, e
increíblemente complicado, con un gran proyecto.

IA es invisible. Para trabajar con él, tenemos que dibujar un mapa del sitio. He aquí un ejemplo simple:
En este ejemplo se muestra una página web con 6 páginas: la página principal, 2 secciones en el menú
principal, y 3 subsecciones. Las líneas indican qué páginas están conectados por navegación (menús y
botones).

• Nota:  Un  millón  de  usuarios  no  significa  que  usted  tiene  un  millón  de  
páginas  de  perfil.  Usted  tiene  una  página  de  perfil  que  puede  mostrar  el  
perfil  de  cualquier  usuario.    

Cuando las páginas están organizadas de esta manera - como un árbol genealógico - que se llama una
"jerarquía" o "árbol". La mayoría de los sitios y las aplicaciones están organizados así (pero no es la única
manera).

****

No hay "reglas" para la elaboración de mapas de sitio, pero aquí hay algunas pautas generales:

• El  hecho  de  que  parece  simple,  no  quiere  decir  que  tiene  sentido.    
• Tenga  en  claro  y  legible.    
• Normalmente  sacamos  de  arriba  a  abajo,  no  de  izquierda  a  derecha.    
• No  hacer  un  mapa  del  sitio  "de  lujo".  Es  un  documento  técnico,  no  un  desfile  
de  moda.    

****

Profunda o plana, no ambos.

En términos generales, el mapa del sitio o será muy "plana" - que incluye más artículos en el menú y
requiere menos clics para llegar a la parte inferior - o el mapa del sitio será "profunda" - menús simples,
pero más clics para llegar a donde vas.
Observe que tanto de las estructuras en este ejemplo tienen el mismo número de páginas. Igual, pero
diferente.

Los sitios con una gran cantidad de productos, como Wal-Mart, a menudo necesitan una arquitectura de
profundo, de lo contrario los menús consiguen ridículo. Sitios como YouTube, que sólo tiene usuarios y
videos para hacer frente, suelen ser más "plana".

Si su sitio es profunda y plana, eso es malo. Es posible que desee simplificar sus metas , o el diseño de
una buena búsqueda como una característica central.

****
Mito frecuente: Usted puede escuchar la gente dice que todo debe ser "3 clicks" en todo momento. Eso
significa que aprendieron UX en los años 90 y no han aprendido nada nuevo desde entonces. Centrarse en
el usuario en su lugar. Asegúrese de que entienden dónde están, y dónde pueden ir, en todo momento. Si
la navegación es fácil y clara, el número de clics es irrelevante.

****

Diariamente Curso UX Crash: # 10 de 31

Arquitectura de la información no siempre es fácil de explicar. Sirve de ayuda si usted puede hablar de
ello con su equipo, y pensar en ello fácilmente en su propia cabeza. Así que hoy vamos a aprender acerca
de:

Historias y Tipos de Arquitectura de la información de usuario.

 
(Si usted está empezando el Crash Course UX, Para empezar. )

****

Una historia de usuario describe un camino posible, un usuario puede tener en su sitio o aplicación.
Debe ser breve, pero completa. Usted tendrá muchas historias de usuario para describir todo su diseño.

Una historia de usuario básica para [Link] podría tener este aspecto:

• El  usuario  llega  a  la  página  principal  de  búsqueda.    

• El  usuario  puede  introducir  cualquier  consulta  de  búsqueda  y  presentar  con  el  
ratón  o  el  teclado.    
• La  página  siguiente  muestra  una  lista  de  resultados  de  búsqueda  con  los  
resultados  más  relevantes  en  la  parte  superior.    
• El  usuario  puede  hacer  clic  en  el  enlace  para  ir  al  sitio  adecuado,  o  se  puede  
navegar  a  través  de  varias  páginas  de  resultados  hasta  que  encuentren  algo  
útil.    

Nota: Esto es un poco demasiado simple, pero usted consigue la idea.

Tenga en cuenta que no hay nada en la historia me dice específicamente cómo resolver o diseñar esas
acciones; sólo que son posibles. El propósito de estas historias es describir los flujos. Secuencias de
elección de los usuarios. ¿No es la interfaz de usuario final.

Si los flujos son simples y eficaces, que está haciendo un buen trabajo (hasta ahora).

Los administradores a menudo piensan que los casos de usuario son una manera de ordenar UX del
diseñador, pero eso es absolutamente falso. ¿Por qué? Debido a un caso de usuario es básicamente una
lista de características o funciones, y que tiene un efecto importante en la solución final. El Diseñador UX
escribe historias de usuario para comunicarse con el equipo.

No al revés. Eso sería como decirle a Bob Ross qué colores usar!

(Iba a decir Miguel Ángel allí, pero seamos honestos, yo tomé la decisión correcta.)

****
Ok, así que ahora que usted puede escribir las historias de usuario, tenemos que traer a su Arquitectura de
la Información (IA) de nuevo en esto. La estructura de sus páginas determina los pasos de sus historias de
usuario. Y para estructurar sus páginas usted tiene que elegir un tipo de arquitectura de la información
para trabajar con (o un par de tipos, pero vamos a mantenerlo simple por ahora).

Tipos de IA incluyen:

• Categorías    
• Tareas    
• Búsqueda    
• Tiempo    
• Personas    

Déjeme romperlo abajo para usted (localización del DJ):

Categorías:

Cuando usted piensa en una tienda al por menor como H & M, es probable que imaginar su menú como
un conjunto de categorías: "Hombres, mujeres, niños, venta" y así sucesivamente tipos de contenido.. Al
hacer clic en las categorías que se espera ver el contenido que cabe en esa categoría.

Este es el tipo más común de la Arquitectura de la Información. Sin embargo, si las categorías son
complejos, al igual que los productos bancarios, o productos químicos industriales o juguetes sexuales
(un amigo me dijo), a continuación, usted y sus usuarios que no tenga las mismas expectativas sobre lo
que es en esas categorías, y que puede prestarse a confusión. Si quiero comprar un butt plug, es que en
"pilas de la" o "Glow-in-the-Dark"? La vida está llena de preguntas difíciles.

Tareas:

Otra forma de organizar su sitio o aplicación es por los objetivos de los usuarios necesitan para lograr. Si
usted es un banco, tal vez algo así como "Save, Préstamo, Invest, obtener ayuda, abra una cuenta" haría
un menú sencillo. Si el usuario sabe lo que quiere, esta es una gran manera de estructurar su diseño. Pero
tenga cuidado ... los usuarios no siempre saben lo suficiente como para elegir su propia aventura.

Si lo piensas bien, te darás cuenta de que un sitio basado en tareas y un sitio basado en la categoría para la
misma compañía podría ser muy diferente. Es una elección importante.

Buscar:

Si su sitio es muy complejo, o si es sobre todo lleno de contenido generado por el usuario, de una
arquitectura basada en búsquedas podría tener más sentido, como YouTube. Si sólo tenía YouTube
categorías (divertido, triste, anuncios, películas, etc) en realidad sería difícil de usar, y un montón de
trabajo para mantener las categorías correctas!

Hora:

Si usted apenas está comenzando en UX esto podría volar tu mente un poco: también puede diseñar la
arquitectura de información que cambia con el tiempo. La versión más simple sería su bandeja de entrada,
donde se muestran los mensajes en el orden en que llegaron. Ese es el diseño IA "basado en el tiempo".
En un sitio que tendría páginas para cosas como "de moda ahora, archivado, después, nuevo", etc Reddit
o noticias de Facebook también son un ejemplo de diseño basado en el tiempo.

Gente:

Facebook - o cualquier red social - es Arquitectura de la Información basado en las personas. Todas las
páginas están diseñadas alrededor que la información es sobre, y las relaciones entre ellos. Una vez que
esté en el perfil de alguien, Facebok utiliza categorías (fotos, amigos, lugares) para organizar diferentes
tipos de contenido.

Y probablemente hay muchos otros tipos! Pero este artículo ya se está consiguiendo mucho.

****

Diariamente Curso UX Crash: # 11 de 31

Cuando la mayoría de la gente piensa de UX, que piensan de las líneas-y-cajas diagramas que llamamos
wireframes. Desafortunadamente, muchas personas piensan que hacer wireframes es lo mismo que hacer
UX. Así que hoy vamos a aprender:

¿Qué es un Wireframe?

 
(Si acaba de unirse al Crash Course UX, Empezar aquí. )

****

Si usted ha estado siguiendo el curso acelerado hasta este punto, usted sabe que UX es un iceberg: la parte
que se ve es sólo una pequeña parte del problema.

Antes de empezar, debe leer Lo que no es un Wireframe , sólo en caso de haber dejado algunos malos
hábitos en su propio proceso (o procesos de su empresa).

****
La Idea General:
Un wireframe es un documento técnico, como la de arriba (pero no necesariamente como "bonito" como
esa). Líneas, cajas, etiquetas. Tal vez un color o dos. Eso es todo.

Wireframes son a menudo comparado con los planos ya que tienen un propósito similar.

Un anteproyecto dice constructores cómo ejecutar el plan del arquitecto. No que el papel pintado o
muebles para elegir. Y los planos se toman en serio. Ellos no son una sugerencia, o un "esbozo" o un
"simulacro rápida arriba".

Todos esos bocetos que realice en las pizarras o durante las sesiones de reflexión son valiosos, pero no
son wireframes. Ellos son sus pensamientos sobre los wireframes que usted hará después.

Un wireframe sólo puede tomar una hora para llamar, pero puede tomar semanas o meses para planear. Es
importante que sus colegas y clientes pueden entender eso.

Si un desarrollador o diseñador de interfaz de usuario UI no puede usar el "alambre", sin embargo, no es

una estructura metálica. Se trata de un boceto. Sigue adelante.

****

Eso puede no parecer toda una lección, pero voy a parar allí.

Los próximos 12 lecciones - casi la mitad de este curso - mejorarán tus wireframes haciendo sus diseños
funcionan bien, no sólo se ven bien.

****

Diariamente Curso UX Crash: # 12 de 31

Esta lección es la primera de 5 principios visuales que le ayudarán a dirigir la atención del usuario.
Algunas partes de su diseño son más importantes que otros, pero esos no son siempre las cosas que
notamos de forma natural. Así que tenemos que ayudar a los usuarios notan las cosas importantes. Hoy
vamos a aprender acerca de:

Visual Peso: contraste, profundidad y el tamaño

 
(Si usted está empezando el Crash Course UX, Para empezar. )

La idea del peso visual es bastante intuitivo. Algunas cosas se ven más "pesado" que otros en un diseño. ,
Que hacen referencia más fácilmente. Y esa idea es valiosa como diseñador UX.

Nuestro trabajo es ayudar a los usuarios notan las cosas que importan. Y es igualmente importante no
distraer a los usuarios de sus objetivos.

Mediante la adición de "peso" visual a ciertas partes de su diseño, se aumenta la probabilidad de que un
usuario los vea y se cambia cuando sus ojos irán después.

Recuerde: el peso visual es relativo. Todos los principios visuales son sobre la comparación de un
elemento de diseño a lo que está a su alrededor.
Así, sin más preámbulos, me gustaría presentarles a las estrellas del Curso UX Crash: The Ducks Old-
Timey goma * aplausos aquí *

****

 
Contraste:

La diferencia entre las cosas ligeras y cosas oscuras se llama contraste. Cuanto más diferente que es poco
se compara con una cosa oscura, el "más alto" el contraste.

En UX, se quiere dar cosas importantes contraste más alto, como el pato en el centro. En este caso, la
mayor parte de la imagen es la luz, por lo que un pato oscuro es más notable. Si la imagen es en gran
parte oscuro, el pato más ligero sería más notable.

Si estos fueran los botones, más gente haga clic en el oscuro que si todos los botones del mismo color.

****

 
Profundidad y tamaño:

En el mundo real, nos damos cuenta de las cosas que están cerca de nosotros más que las cosas que están
lejos.

En el mundo digital, las cosas más grandes son percibidos como más cerca, al igual que el pato media
anterior, y algo que es más pequeño se percibe como más lejos (como el pato borrosa en la parte de atrás.)

Si estos patos eran todos del mismo tamaño, probablemente los mira de izquierda a derecha (suponiendo
que usted lee de esa manera).

Si utiliza efectos de desenfoque o sombras que sólo tiene la percepción de la profundidad más realista.
Tamaño tiene este efecto, incluso si su diseño se ve "plano".

Como regla general, usted quiere las cosas más importantes que sean más grandes que las cosas menos
importantes. Esto crea una "jerarquía" visual en la página y hace que sea más fácil de reconocer, pero
también le permite elegir lo que el usuario se da cuenta primero.

Es por eso que está mal "hacer el logo más grande". A menos que desee que los usuarios se quedan
mirando su logotipo en lugar de comprar algo.

***

Diariamente Curso UX Crash: # 13 de 31

La vida real está llena de la luz del sol, la luz artificial, el calor, el frío, la ropa, las marcas, la moda, y un
millón de otras cosas que afectan a la forma en que percibimos los colores. Como diseñador UX es
posible que no se preocupan por Pantones y directrices de la marca, pero definitivamente tenemos que
aprender sobre:

Color.

 
(Si usted está empezando el Crash Course UX, Para empezar. )

 
  
Hay algunas cosas que podemos aprender sobre el color de los 60's-inspirados patitos de goma por
encima.

Como diseñadores UX, que oscila generalmente la wireframes en blanco y negro. Y eso es una buena
cosa! Nos centramos en la función, mientras que los diseñadores de interfaz de usuario puede centrarse en
el estilo.

Sin embargo, a veces de color es función. Como las luces de tráfico o haciendo que el color de una paleta
de acuerdo con el sabor. Ya sabes, importante mierda.

Significado:

En la imagen superior por encima vemos tres patos: azul, amarillo y rojo. Son tan guapo. Inmediatamente
estos patos parecen tener diferente tonalidad, y es fácil imaginar cómo los colores pueden cambiar lo que
cada pato "significa".

Si los patos eran botones, podrían ser: confirmar, anular y eliminar. Si fueran los indicadores en un
depósito de combustible: llena, media, y vacíos. O si estuvieran en una estufa de: frío, caliente, y caliente.

Usted consigue la idea: los patos son idénticos, pero los colores cambian el significado.

Si no es necesario indicar algo así, dejar que el diseñador de la interfaz de usuario a elegir los colores.
Pero si lo hace, deja que tus wireframes que hablen.

Retroceder o Avance:

La otra cosa a tener en cuenta es que los colores pueden ser "fuerte" o "silencioso".

La segunda imagen muestra un pato rojo y dos más azulado. El pato rojo casi parece un poco más, ¿no es
así? No lo es. Algo así como un botón de "comprar" debe tener un color que haga que salta de la pantalla.
Más gente haga clic en un color que "avances" (se adelanta).

Por otro lado, a veces queremos que las cosas un paso atrás para que sean visibles, pero no demasiado
molesto, al igual que los dos patos azulado. Ellos "retroceden" (hundirse). Esto es bueno para algo así
como un menú que siempre está en la pantalla. Si siempre está gritando a ti, eso es innecesario y que le
roba el foco de las cosas más importantes.

Mantenga wireframes simple:

Wireframes coloridos justo en el camino de los detalles funcionales. Utilice los colores en los que
importan, pero no hagas tus wireframes azul como planos, o vestirlos para los clientes. Hace que todos los
debates sobre el color confuso: "No, el sitio web no será azul ..."

Combine Principios visuales!

El color puede trabajar muy bien con la lección acerca de Visual Peso de ayer. Algo grande es notable,
pero algo grande y rojo no se puede perder! Haga sus errores y las etiquetas de advertencia de color rojo y
de alto contraste. O, si usted apenas está confirmando lo que el usuario, algo un poco más pequeño en una
zona verde del retroceso puede ser perfecto.

****

Diariamente Curso UX Crash: # 14 de 31

Un importante principio de diseño visual consiste en la creación de patrones para dirigir los ojos del
usuario a las cosas importantes. Y como todas las buenas reglas, se hacen los patrones para ser rotos. Así
que hoy vamos a aprender el principio visual de:

La repetición y el patrón-Breaking

 
(Si usted está empezando el Crash Course UX, Para empezar. )

 
  
Los patos del período antiguo de goma hacen su regreso triunfal!

Los cerebros humanos tienen un talento especial para los patrones y secuencias. Cada vez que algo en la
naturaleza ocurre una y otra vez, nos daremos cuenta rápidamente. De hecho, no nos limitamos a notar,
que pensamos acerca de las cosas de manera diferente.

La primera imagen muestra cinco patos de goma idénticos en una fila. No vemos cinco patos
individuales, sin embargo, vemos una hilera de patos. Los tratamos como un grupo o una secuencia, y si
usted vive en el mundo occidental, es probable que mirarlos de izquierda a derecha, porque así es como
leemos.

Si esa fila de patos eran un menú o una lista, haríamos lo mismo. Por lo tanto, se podría esperar que más
personas hagan clic en las opciones de la izquierda, y menos a la gente a hacer clic en las opciones a la
derecha.

Romper un patrón:

Los segundos imágenes muestran los mismos 5 patos de goma (guapo, ¿no?) Pero esta vez uno de ellos se
ha ido en solitario. La llamaremos Beyoncé.

Eso lo cambia todo.

Ahora vemos una hilera de cuatro patos (celos), y Beyoncé está solo, en el centro de atención, el lookin
caliente. Es difícil no centrarse en Beyoncé, a pesar de los 5 patos son criaturas igualmente majestuosos.

Ahora, si eso fuera un menú, la opción de media llegaría lejos más clics que antes, porque nuestros ojos
se fijan en él. Además, esos clics se robaron de las opciones de izquierda, por lo que las opciones de la
izquierda sería menos popular que antes (aunque probablemente aún más popular que la opción de la
derecha).

Eso es algo muy poderoso que saber.

Esto puede parecer simple y obvio, pero cuando se aplica ese principio a sus diseños - o sus rutinas de
baile - que puede hacer que la gente nota los botones importantes, opciones, o estrellas del pop.

Tenga cuidado: patrón de ruptura también puede llevar los ojos del usuario lejos de otras cosas
importantes. Antes de que pueda romper un patrón, usted tiene que hacer uno.
Combine sus principios:

Para hacer un patrón o una secuencia, mantenga el peso visual y de color consistente. El ojo usuarios se
iniciará en un extremo y seguir el patrón hasta el otro extremo.

Para romper el patrón, simplemente póngalo en el lugar donde desea agregar el foco. Haga el botón
"Register Now" de un color inesperado, el tamaño, la forma o el estilo, y ver sus clics suben durante la
noche!

****

Diariamente Curso UX Crash: # 15 de 31

Cuando repites algo, como aprendimos ayer, se crea un patrón. Sin embargo, ciertos tipos de repetición
también pueden crear la percepción de "formas", y que los efectos en que los ojos del usuario se pueda.
Así que hoy vamos a aprender sobre:

Tensión Línea y Borde Tension

 
(Si usted está empezando el Crash Course UX, Para empezar. )

 
  
¿Está cansado de los patos todavía? No, no lo creo.

"Tensión" Visual es un concepto que parece muy elemental, pero usted se sorprenderá de lo útil que
puede ser. Nuestro cerebro es un poco demasiado bueno en ver patrones donde no los hay. Como
diseñador puede utilizar eso.

Tensión Línea:

La primera imagen muestra 8 patos en una fila. No vemos 8 patos individuales, vemos una línea. Esa es la
tensión de línea. La percepción de una línea o un "camino" cuando no hay uno.

Nuestros ojos seguirán el camino para ver a dónde va. Súper útil.

Si rompemos ese camino - al igual que cualquier modelo quebrado - la brecha roba más atención.

La tensión del borde:

Hasta ahora hemos supuesto que sólo hay una línea. Pero lo que si creamos la tensión de línea usando
más de una línea?

El resultado puede ser "formas".

En la segunda imagen de arriba, he dispuesto los patos por lo que parecen formar las "esquinas" de una
caja. Se podía ver 12 patos, o cuatro grupos de 3 patos, pero tu mente realmente quiere ver la caja, por lo
que hace.

Además, ahora podemos poner las cosas "dentro" de la caja (como más patos?!), O en los "espacios" entre
las "esquinas". Similar a la línea de tensión, la tensión borde lleva el foco a las lagunas.

-Layout sabio, esto puede ser una excelente manera de poner más énfasis en algo pequeño, como una
etiqueta. O bien, puede crear rutas visuales que conducen al botón que desea la gente haga clic. Anuncios
vintage utilizan esta técnica a menudo.
Y convenientemente, tiene un diseño de sentirse "más simple" y "más cohesionada", porque un camino o
un cuadro es sólo una cosa mental, pero 12 patos por separado es demasiado impresionante para manejar.

Combine sus principios:

En esta lección me quedan los huecos "de tensión" en blanco, pero usted no tiene que hacerlo. También
puede usar el color para crear un camino como un gradiente en una lista de elementos . O puede agregar
el peso visual de un grupo de elementos, tratándolos como una forma en lugar de piezas separadas. Es una
gran manera de dirigir los ojos del usuario, sin añadir más "cosas" a un diseño!

****

Diariamente Curso UX Crash: # 16 de 31

El último principio de diseño vamos a aprender es acerca de cómo agregar el orden y significado a los
elementos de su diseño, sin añadir más elementos. Sonidos sutil, pero que los efectos de todo lo que ves,
todos los días:

Alineación y Proximidad

 
(Si usted está empezando el Crash Course UX, Start Here .)

 
  
Hoy decimos adiós a los patos del período antiguo de goma, pero primero vamos a demostrar dos
de los principios más fundamentales de la percepción visual. Los patos no son caras simplemente
bonitos!

****

Alineación:

En la primera imagen de arriba vemos un grupo de 6 patos increíblemente guapos, pero también vemos
una gran cantidad de relaciones, debido a la forma en que están alineados:

• Vemos  dos  filas.    

• Los  patos  de  la  extrema  izquierda  y  la  extrema  derecha  parecen  estar  
"separados".    
• Los  dos  patos  del  centro  parecen  ser  los  más  "organizado".    
• Todos  los  patos  parecen  ir  en  la  misma  dirección.    
• Si  usted  ve  el  movimiento,  el  pato  de  la  izquierda  podría  ser  "quedando  atrás".    
• Si  usted  ve  el  movimiento,  el  pato  a  la  derecha  podría  ser  "liderando".    

Esos 6 patos son idénticos. Sólo la alineación crea estas percepciones.

Botones con funciones similares se pueden alinear. Los diferentes niveles de contenido pueden ser
alineados. La información puede estar en una cuadrícula de filas y columnas como una hoja de cálculo
para crear un significado complejo.

****

Proximidad:

La cercanía o la distancia entre dos objetos, crea una sensación de esos objetos estar relacionado o no
relacionado. Esa distancia se llama "proximidad".
En la segunda imagen se ve 6 patos idénticos que no están alineados horizontalmente o verticalmente,
pero definitivamente ve a dos grupos. Los patos en cada grupo parecen "juntos" como un equipo o una
familia. La única cosa que la creación de esa percepción es su proximidad.

En sus diseños, poner elementos relacionados entre sí y los elementos no relacionados más separados.

Por ejemplo: un titular, un bloque de texto y un botón que se relacionan con una sola acción - como una
compra o un descarga de la aplicación - se diseñan generalmente como un "paquete". Eso permite que el
usuario entienda que van de la mano sin necesidad de leer nada.

****

Diariamente Curso UX Crash: # 17 de 31

Es fácil imaginar a todos los usuarios con entusiasmo la lectura de todas las cartas que usted escribe y
cada píxel que realice. Terminemos con eso, ya que los usuarios reales no hacen eso. Ellos buscan.
Escaneo significa que sólo se detienen a leer cuando algo llama su atención. Así que hoy vamos a
aprender acerca de los patrones de escaneo:

Z-patrón, el F-Patrón, y la Jerarquía Visual

 
(Si usted está empezando el Crash Course UX, Para empezar. )

****

El uso de un sitio web o una aplicación puede sentir como una experiencia distinta cada vez, pero en
realidad, la forma de mirar a cualquier diseño es bastante predecible ...

El Z-patrón:

Vamos a empezar con el diseño más aburrido que puedo imaginar: una página de periódico entera de
texto sólido. Toda una historia. No hay noticias. No hay imágenes. No hay pausas o las cotizaciones de
extracción. Sólo texto, en las columnas, incluso, de esquina a esquina.
En un diseño de esa manera - que espero que nunca crear - los usuarios en general, escanearlo en un
patrón de algo parecido a la "Z" que se muestra arriba.

! Boring Zzzzzzzz .... (Ver lo que hice allí?)

La razón por la que pasó los últimos cinco días enseñando los principios del diseño visual es lo que se
sabe cómo se puede hacer de este diseño mejor.

¡Ajá!

Si añadimos un titular más grande (peso visual), cree una columna a seguir (tensión de línea), y el uso de
secciones más pequeñas (repetición) podemos hacer que la gente más cerca de la famosa F-Patrón.

La imagen de arriba muestra colorida de seguimiento de los ojos los resultados, que se llama "mapas de
calor". Registros de seguimiento de los ojos, donde se ven personas, cuanto más tiempo se ven en algo,
más "caliente" que se ve en el mapa de calor.

Diseños similares = resultados similares.

El patrón F hizo que los fundadores del Grupo Nielsen Norman famosa hace un tiempo. Y aunque no han
hecho ningún trabajo de "gran avance" en mucho tiempo, todavía publican numerosos informes vale la
pena leer .

El patrón F funciona así:

• Comience  en  la  esquina  superior  izquierda,  como  el  Z-­‐patrón.    

• Leer  /  escanear  la  primera  (cabeza)  de  la  línea  del  texto.    
• Escanear  por  el  lado  izquierdo  de  la  columna  hasta  que  encuentres  algo  
interesante.    
• Lea  lo  interesante  con  más  cuidado.    
• Continuar  escanear  hacia  abajo.    

Mediante la repetición de este método una y otra vez, el mapa de calor empieza a parecerse a una "E" o
"F", de ahí el nombre.

****

¿Por qué es esto importante?

Usted puede notar que algunas partes de la página reciben mucha atención "de forma natural", mientras
que otras partes de la página se pasan por alto la mayor parte del tiempo. Esto es lo que entendemos por
manchas y "fuertes" "débiles" en un diseño.
Un botón en la parte superior izquierda obtendrá más clics que un botón en la parte superior derecha,
que obtendrá más clics de un botón en la parte inferior izquierda, que obtendrá más clics que un botón en
la parte inferior derecha. Y todos los que obtendrá más clics que algo pegado al azar en el medio ... a
menos que hagas algo al respecto.

También podría ser bueno saber que cada "bloque" de contenido y cada columna puede tener su propio F-
patrón. No tiene que ser de un solo F-patrón por página, pero eso es una conversación más avanzados
para otro día.

****

Visual Jerarquía:

Cuando se utiliza sistemáticamente la tipografía para indicar la importancia del texto, y de ciertos colores
para resaltar los botones, y cuando le dará más peso visual a las cosas que importan, crea una jerarquía
visual es decir -. Un diseño que la gente puede escanear fácilmente. Nuestros ojos saltan de lo importante
a lo importante en vez de escanear como un robot.

Algunos diseñadores piensan jerarquía visual es bueno porque se ve mejor, pero la verdad es que se siente
mejor porque es más fácil de analizar.

****

¿Quieres ver otros tipos de resultados de seguimiento de los ojos? Echa un vistazo a mi tabla Eye
Tracking en Pinterest!

****

Diariamente Curso UX Crash: # 18 de 31

Diferentes personas utilizan sitios y aplicaciones por diferentes razones. Si se diseña para el mal
comportamiento, no obtendrá los resultados que desea. Hoy vamos a aprender acerca de:

Browsing vs Buscando vs Descubrimiento

 
(Si usted está empezando el Crash Course UX, Para empezar. )

****

Las palabras de arriba puede significar una variedad de cosas en el mundo real, así que para los
propósitos de esta lección:

La navegación es cuando vas a Ikea a mirar todas las habitaciones modelo "sólo para obtener ideas" y
usted sale con un montón de basura al azar de todos modos.

La búsqueda es cuando vas a Ikea en busca de un nuevo sofá que se ajuste en su pequeño apartamento
absurdamente.

El descubrimiento es cuando usted encuentra el sofá que está buscando, y también comprar los ocurrente-
mesas finales anidada porque son tan condenadamente inteligente y jerarquizado. Como si esas son las
cosas que necesita en su vida.

****
Browsing:

Cuando usted visita una tienda en línea sólo porque sus productos se ven bien o porque usted está
siguiendo las tendencias, o porque usted está soñando con el día en que su vida finalmente se completará
con un bolso de $ 2000, que está navegando.

Un usuario de exploración será vista de forma rápida en la mayoría de las imágenes, una por una,
comenzando en la parte superior izquierda. Podrían pasar por alto algunos, pero eso está bien. Las fotos
que el usuario encuentre atractiva recibirán una atención especial (tal vez incluso un clic!).

Diseñar para la navegación: hacer el escaneo fácil y mantener el contenido de forma rápida y visual. No
llene la página con demasiada mierda. Centrarse en los aspectos de los productos que crean atractivo
emocional. Si ese es el estilo, se centran en las fotos. Si ese es el poder (como motores de los barcos o
pistolas) a continuación, proporcionar esa información como las etiquetas claras. Si ese es marcas,
muestran claramente los logos. Si se trata de la artesanía, amplíe los detalles artesanales. Y así
sucesivamente.

****

Búsqueda:

Cuando alguien está tratando de encontrar algo que tienen en mente, puede parecer similar a la
navegación, pero los estudios de seguimiento ocular mostrar un comportamiento muy diferente: están
cazando.

Un usuario que busque ignorará una gran cantidad de productos o imágenes. Organización en su diseño le
ayudará a trabajar de manera sistemática a través de las opciones, que no quieren perderse nada!

Un diseño de estilo Pinterest funciona en contra de ellos porque es "escalonada" y al azar. Pero ser capaz
de "filtrar" las opciones a menudo es útil.

Diseñar para la búsqueda: Enfoque en los atributos. Si quieren una novia rusa con el pelo castaño y
ojos azules, van a parar en cada foto que tiene esos atributos, pero las rubias sólo se consigue de la
manera.

Resalte los atributos que son más propensos a ser "crítico" para la mayoría de los usuarios, y nada más.
No haga caso de cualquier idea que pueda tener acerca de lo que parece "desordenado" ... si la
información es útil, no es "el desorden". Esto no es una galería de arte.

Cuando el usuario encuentra lo que quieren, van a hacer clic para obtener más información (o comprar).
El nombre de una novia rusa, fotos, y las opiniones acerca de los hombres espeluznantes mayores podrían
ser los principales puntos de interés, pero su número de calzado e intenso amor de galletas ... no tanto.

****

Descubrimiento:

Ok, así que vamos a decir que los usuarios no están encontrando su increíble selección de kazoos
antiguos, pero crees que comprarían si lo hacían. ¿Cómo se crea descubrimiento?

La forma de pensar la gente a descubrir nuevas cosas es probablemente lo contrario de cómo las personas
descubren cosas nuevas. Bienvenidos al loco mundo de UX.

Hay dos errores que probablemente se harán:

1) Se le puso en el menú principal, o crear "banners" en su propio sitio promoverlo.

2) Se espera que sus usuarios más fieles para encontrarlo primero, debido a que pasan más tiempo con su
diseño actual.

Ambas cosas están mal.

# 1: Los usuarios sólo click cosas en el menú si están buscando esas cosas. Tan simple como eso. Casi
nadie "descubre" a través del menú. Y banners no funcionan porque banners nunca funcionan. ¿Nunca
has utilizado Internet antes? ¿Por qué la gente de repente emocionarse banners ahora?

# 2: Cuanto más experimentado un usuario es, menos que exploran nuevas cosas. En la vida real, sólo los
principiantes explorar sitios o aplicaciones para averiguar lo que puede hacer. Los usuarios
experimentados saben lo que quieren y saben cómo conseguirlo, así que ¿por qué iban explorar?

"Si te gustó eso, te va a encantar esto ..."

En lugar de depender de los usuarios para encontrar cosas nuevas, vamos a encontrar lo que ya lo están
buscando. Ponga las cosas nuevas allí también (y que sea relevante), para que puedan "descubrir" la
misma. Esto puede sentirse como si estuviera ocultando, pero en realidad lo estás haciendo tan visibles
como sea posible a las personas adecuadas.

En un sitio como Reddit, la gente viene por el contenido con más votos - no nuevas presentaciones. Pero
si nadie vota sobre nuevas comunicaciones, no habrá ningún contenido con más votos! Así Reddit pone
algunas nuevas presentaciones - de las categorías que te gustan - en el contenido de la parte superior para
que sean visibles, obtener votos, y empezar el círculo de la vida una vez más.

****

Cuanto más entienda sus usuarios, más se sabrá lo que debe diseñar para. Haga su maldita investigación!

****

Diariamente Curso UX Crash: # 19 de 31

Ahora que ha establecido sus metas, investigó sus usuarios, y planeó su arquitectura de la información, es
el momento de poner esos planes en acción, baby! Así que hoy vamos a aprender sobre:

Marco de Página
(Navegación, pies de página, etc)

 
(Si usted está recién empezando el Crash Course UX, Para empezar. )

****

Aunque podría ser tentador para acercarse a sus wireframes en una base de página por página, no
lo hagas! Este es uno de esos "medir dos veces y cortar una vez" tipo de cosas.

Como regla general, usted debe hacer su wireframes como haces tus tatuajes: comenzar con las grandes
piezas y añadir detalles a medida que avanza.

En este caso, las piezas grandes son los elementos que aparecerán en todas las páginas de navegación y
pies de página.

****
Pie de página:

A pie de página es típicamente una lista de enlaces estáticos que son demasiado generales y demasiado
insignificante como para conseguir un lugar en la navegación principal. Algunos sitios tienen realmente
muy bonitos diseños de pie de página, que es grande, pero si los usuarios necesitan estos enlaces para
hacer el trabajo en el sitio, el pie de página es el lugar equivocado para ellos.

Pregúntate a ti mismo: "¿Va a haber páginas que tienen un scroll infinito?" Si la respuesta es sí,
asegúrese de que todo en el pie de página está disponible en algún otro lugar. Si el selector de idioma está
en el pie de página y se escapa cada vez que trato de cambiarlo, vete a la mierda.

****

Navegación:

Los menús se presentan en al menos dos sabores: menú principal y el menú secundario.

Menú principal: Si usted hizo su arquitectura de la información correctamente, entonces usted ya sabe lo
que debe ser en el menú principal. Es el primer nivel de los vínculos en el mapa del sitio (por debajo de la
página principal).

El orden de los elementos del menú - de izquierda a derecha o de arriba a abajo - debe ser de más a menos
populares (medido por el interés de los usuarios, y no por lo mucho que los quiere).

Si este es un nuevo menú acaba de hacer su mejor suposición, y decirle a los desarrolladores que quieren
que sea fácil volver a pedir más tarde. Cuando usted consigue un poco de tráfico real a su sitio, asegúrese
de que su orden y el partido de popularidad real. Si no lo hacen, arreglarlo.

Sub-Menú: El sub-menú es una lista de las páginas de "abajo" lo que la página que el usuario está
activada, en el mapa del sitio. Usted no hace un mapa del sitio, ¿no?! Ufff. Bueno. Me habías asustado
por un segundo.

Lo principal con el menú secundario es que debería ser, idealmente, en el mismo lugar en cada página,
incluso si los enlaces cambian todo el tiempo. Que manera los usuarios aprenderán rápidamente dónde
encontrarlo.

Submenús Enormes nunca son una buena idea:

Siempre me sorprendo cuando alguien trata de argumentar que su mega-menú es la mejor idea disponible.
Que en realidad significa que la arquitectura de la información (y el arquitecto de información) es una
mierda.

Todo-en-uno-menú es el diseño más perezoso del universo. Hacerlo mejor.

Los menús son como las citas: si necesita más de 7 u 8 opciones, es el momento de romper el corazón de
alguien. Tal vez el suyo propio.

****

tl; dr

Crear la navegación y pies de página que trabajan para todas las páginas / pantallas en su aplicación antes
de entrar en el contenido. Usted me agradecerá más tarde.

****
Diariamente Curso UX Crash: # 20 de 31
Hay muchas preguntas comunes sobre diseño UX que se llega a través de su carrera. Y algunos que usted
debe conseguir, a pesar de que no lo hará. Así que hoy vamos a aprender algunas cosas sobre:

El pliegue, Imágenes y Titulares

 
(Si usted está empezando el Crash Course UX: Empieza aquí. )

****

The Fold:

Uno de los errores de la vieja escuela más populares es el de "The Fold", que - en caso de que usted
nunca ha oído hablar de ella - es la parte de su diseño que es visible antes el usuario se desplaza.

Todo sobre el doblez conseguirá la máxima visibilidad. Sin embargo, a partir de los estudios que he visto,
se puede esperar un 60-80% de los usuarios para desplazarse si esperan encontrar algo útil por debajo del
pliegue.

Lo que está encima de la tapa debe informar a los usuarios sobre lo que está debajo de la tapa. Si el
usuario de no sé lo que está ahí abajo, que podría no ser lo suficientemente interesado como para
averiguarlo.

Atención: Es popular en este momento para utilizar grandes imágenes de fondo en la parte superior de la
página. Si parece que el sitio termina en el pliegue, la gente podría salir en lugar de desplazarse. Y si es
necesario agregar un gráfico que dice "scroll down" de su diseño es débil.

Obtenga más información acerca de The Fold Aquí.

****

Imágenes:

Muchos diseñadores UX tratan a las imágenes como si ellos no son funcionales, pero las imágenes
pueden llevar los ojos del usuario, por lo que deben pensar en ellos.

Las imágenes de personas, en concreto, llamar más la atención que cualquier otra cosa que usted puede
utilizar en su diseño.

Como norma general, cuanto más la emoción de una imagen, añade, el más atractivo es.

Protip: Para las imágenes de la gente, tratar de conseguir los ojos de la persona en la imagen para mirar
en la dirección que usted desea que el usuario vea. Es sorprendente la cantidad de diferencia que hace.
Ambos heatmaps anteriores muestran la misma disposición. Uno tiene el bebé que mira el título, el otro
tiene el bebé que mira al lector.

El resultado de las dos imágenes muestran que los usuarios se centraron en la cara del bebé mucho, pero
sólo la segunda imagen tiene un montón de atención en el contenido del texto, foto del producto, y el
logotipo.
¿Qué imagen te quedarías?

****

Titulares:

Aparte de fotografías de personas, nuestros ojos son más atraídas por el mayor, pieza de más alto
contraste del texto en un trazado. Así que cuando se agrega un gran titular a su diseño, que acabas de
elegir donde la gente va a empezar a escanear.

Por lo tanto, es importante que su titular está alineado con el contenido más importante por debajo de ella.
Si ese contenido no es muy importante, se le dibuja demasiada atención a ella (y lejos de otros
contenidos.) Si no está alineado, los usuarios buscar un nuevo punto de enfoque después de leer el titular.

****

tl; dr

• Dar  a  la  gente  algo  en  qué  concentrarse  antes  de  desplazarse.    
• Que  sea  evidente  que  pueden  desplazarse.    
• Seleccione  las  imágenes  que  añaden  emoción  y  dirigen  los  ojos  del  usuario.    
• Utilice  títulos  para  dirigir  a  los  usuarios  a  lo  que  más  importa.    

****

Diariamente Curso UX Crash: # 21 de 31

Una de las preguntas más comunes en el diseño de UX es: "¿Debería el botón a la izquierda o la derecha"
Bueno, depende, en realidad. Depende de donde usted ha creado "bordes" visuales. Así que hoy vamos a
aprender sobre:

El Eje de la Interacción

 
(Si usted está empezando el Crash Course UX: Empieza aquí. )
  
 
Esta idea es engañosamente simple.

La atención humana es muy limitada. Sólo podemos centrarse en una cosa a la vez, como una ardilla o
tetas o Dinastía Duck. Así que, mientras nos estamos enfocando en un trozo de contenido, los otros trozos
de contenido se convierten efectivamente invisible.

¿No me creen? Añada a.

****

Encuentre los bordes:

En cada diseño, que va a utilizar los principios visuales que ha aprendido en este curso. Cuando das un
paso atrás y mirar a su disposición, usted se dará cuenta de que ha creado "líneas" o "bordes" o "bloques"
en todas partes.

Puede ser que sean el borde alineado del texto o las imágenes, o grupos de cosas en una fila.

Cada uno de los bordes es un eje de Interacción. Sus ojos seguirán un eje hasta que se interrumpe, o hasta
que termine.

La atención del usuario es casi siempre se centró en un eje de interacción, y cuando deja de centrarse allí,
saltará a la siguiente Eje de Interacción.

****

Por lo tanto:

Si quieres que la gente haga clic en algo, ponerlo en (o cerca de) un eje de Interacción. Si usted no quiere
que haga clic en él, lo puso en otro lugar.
Cuanto más un elemento es del Eje, menos personas lo verán y, si no ve algo, no pueden hacer clic en él.

Eso es todo!

****

Diariamente Curso UX Crash: # 22 de 31

A medida que trabaja a través de sus diseños, es sólo cuestión de tiempo hasta que usted tiene que diseñar
una forma para que los usuarios le dan información. Así que hoy vamos a hacer un recorrido torbellino
de:

Formularios.

 
(Si usted está empezando el Crash Course UX: Empieza aquí. )

****

Los formularios son uno de los lugares que pasan mucho de su tiempo,-usabilidad sabio. Causan
confusión, errores, y la pérdida de compromiso, y son una de las partes más valiosas de su sitio.

Si ellos no son una de las partes más valiosas de su diseño, ¿por qué estás usando un formulario? ¿He
mencionado que causan confusión, errores, y la pérdida de compromiso?

****

Una Página larga o unos pocos a corto Pages?

La pregunta más común con las formas - desde diseñadores UX y comerciantes por igual - es "cuánto
tiempo es demasiado largo?"

Es una buena regla general para mantener las formas lo más corto posible, pero no tenga miedo de
romperla en las páginas si tiene sentido o si desea guardar la información en los pasos, por si el usuario
sale de en medio.

Lo principal es hacer de una forma sencilla sentir. Mantenga las preguntas relacionadas. Se eliminan las
preguntas que realmente no necesita. Y el uso de tantas páginas como necesite; ni más, ni menos.

****

Tipos de entrada

El propósito de una forma es conseguir la entrada. es decir, - la información del usuario. Y hay un
número de maneras que usted puede recogerlo. Si usted utiliza un campo de texto estándar o un slider
súper personalizada, debe seleccionar el tipo de entrada que le da las mayores respuestas de calidad.

• Hay  una  lista  de  los  tipos  de  entrada  estándar  está  aquí.    
• Una  lista  de  los  nuevos  tipos  de  entrada  de  lujo  HTML5  está  aquí.    
• Una  lista  de  las  diferentes  razas  de  cabras  está  aquí.    

Por ejemplo, digamos que usted desea que el usuario escoja su tipo favorito de cabra. Casillas de
verificación y botones de opción son las dos maneras de dejar al usuario elegir entre una lista de
opciones. Sin embargo, las casillas de verificación permiten escoger más de una opción, pero los botones
de radio sólo permiten una selección.

Si desea una respuesta más completa, use las casillas de verificación. Si desea una respuesta más
selectiva, botones de radio podrían ser su cosa.

****

Etiquetas y Instrucciones

Vamos a hablar de realmente escribir etiquetas e instrucciones de mañana. Por ahora, vamos a hablar de
la función de las etiquetas.

Cuando estás identificar las entradas - ¿de qué otra será el usuario sabe qué hacer con ellos? - Ser breve,
clara, legible, y los puso cerca de la entrada que se están etiquetando. En el gran esquema de las cosas,
que va a resolver el 99% de los problemas de etiquetado.

A veces se necesitan instrucciones si la pregunta no es convencional o complicado. En ese caso, puede ser
útil para añadir un poco de explicación. Si se trata de sólo unas pocas palabras, lo puso cerca de la
etiqueta y la entrada. Si es más que unas pocas palabras, lo puso en la parte de la forma en lugar de
dentro de ella, para que no se interrumpa el flujo de los usuarios que saben lo que están haciendo.

Le recomiendo el libro de formularios Web Design , por Lucas W.

****

Prevención y Manejo de Errores

Cuando se trata de formas, error suceda. Es nuestro trabajo para evitar el mayor número posible, y
manejar el resto con tanta gracia como sea posible.

Puede evitar errores añadiendo un poco de inteligencia a las entradas. Por ejemplo, si un campo de texto
es para los números de teléfono, crea la forma lo suficientemente inteligente como para manejar "(000)
000-0000" o "000 000 0000" o "0000000000" o "000.000.0000". (Hable con sus desarrolladores de cómo
hacerlo)

Dando a los usuarios un ejemplo de la entrada que espera también puede reducir los errores. Puede ser
directamente en un campo de texto, por ejemplo, o una parte de sus instrucciones.

Cuando los usuarios se pierda una pregunta o comete un error, usted debe alertar a ellos para que puedan
arreglarlo. Si se trata de una pregunta que se puede comprobar, se puede mostrar una marca de
verificación o una "X" para indicar si es correcto o incorrecto. Esto se conoce como la gestión de errores
en línea.

Los campos de contraseña también utilizan el método de línea para indicar si la contraseña es "débil" o
"fuerte" a medida que escribe.

No use el control de errores en línea si usted no puede verificar la entrada, al igual que cuando las
personas entran en su nombre.

Cuando el usuario hace clic en "Siguiente" o "hecho", se puede comprobar el formulario para preguntas o
errores perdidas. Si hay un problema, que sea muy obvio - visualmente - cuáles se perdieron, y por qué
están equivocados.

Protip: asegúrese de que el usuario puede ver el error desde el fondo de la forma! Si tienen que
desplazarse hacia arriba para descubrir lo que pasó, no lo harán.
****

Los errores de velocidad vs

Esto es un poco avanzado, pero muy útil:

¿Está usted haciendo preguntas muy comunes como "nombre" y "correo electrónico", o los más inusuales
como "¿cuál es tu tipo favorito de la obra de arte de terciopelo?"

Para las preguntas más frecuentes, un formulario con etiquetas que se hayan alineado a la izquierda y por
encima de la entrada será conseguir que los usuarios a través de él lo más rápido posible. Mantiene todo
en el eje de la interacción.

Para preguntas poco comunes o complejas, un formulario con etiquetas a la izquierda de la entrada (en la
misma fila) se ralentizará a los usuarios un poco, pero crea menos errores.

Para la mayoría de las formas, poner el botón "hecho" a la izquierda, en el Eje de Interacción.

Si el formulario va a hacer algo realmente destructivo o crítica, lo puso a la derecha, para que las personas
se detienen a mirar por ella en lugar de hacer clic en él por reflejo.

****

Diariamente Curso UX Crash: # 23 de 31

Cuando se trata de la redacción, la gente UX y verdaderos redactores se preocupan por cosas diferentes.
Nuestra atención se centra en los tipos específicos de la escritura, y no estamos en esto por el familiaridad
con la cultura poética. Hoy vamos a aprender acerca de:

Las llamadas a la acción, Instrucciones y Etiquetas

 
(Si usted está empezando el Crash Course UX: Empieza aquí. )

****

Hay cuatro lugares cuando un diseñador UX podría dar su opinión acerca de las palabras que se utilizan
para comunicarse con los usuarios. De lo contrario, es una buena idea dejar que los creadores de
contenido hacen allí cosa. Estos cuatro lugares son:

• Las  llamadas  a  la  acción    

• Instrucciones    
• Las  etiquetas    
• Más  largo,  texto  persuasivo.    

Esta lección cubrirá los 3 primeros. # 4 consigue toda una lección de su propia, más tarde en el curso
acelerado.

***

Las llamadas a la acción

A "CTA" es el título o el texto en / cerca de un botón que dice a la gente lo que deben hacer. "Descarga la
aplicación ahora!" O "Actualizar tu cuenta gratis!" O algo por el estilo. Y: puede que te sorprenda la
cantidad de efecto buena copia UX puede hacer en esos casos.

La fórmula general para un buen CTA es:

VERBO + BENEFICIO + URGENTE momento o lugar

Verbo: es lo que van a hacer.

Beneficio: es lo que van a conseguir (si el verbo no ya incluirlo).

Urgencia: es un marco de tiempo como "ahora" o un lugar como "aquí". La palabra "libre" también
puede crear urgencia si cabe su situación.

Para una explicación algo más detallada de esta fórmula:

LEER MI MÉTODO CTA AQUÍ.

****

Instrucciones:

Si no está 100% claro cómo el usuario debe hacer algo - y aunque sea - es posible que desee para
ayudarles a salir. Lección de ayer en los formularios se refirió a esto también, porque las formas son el
lugar más común el uso de instrucciones.

Las instrucciones deben ser cortos, literal y directa. No jerga. No hay términos de la industria. No hay
chistes ingeniosos o sarcasmo o negocio divertido. No ser demasiado prolijo o demasiado suave.

Dígales exactamente lo que debe hacer. Usa las palabras y frases que usted conoce más simples. Escriba a
todos como son niños inteligentes, o alguien que está aprendiendo el idioma. No lo hagas más estúpido,
simplemente dejar claro.

Malo: "Swing para abajo hasta el lugar clicky cuando yer todo listo!"

También malo: "Se requiere toda la entrada de datos en esta área y debe ser enviado y estará habilitado
para iniciar el proceso de creación de la cuenta."

Stupid: "Mírate! Eres tan bueno en las formas! Cuando usted consigue todo lo escrito allí como una
forma buena de carga externa, entonces debería seguir adelante y haga clic en ese botón amarillo de lujo
de abajo! Ya casi ha terminado, campeón! "

Bueno: "Conteste todas las preguntas. Luego haga clic en el botón amarillo de la etiqueta hecho en la
parte inferior de esta página. "

****

Etiquetas:

Puede ser muy tentador para hacer etiquetas inteligentes o único, pero siempre resistir esa tentación.
Utilice el más fácil versión más básica más común, de la etiqueta que se puede imaginar. Si su etiqueta
puede tener más de un tipo de respuesta, tal vez no sea lo suficientemente claro todavía.

Malo: "¿Dónde está su corazón ..."

No es bueno: "El lugar donde vives"

Mejor: "Dirección"

Lo mejor: "domicilio"

Las etiquetas también se aplican a los botones, que es algo que muchos diseñadores tienen vistas.

Si se salta el título y las instrucciones, ¿aún entender lo que hacen los botones? Si no, haga las etiquetas
mejor.

Malas etiquetas de botones: "Ok" o "Sí"

Buenas etiquetas de botones: "Eliminar su cuenta" o "Guardar cambios"

****

Sin embargo, esta es una de las veces en UX cuando el método es bastante fácil y el escenario de la vida
real puede llegar político. Si usted tiene un director creativo o un redactor o un cliente que mira su texto y
decir "tenemos que hacer que sea más impresionante", debe decir que no.

Demuéstralo con una prueba A / B si es necesario, pero nunca dar marcha atrás cuando el texto es por
razones prácticas y funcionales. A veces, la "experiencia" que necesita el usuario es algo simple y claro,
no es algo increíble y divertido.

****

Diariamente Curso UX Crash: # 24 de 31

Hemos llegado a la última lección relativa wireframes, y una de las características más importantes de
cualquier diseño interactivo:

Botones Primaria y Secundaria

 
(Si usted está empezando el Crash Course UX: Empieza aquí. )

 
El ejemplo anterior muestra dos ejemplos de botón (no haga clic en ellos). Como norma general no
necesitará utilizar dos estilos de botón, porque la mayoría de las acciones del usuario caen en una de dos
categorías:

• 1)  Las  acciones  principales  que  son  útiles  para  nuestros  objetivos.    

• 2)  Las  acciones  secundarias  que  no  son.    
****

Botones primarios:

Algunas de las acciones que están disponibles para el usuario son productivos, como registrar, comprar,
enviar contenido, guardar, enviar, compartir, y así sucesivamente. Producen cosas que no existían antes.
Esas son acciones primarias, o las cosas que queremos que el usuario haga tan a menudo como sea
posible.

Los botones que ejecutan acciones primarias - Botones primarios - deben ser lo más visible posible.
Nosotros que el uso de los principios que aprendimos antes en el curso.

Estilo primario: Contraste en comparación con el fondo. (Muy diferente color o la sombra).

Posición en Diseño: En o cerca del eje de la interacción para que los usuarios los notan primero, por
reflejo.

****

Botones secundarios:

Algunas de las acciones que están disponibles para el usuario son contraproducentes, como la
cancelación, saltar, la restauración, la disminución de la oferta, y así sucesivamente. Eliminan o detener la
creación de cosas nuevas. Esas son acciones secundarias o cosas que no queremos que el usuario debe
hacer, pero nos proporcionan la opción por el bien de la facilidad de uso.

Por lo tanto, los botones que ejecutan las opciones secundarias - Botones secundarias - deben ser menos
visible, para evitar clics accidentales o "reflexivos".

Estilo secundario: Bajo contraste en comparación con el fondo (un color o un tono similar).

Posición en Diseño: distancia desde el eje de interacción para que los usuarios sólo se notan cuando están
buscando para ellos.

****

Importancia es una excepción BIG:

A veces las acciones contraproducentes son importantes, al igual que la eliminación de su cuenta.

Esas acciones deben tener un estilo de primaria, pero la posición secundaria en el diseño. La razón es
que queremos que el usuario encontrar, pero nosotros queremos que piensen acerca de su acción antes de
hacerlo.

También es una buena idea dar a este botón un color que indica la importancia de la acción (rojo, naranja,
amarillo, etc.)

****

Botones especiales:

En algunos casos, usted tendrá un tipo de acción que es único en su sitio o aplicación, que requiere
atención especial. Diseñar un botón especial para esto, por lo que se destaca en su diseño (patrón de
ruptura).
Amazon de "Añadir a la cesta" botones, Pinterest del botón "Pin it", y el viejo thumbs-up de Facebook
"Like" todo tiene este tratamiento (más o menos).

****

Diariamente Curso UX Crash: # 25 de 31

Habilidades de diseño pueden ser las tuercas y tornillos de UX, pero hay que entender cómo la gente
piensa que hacer bien UX. Hasta ahora nos hemos centrado en el diseño, por lo que hoy vamos a aprender
la primera de tres lecciones sobre la psicología del usuario:

Acondicionamiento

 
(Si usted está empezando el Crash Course UX: Empiece aquí )

****

¿Qué es acondicionado?

No tiene nada que ver con lo lejos que puede funcionar, pero tiene todo que ver con lo que espera y lo
que quieres.

Si usted ha oído hablar de perros babosos de Pavlov , entonces usted podría estar familiarizado con
"acondicionado" en un contexto científico.

De hecho, si usted tiene un perro, es posible que incluso han utilizado acondicionado antes, cuando se les
entrenó para sentarse, dar la mano, hacer sus impuestos, y así sucesivamente.

Funciona igual de bien en la gente.

El condicionamiento es el principio fundamental de que los animales - incluyendo a los humanos - van a
hacer algo nuevo si se les recompensa, y van a evitar hacerlo de nuevo si se les castiga.

Esto puede parecer obvio, pero el 99% de los diseñadores que he conocido ignorarlo en sus diseños UX.
A pesar de que es la única manera de hacer que el diseño de su adicción.

****

Las recompensas y los castigos son sentimientos, no las cosas.

Cuando hablamos de los usuarios gratificantes, 9 de cada 10 personas piensan automáticamente sobre el
ofrecimiento de la oportunidad de ganar un iPhone o entradas de cine o alguna otra cosa igual de tonto.

Estamos hablando de millones de personas aquí. Consiga una vida.

Las recompensas y los castigos más efectivos son libres porque son sentimientos, no algunas cosas al
azar.

Imagina que te llevamos al escenario y dice 50.000 personas que usted es uno de los mejores amigos de
una persona nunca podría tener, y que el mundo es un lugar mejor porque estás en ella.

¿Te gustaría hacer esto más de una vez? Probablemente.

Ahora imagina que te llevamos al escenario y te dijimos que te habían votado "más inútil" por todos sus
amigos y familia más cercanos.

¿Te gustaría hacer eso otra vez? Probablemente no.

Esos son un poco extremo - a menos que usted está en la realidad TV - pero observe que no le dimos nada
ni quitar nada a usted. Todo es cuestión de percepción. Pero los sentimientos esas percepciones crean
puede ser bastante intenso!

****

Crear un circuito de retroalimentación

Entonces, ¿cómo usted utiliza realmente acondicionado en su diseño?

El truco es crear un lazo de sentimientos y comportamientos que no se acaba nunca, por lo que la
utilización de su diseño se convierte en infinitamente gratificante. El modelo básico de bucle de
realimentación es:

Motivación> Acción> Comentarios> Motivación

Por ejemplo, digamos que usted tomó una linda foto de su bebé. Usted está motivado para ponerlo en
Facebook para que otras personas puedan ver cómo es lindo su bebé. Así que usted tome medidas y que lo
ponga.

Facebook tuvo que diseñar una forma para que usted tome esa acción.

A continuación, obtener retroalimentación de todas las personas que "Like" y colocar nuestros elogios.
Usted puede incluso conseguir un correo electrónico sobre él.

Facebook tuvo que diseñar esas formas de proporcionar retroalimentación también ... lo que crea la
motivación para tomar otra foto, y hacerlo de nuevo!

Ese "loop" continuará hasta que la gente deje de dar la buena regeneración o hasta que se "castigado" por
personas que no pueden soportar mirar una más jodida foto de ese pequeño monstruo!

Hipotéticamente.

El truco: si se quiere diseñar una característica que permite a la gente a sentirse bien, van a volver una y
otra vez para que puedan sentirse bien otra vez! Si esta característica logra sus objetivos de negocio,
acaba de crear un producto de éxito!

Tenga cuidado con los castigos: el usuario debe tratar de evitar los castigos, por lo que el diseño de sus
características de esa manera. NO hacen activamente sus usuarios se sientan mal. Esa es una buena
manera de perder ellos. El caso ideal es donde no hacer lo que les hace sentir bien también reducirá la
cantidad de puntos, o atención, o la productividad que quieren.

Por ejemplo, antes había un "juego de la granja" - que no podrá ser nombrado - en caso de jugar el juego
hizo su granja más grande y mejor con el tiempo (la recompensa). Si ha dejado de jugar por mucho
tiempo, sus cultivos morirían (castigo). Pero ... también se puede pagar para acelerar las cosas y obtener
cosas nuevas para su granja (gran recompensa!)

No es de extrañar que fue uno de los juegos más exitosos de todos los tiempos.

****
Tenga cuidado con su propio condicionamiento!

Acondicionado entrena a todos, en todas partes. Sin embargo, todos estamos condicionados de diferentes
maneras. Es por eso que usted tiene un color favorito, o por qué prefieren ciertos estilos de diseño, o por
qué el olor de McDonalds es como el crack para mí.

No dé por sentado que todo el mundo le gustan las cosas concretas tanto como usted lo hace.

****

Diariamente Curso UX Crash: # 26 de 31

Continuando con los aspectos psicológicos de la UX, vamos a entrar en el área de la UX donde he hecho
la mayor parte de mi investigación:

Persuasión

 
(Si usted está empezando el Crash Course UX: Empieza aquí. )

****

La persuasión es compleja. Mi libro, La Persuasión Composite , es de 270 páginas específicamente

sobre cómo hacer las cosas persuasivo, y es sólo un "Crash Course" en sí mismo!

Esta lección también completa Lección # 23: UX Redacción, porque te dice cómo estructurar más tiempo,
texto y artículos persuasiva.

****

Dos ideas principales:

1) La persuasión tiene 8 ingredientes universales. Suelen ser más eficaz cuando se realiza en orden,
porque construyen unos sobre otros.

2) Las personas son motivadas por 14 cosas. Voy a explicar las 4 motivaciones que son más comunes
en las cosas digitales.

****

 
La fórmula Persuasion

Después de comparar 40 diferentes tipos de persuasores, me encontré con que todos sus métodos
comparten 8 atributos comunes, que se enumeran a continuación.

Antes de la Interacción:

Credibilidad - Sin confianza, todo lo demás es irrelevante. Lo ideal sería que usted debe construir su
credibilidad en serio, sin embargo, lo principal es comunicarse con los demás de forma de gran valor. En
UX, esto se aplica a todo, desde la marca de confianza, a la transparencia acerca de sus precios,
testimonios de clientes No digas que eres valioso,. Mostrarles.
Conozca a su público - En UX, eso significa que usted haga su investigación del usuario para que sepa
que usted está persuadiendo y lo que les importa.

****

Durante la interacción:

Open & Disarm - Tienes que captar el interés del usuario de inmediato, y luego proceder a retirar las
objeciones obvias que puedan tener. En UX esto puede ser un gran título o una imagen llamativa por
encima del pliegue. Si el precio es una preocupación, por ejemplo, que debe formar parte de la primera
información que el usuario puede ver. No dé por sentado que seguirán lo suficiente como para aprender
de ello más tarde.

Crear Rapport - (digamos rah-POR) es la sensación de llevarse bien con alguien y que es creado por las
similitudes entre las personas. En UX, esto se puede crear mediante el uso de un lenguaje familiar, que
muestra lo que el usuario tiene en común con sus clientes, o la descripción de la persona principal en su
artículo de una manera que hace que el lector se relacionan con ellos.

Aislar - Cuando un usuario ha llegado lo suficientemente lejos que su interés es claro, que desea eliminar
toda la información de la competencia. En UX que eso podría significar la eliminación del menú o
pancartas durante el proceso de compra para que nada distraiga al usuario de su compra.

Convences - Para más persuasiones complejos, puede ser necesario para proporcionar "olas" de
información que lleve al cliente a partir de los conceptos básicos a los detalles, por lo que entender paso a
paso. Hay una variedad de maneras de hacer esto. sesgos cognitivos son a menudo útiles para enmarcar la
información de una manera que hace que sea más fácil de aceptar, y más fácil de consumir.

Cierre el trato - Sólo pide compromiso y no sobre-complicarlo. En UX es el botón "publicar" o el botón

"confirmar compra", o el botón "compartir".

Después de la Interacción:

Resuma con Bias - No dejes que la persuasión termina con el cierre! Eso hace que la gente se siente
como si sólo se valora hasta que te dan lo que quieres. En UX esto podría ser un correo electrónico de
seguimiento para recordarles acerca de todo lo que pueden hacer con su nuevo MacBook, o sugerencias
para más artículos o comentarios acerca de la cantidad de gente le gusta / de acuerdo con su puesto.

****

 
Universal Motivaciones:

Alguna vez has visto la jerarquía de las necesidades humanas de Maslow ? Olvídate de eso. Los
vendedores todavía lo aprenden en la escuela, pero los psicólogos dejaron atrás hace mucho tiempo.

Hay 14 cosas que los seres humanos siempre se sentirá motivado para ganar o proteger: Evitar la
muerte, evitando el dolor, el aire, el agua, la comida, la homeostasis (funciones corporales), el sueño, el
sexo, el amor, la protección de los niños, el estado, la afiliación, la justicia, y comprender cada una de
esas cosas mejor.

Todas esas cosas tendrán una audiencia - y desencadenan respuestas emocionales a diferentes grados -
pero en la internet, Estado, Afiliación, Justicia, y la comprensión son particularmente útiles, ya que son
sólo ideas Ellos también son ilimitados, y usted puede crearlos desde. rayar, de forma gratuita.

Estado - es el ingrediente principal en gamification Básicamente se trata de ninguna manera de medir el

mismo en relación con otras personas.. Cuando se diseña un sistema de puntos y trofeos o símbolos de
poder y aprecio, que ahora controla la percepción del estado para sus usuarios. Puede ser insignias,
gustos, o los niveles de caramelo Crush Saga. Los usuarios estarán más motivados para sentirse superior a
los demás, y si adjunta esos logros a sus objetivos de negocio, que, literalmente, conseguir el dinero para
nada más que sentimientos.

Afiliación -. Si usted es un fan leal de un equipo deportivo o una banda, o si se siente orgulloso de ser
parte de una gran organización o un grupo de interés especial, que es la afiliación La razón de personas se
unen a grupos de Facebook, o se visten de cierta manera o hacer una prueba para saber "Qué personaje
Anatomía de Grey es usted?" es porque no se sienten motivados a pertenecer a las cosas. Diseñe un lugar
para que las personas pertenecen, y ver a sus usuarios se identifican en grupos o categorías.

Justicia - es la idea de la justicia o "conseguir lo que se merece", ya que significa un premio o un castigo.
Es por eso clamamos para las personas que no consiguen ningún respecto y luego tener voces operísticas
increíbles en Britain 's Got Talent , y por qué odian a Justin Bieber encanta verlo son arrestados. Diseñar
una manera de ayudar a los desvalidos reciben la atención, o para la multitud para encontrar el mal y
destruir , y lo harán.

Comprensión - La gente está motivada para aprender más (e incluso sienten que tienen derecho a saber
más) acerca de todo lo que implica grandes dosis de las motivaciones anteriores. Sin embargo, es mucho
más práctico que eso. Si usted trata de cambiar algo que se tomó el tiempo para aprender, al igual que el
diseño de su interfaz, la gente podría estar enfurecidos. Recuerde que los grupos de personas con horcas y
antorchas después de que Facebook hizo un importante rediseño? Exactamente.

****

Protip: Tenga en cuenta que el dinero no está en la lista? Eso es porque el dinero no es motivadora en sí
mismo. Si lo fuera, usted estaría motivado para conseguir dinero incluso si usted no puede pasar, pero no
lo eres. Sin embargo, estamos motivados para obtener el estado que el dinero crea, incluso en forma de
puntos que son básicamente inútiles en el mundo.

 
Whoa. Eso era mucho. Tómese su tiempo para pensar en ello. Aún mejor: buscar ejemplos del mundo
real de la misma.

Diariamente Curso UX Crash: # 27 de 31

Para terminar la sección de Psicología usuario del curso intensivo, vamos a ver las formas los nuevos
usuarios y los usuarios experimentados ver su diseño de manera diferente:

¿Cómo experimentan cambios Experiencia

 
(Si usted está empezando el Crash Course UX: Empieza aquí. )

****

Usuarios avanzados son la minoría:

-Estadísticamente hablando, es imposible para los usuarios avanzados o poder de ser "la mayoría" de las
personas que utilizan su diseño. Aunque puede ser muy tentador creer eso.

A menos que su producto / servicio es muy técnico la gran mayoría de sus usuarios sean personas
normales con otra mierda que hacer. No es muy enfocadas, conocedores de la tecnología, como usted y
sus colegas.
Dura verdad: Si usted quiere a millones de usuarios satisfechos, el diseño para los idiotas distraídos, no
los genios obsesionados.

****

Oculto vs Visible: La paradoja de la elección

En la mayoría de los proyectos habrá situaciones donde se tiene que decidir cómo "limpiar" usted quiere
que su diseño sea.

Los diseñadores suelen optar por ocultar todo porque se ve mejor.

Los no diseñadores quieren con todas sus funciones favoritas para ser visible todo el tiempo. (Que será un
conjunto diferente de características para cada persona)

Así que, ¿cómo elegir?

Características visibles siempre se usarán más y descubrieron más de características ocultas. Se nos
recuerda que existen cada vez que los vemos.

Sin embargo, la "paradoja de la elección", dice: cuantas más opciones que ve, menos probabilidades
tendrá de elegir cualquiera de ellos. Así que si se sobrecarga los usuarios normales con demasiadas
opciones, van a flipar y huir gritando.

Asegúrese de que los principiantes pueden encontrar las principales características con facilidad.
Idealmente, sin hacer clic en cualquier cosa. Y tratan de dar a los usuarios de energía de fácil acceso a
funciones avanzadas, incluso si no son visibles todo el tiempo.

****

Protip: ¿Ha 20 opciones de medios sociales ocultos detrás de un único botón de "compartir"? ¿Estás
emocionado por la cantidad de limpiador que se ve?! Por desgracia, no se ha diseñado una interfaz de
"simple". Usted acaba paralizado sus funciones para compartir porque hay demasiadas opciones y nadie
puede verlos. Contrario a la intuición, a la derecha?

Elija algunas opciones y hacerlas visibles todo el tiempo. Usted me agradecerá más tarde.

****

Reconocimiento vs Memoria:

¿Cuántos iconos diferentes podría nombrar la parte superior de su cabeza, en este momento?

¿Cuántos has podido reconocer si te doy una lista?

Si usted es un ser humano normal, la segunda respuesta sería mucho más.

Si el diseño de su interfaz por lo que la gente tiene que pedir algo - como la búsqueda - que sólo utilizarán
las características que pueden recordar. Esto significa que, con el tiempo, van a utilizar cada vez menos
características. No más y más.

Si los usuarios se ven obligados a hacer frente a una gran cantidad de información, darles algunas
sugerencias de categorías o algún otro tipo de ayuda para recordarles dónde mirar!

****
El aprendizaje es lento. Los hábitos son rápidos.

"Onboarding" es la palabra que usamos para describir las lecciones paso a paso, o introducciones muy
simples a una nueva interfaz. Se ayuda a los nuevos usuarios a encontrar las principales características
con facilidad, y evitar confusiones.

Sin embargo, ¿qué ocurre cuando el usuario ha utilizado la interfaz de 2 años?

Los hábitos se crean muy rápidamente en la mente de su usuario, por lo que debe diseñar un "modo
rápido" de hacer las características clave, que puede no ser tan obvio. Los usuarios avanzados se toman el
tiempo para aprender de ellos por el bien de la productividad adicional. Atajos de teclado, opciones que
aparece, y todos los pequeños trucos de Twitter como ". @" Tweets son ejemplos de esta idea.

****

Diariamente Curso UX Crash: # 28 de 31

Ahora que ha aprendido a usuarios de la investigación, establecer metas, planificar la arquitectura de
información, dirigir la atención de los usuarios, hacer buenas wireframes, y entender la mente de un
usuario, es el momento de poner en marcha! Y el lanzamiento significa que tenemos algo para medir, por
lo que necesitamos saber:

¿Qué es Data?

 
(Si usted está empezando el Crash Course UX: Empieza aquí. )

****

Los datos son el objetivo

En una de las primeras lecciones que hemos aprendido acerca de la investigación del usuario.

De datos es diferente.

Datos mide el comportamiento del usuario. Lo que ellos hacen. ¿Cuántas veces lo hicieron. ¿Cuánto
tiempo le tomó. Y así sucesivamente.

Se recoge por un ordenador, por lo que no puede influir en el usuario. De medidas bien definidas, por lo
que hay un muy bajo margen de error. Puede medir a millones de personas, sin ningún esfuerzo de su
parte. Y puedo decir cosas acerca de sus usuarios como que navegador usan, o en qué país en que se
encuentran

Y los datos nunca miente. Esto es ciencia, perra!

Pero también no le dice nada sobre el contexto, así que ten cuidado. Desafortunadamente nosotros los
diseñadores tienen que interpretar los datos, y ahí es donde se pueden producir errores.

****

Los datos se hizo de las personas

Va a tener la tentación de tratar los datos como "sólo números" que se refiere a lo que quiera que
signifiquen. Recuerde que estos números representan las acciones de personas reales con vidas
complicadas.

No reduzca a millones de personas en un solo número y esperamos que sea fiable en cualquier situación.

También puede tener la tentación de buscar los números que "demostrar" que tenías razón. NO. Y decir
que no a todo el que te pida eso.

****

Hay más datos mejores datos

Si mide los clics de 5 personas, podrían ser todos borrachos, y no tienes forma de saber. Si mide los clics
de 5 millones de personas, es muy poco probable que todos ellos están borrachos, a menos que sólo
probar personas en Cancún durante las vacaciones de primavera.

Cuanto más grande sea la decisión que usted está tratando de hacer con los datos, más datos que usted
necesita antes de decidir. Pero una vez que los datos de habla, los datos han dicho!

****

Algunas maneras de recoger información objetiva de datos de usuario

Hay otras tantas formas de obtener datos objetivos, ya que hay maneras de obtener la investigación del
usuario subjetiva:

Analytics - Google y muchas otras compañías ofrecen formas baratas o gratuitas para el seguimiento de
lo que hacen sus usuarios, de forma anónima. Básicamente, cada vez que se carga una página o haga clic
en algo, usted sabrá. Y usted puede diseñar medidas de encargo, por lo que el cielo es el límite!

Las pruebas A / B - Diseño de dos versiones de lo mismo y poner en marcha los dos! Usted sabrá cuál
funciona mejor, ya que se prueba con la gente real, en tiempo real. El software también le permite saber
cuándo parar, porque en un momento dado, más gente no va a cambiar mucho.

Eye-Tracking - Esto se hace en un laboratorio, pero el usuario no puede controlar, por lo que considero
que es objetiva. Software y equipos especiales se utilizan para medir donde los usuarios buscan, ya que
utilizan su diseño, por lo que saben dónde usted los ha guiado bien, o no.

ClickTale - Este es un ejemplo de la utilización de mapas de calor por los clics y el desplazamiento y las
corrientes, pero hay otros. El software de ClickTale le permite grabar de forma anónima la interfaz como
usuarios reales utilizan. Su entrada no se podrá ver, pero a ver dónde hacen clic, a dónde va el ratón, hasta
dónde desplazarse, y las páginas que ven como se mueven a través de su diseño. Súper útil.

Registros de la búsqueda - Muchas personas no se dan cuenta de que un campo de búsqueda en su ste
puede ahorrar cada palabra que se escribe en él. Si la gente está buscando para él, significa que ellos no
pueden encontrarlo, por lo que los registros son super valiosa para mejorar su arquitectura de información
y diseños!

****

Diariamente Curso UX Crash: # 29 de 31

Si usted está planeando para analizar los sitios web, es sólo una cuestión de tiempo antes de que te metan
en Google Analytics y pedirá que mire en la salud de su sitio. Diseñadores UX hacen esto de manera
diferente a los vendedores, así que hoy vamos a aprender acerca de los fundamentos:
Diseñar con datos - Resumen Estadístico

 
(Si usted está empezando el Crash Course UX: Empiece aquí )

****

Hay 7 estadísticas básicas que se necesitan para entender si usted quiere hacer cualquier cosa con un sitio
web. No sólo lo que miden, sino por lo que significan.

Los números no son buenos o malos: 1 millón de usuarios sólo es bueno si es más alto que el mes pasado.
Si usted es Facebook y tienes 1 millón de usuarios este mes, estás en problemas.

Antes de analizar algo, ten aminute a pensar en lo que su sitio tiene que hacer, y se dan cuenta de lo que
los números podrían indicar que tipo de comportamiento.

****

1 y 2) Total de Visitas y visitas únicas

Esto puede sorprender, pero Visitas totales mide el número de veces que su sitio ha sido visitado, total.

Visitas Únicas es un poco diferente aunque. Si vuelvo a visitar su sitio 50 veces, no soy más que 1
visitante único. Y técnicamente, cuenta no los dispositivos únicos "populares".

Lo que quieren decir: Comparando estos números le dirá si su tráfico es:

• Alta  calidad  -­‐  total  es  mucho  mayor  que  Uniques.    

• Alta  cantidad  -­‐  total  es  casi  lo  mismo  que  Uniques  y  Uniques  son  más  altos  
que  el  mes  pasado.    

• Ambos  -­‐  Uniques  son  más  altos  que  el  mes  pasado  y  en  total  es  mucho  mayor  
que  Uniques.    

• Ni  -­‐  Uniques  son  más  bajos  que  el  mes  pasado  y  en  total  es  casi  lo  mismo  que  
Uniques.    

"Únicas" son una representación más auténtica de su tráfico, pero yo prefiero tener 1.000 personas que
visitan cada día de 10.000 personas que visitan una vez al mes. Por otra parte, si 1 guy visita mi sitio un
millón de veces, eso no es particularmente útil, ya sea, y es probable que tenga problemas.

****

3) Vistas de página

¿Qué mide: Una visita de página se cuenta cada vez que cualquier visitante cargue cualquier página.

Lo que significa: Usted puede pensar en páginas vistas como un "indicador general" de tráfico, ya que
describe la cantidad total de contenido que se ve, en general, y no tiene en cuenta la mayoría de los otros
factores.

Si su sitio se ejecuta en los anuncios de banner se trata de un número importante de ver.

Si su sitio es impulsado por el contenido, como noticias, y luego tener una gran cantidad de páginas vistas
en general podría ser más importante.

****

4) Páginas por visita

¿Qué mide: el número medio de páginas de cada visitante podrá ver, cada vez que visitan. También se
puede pensar en él como los "clics" por visita, si eso ayuda (aunque técnicamente no es exacto).

Lo que significa: Si su sitio está más centrado en las tareas o las interacciones sociales, entonces la visita
Páginas-per-podría ser una mejor métrica para ver de páginas vistas.

Por otro lado, si usted es Google Search, desea que este número sea lo más bajo posible, porque los
buenos resultados que le dan lo que quiere en la primera página.

****

5) Tiempo por visita

¿Qué mide: la duración de cada visita dura (en promedio). Puede ser muy importante comparar Hora-
por-Visita y Páginas por visita.

Lo que significa: En un mundo perfecto, los sitios basados en contenido que los visitantes quieren leer
todo el artículo, y leer un montón de artículos. Eso sería un largo tiempo por visita, y muchas páginas por
visita.

Si la gente ve una gran cantidad de páginas por visita, pero no pasamos mucho tiempo por visita, que
podría estar buscando algo y no encontrarlo (malo), o pueden ser la realización de tareas muy rápido
(bueno). Depende!

Si la visita Hora-por-es alto, pero Páginas por visita es bajo, la navegación podría chupar (malo), o podría
significar los artículos son largos y los usuarios están realmente comprometidos (bien)! Depende!

Si tanto tiempo-y Páginas por visita son bajos, eso podría ser una mala señal, a menos que el propósito de
su sitio es para entrar y salir rápidamente, al igual que Google.

****

6) Porcentaje de rebote

¿Qué mide: las personas que sólo ven una página y luego dejan sin hacer clic en cualquier cosa.

Lo que significa: En general, solemos pensar en esto como la gente diciendo "no" a su sitio. PERO ...
hay algunas excepciones.

Blogs tienden a tener una tasa de rebote más alto, ya que están diseñados para una sola página de
visualización: o escanear la lista de los últimos puestos, o llegaron a un puesto específico.

La estructura del sitio y el origen de su tráfico puede tener un efecto enorme en el porcentaje de
abandonos, por lo que a pesar de que parece simple, tasa de rebote puede ser un indicador complejo.

****

7) Usuarios nuevos y Vuelta Visitantes

¿Qué mide: Si una persona (en realidad un dispositivo) ha sido a su sitio antes, que están "regresando".
Si no, ellos son "nuevos".

Lo que significa: Volviendo a los visitantes sepan más acerca de su sitio, por lo que con frecuencia
"rebotan" menos y ver más páginas. Si ellos regresan tienen que gustar lo que haces, lo que a menudo
pasan más tiempo en el sitio también.

Sin embargo, los "nuevos" los visitantes son buenas, porque significa nuestro sitio de conseguir
exposición a más personas.

Lo más importante es la relación de la nueva de volver. Si no tiene visitantes que regresan entonces su
sitio es nuevo, o terrible, porque nadie va a volver. Si sólo tiene visitantes que regresan luego a sus
usuarios podrían ser leales, pero el sitio se está muriendo, porque nadie nuevo es encontrarlo.

Y, en general, el más maduro de un sitio, más visitantes que regresan tendrá - en porcentaje - porque
devolver una gran cantidad de visitantes que regresan a menudo son difíciles de superar con el tráfico de
búsqueda normal o campañas publicitarias.

****

Diariamente Curso UX Crash: # 30 de 31

Usted no necesita un conocimiento profundo de las estadísticas para ver cosas interesantes en un gráfico.
El comportamiento humano hace que algunas formas predecibles! Así que hoy vamos a aprender sobre:

Diseñar con los datos: Gráfico Shapes

 
(Si usted está empezando el Crash Course UX: Empieza aquí. )

****

Hay dos estilos de gráficos que el comportamiento humano crea con bastante frecuencia: Tráfico y
de comportamiento estructurado.

****

Una pequeña nota: he usado un "gráfico de barras" en estos ejemplos porque era más rápido para
dibujar. Sus análisis pueden emplear distintos tipos de gráficos.

No entre en pánico. Todos lo hacen básicamente lo mismo. Es por eso que estamos formas de
aprendizaje, no tipos de gráficos.

****

Tráfico Gráficos

Estos gráficos muestran el número de personas que hicieron algo, con el tiempo. Al igual que el número
de visitantes por día. A eso le llamamos "tráfico".

El tráfico siempre se mueve hacia arriba y hacia abajo un poco, porque las cosas al azar en el mundo
ocurren todos los días. Incluso cuando su sitio no cambia en absoluto.
Es por eso que nunca podemos asumir que un pequeño cambio en el tráfico fue causado por una nueva
característica o un cambio de diseño.

Ahora, con las formas!

****
Si sería bastante fácil de caminar a través de la gráfica, y se nota un "aumento" de conformidad o "caída",
entonces es probable que continúe la tendencia, a menos que se cambie.
¿Sabía usted ejecuta una campaña de fin de semana? ¿O es algo técnico causando problemas en una de
sus páginas? O tal vez su cinta de sexo sólo se hizo pública? Cuando ves a un "pico" en un gráfico (o una
"caída" súbita), tratar de averiguar qué lo está causando, porque - por muy tentador que sea de creer que
espontáneamente ha convertido en fresco - siempre hay una razón para una espiga. A veces bien, a veces
mal.

Ver cómo hay un patrón que se repite una y otra vez?

Los sitios que son populares entre los "empleados de oficina" a menudo reciben más tráfico durante los
días de semana. Si los usuarios son todos los niños que van a la escuela durante el día, fines de semana
podría ser tu gran día. Esto es muy común y muy normal.

Pero ...

Si se trata de un patrón saludable por lo general vienen con una tendencia de crecimiento lento,
demasiado. Si usted ve un patrón muy predecible y sus números se va lentamente, los usuarios podrían
estar muriendo de aburrimiento. Agite bien las cosas!

****

Estructurado Comportamiento Gráficos

El otro gran tipo de gráfico que muestra lo que la gente está haciendo. La fecha o la hora en que lo
hicieron no es tan relevante. Usted tiene un gran efecto en este tipo de comportamiento a través de su
arquitectura de la información.

Nota: "el comportamiento estructurado" es una frase que me inventé para esta lección. Si usted dice que
en el trabajo sonará inteligente, pero nadie va a saber lo que estás hablando.

 
El gráfico anterior muestra una forma como una diapositiva. Más gente haga clic en la primera cosa que
la segunda cosa y, más gente haga clic en el segundo punto de la tercera cosa. Cada vez que hay un orden
visual - como un menú - o una secuencia natural de la gráfica se verá así.

La lista de los "Top páginas" suele tener este aspecto, porque no se puede llegar a la página dos, sin pasar
por la página uno. La vista detallada de tiempo por visita o Páginas por visita también suele tener este
aspecto, ya que el gasto de más de 10 segundos en un sitio es tan condenadamente difícil.
  
Este es más interesante. Si los datos parece que tiene todas las piezas correctas, pero algunos están en el
orden incorrecto, significa que los usuarios tienen diferentes prioridades de lo que pensaba. Están
cliqueando lo segundo antes de que la primera cosa a veces. Esos bastardos locos!

Trate de cambiar su arquitectura de diseño / información para que coincida con lo que los datos que usted
está diciendo. No trate de cambiar los usuarios sin embargo. Ellos odian eso.

 
En este gráfico se ve muy similar a la primera "forma de diapositivas", pero tiene un chichón. Algunas
personas piensan que el gráfico está embarazada, pero esas personas son idiotas. Esto es lo que parece
cuando usted tiene un pequeño grupo de personas que son leales, o muy activos, o pasan mucho tiempo
en el sitio. Ellos están haciendo mucho más que el usuario medio, así que tiene un chichón.

Averigüe lo que los motiva y hacer más de lo mismo!

  
Usted quiere que su "slide" mirar suave y lisa. Si tiene cualquier gota dementes o puntos ásperos, aquellos
indicar problemas. Si la página principal de su sitio es muy confuso, es posible que obtenga un gráfico de
este tipo, ya que muy poca gente se llega a la segunda página.

Pruebas A / B son una forma muy eficaz de encontrar el problema, si no es obvio.

****

Diariamente Curso UX Crash: # 31 de 31

Ahhhh ... el fin del Crash Course. Realmente es el principio, porque si usted ha seguido todas las 30
lecciones hasta el momento, usted tiene un montón de nuevas herramientas a utilizar. Pero antes de
empezar con UX profesional, tenemos que aprender una cosa más, así que sabemos lo que es en realidad
"mejor":

Diseñar con los datos: Las pruebas A / B

 
(Si usted está empezando el Crash Course UX: Empieza aquí. )

****

Me deja pintar la imagen un poco primero ...

Imagine que usted quiere diseñar una página para vender zapatos. Y, por supuesto, usted desea vender
tantos zapatos como sea posible. ¿Qué crees que sería conseguir más gente a comprar?

• Un  video  de  los  zapatos?    

• Los  detalles  completos  de  envío  antes  de  hacer  clic  "comprar"?    
• El  logotipo  de  la  marca  de  zapatos?    
 • Una  garantía  de  devolución  del  dinero?    

¿Cómo se elige?

Si su primer pensamiento fue "pedir a los usuarios" que no es una mala idea. Pero a menudo - cuando las
opciones son subjetivos, como este - pidiendo a la gente sólo confirma que las diferentes personas como
cosas diferentes.

Entonces, ¿cómo se puede decidir entre las cosas subjetivas, como un jefe?!

La respuesta:

Diseñe todas las cosas! Luego de lanzar todas las opciones al mismo tiempo, como una prueba A / B.

****

¿Qué es una prueba A / B?

Una prueba A / B es una forma de pedir a miles o millones de visitantes reales que es la mejor opción.
Usted diseña todas las opciones que desee para comparar, y poner en marcha a todos!

Las pruebas se asegura de que cada visitante único sólo ve una opción, y luego - después de bastantes
personas han pasado por la prueba - se puede ver la versión del diseño creado más clics. El examen
también se debe medir el "nivel de confianza" estadísticamente, para que sepa cuando termines (no se
detienen demasiado pronto!)

Usted puede hacerlo con 2 versiones, o 20 versión. Sólo recuerde: sólo una parte de su tráfico se puede
ver cada uno de ellos, por lo que los más versiones que está probando, más el tráfico o el tiempo que va a
necesitar.

****

Un par de detalles:

1) A / B Testing suele ser gratuito, salvo el tiempo que se necesita para diseñar y crear las páginas que
estás probando. En el panorama general, los resultados pueden ser de gran valor, por lo que incluso un
pequeño costo para hacer una prueba A / B es muy digno de él.
2) No es lo mismo que el lanzamiento de una nueva página y luego ver para ver si esa página parece
mejor que el anterior. La única manera de comparar dos diseños es ejecutar los dos al mismo tiempo, el
uso de números (más o menos) la igualdad de las personas para ambos.

3) una prueba A / B es más confiable cuando sólo cambia un detalle. Si dos páginas son los mismos, pero
uno tiene enlaces rojos y uno tiene enlaces azules, eso está bien. Si ellos también tienen diferentes menús,
entonces no hay forma de saber si es el color de los enlaces o el menú que está haciendo la diferencia.

4) Revisión de dos páginas totalmente diferentes, como una página principal y una forma de
confirmación, es completamente inútil. Eso no es una prueba A / B apropiado.

****

Eso es todo! Si has llegado a través de los 31 lecciones, felicidades! Ahora eres un pensador de diseño
más completo, y si usted practica lo que has aprendido en este curso, usted tendrá las habilidades que se
encuentran en muy alta demanda en la industria de la tecnología.