PATRONES DE
DISEÑO WEB
Alex Naupay
El INICIO DEL CAMINO A LA SOLUCIÓN
Agenda
Patrones de diseño
Registro de cuenta
Registro Lento (Lazy registration)
Votar para promover
Obtención de informaci...
PATRÓN
DE DISEÑO
PATRÓN DE DISEÑO
o Los patrones de diseño son la base para las
soluciones a problemas comunes.
o Conjunto de recomendacion...
o Son un punto de partida, no un destino.
o No están bien o mal, son más útiles o
menos útiles.
o No son una solución en s...
ÁMBITOS DE APLICACIÓN
 Gran éxito en el desarrollo de software
Patrones de diseño de interfaces de usuario
o Intentan def...
REGISTRO
DE CUENTA
REGISTRO DE CUENTA
Problema
Se quiere conocer al usuario
Usos
 Proteger el acceso al sitio.
 La información a mostrar de...
Solución
Permitir al usuario registrar una cuenta en el sitio web
para recordar sus detalles y mostrarle contenidos
person...
• Prefieren el anonimato.
• Cada campo es un impedimento
capaz de provocar abandono.
• Completar es desagradable
Formulari...
 Solo pida información absolutamente necesaria
 Infiera información
 Pida datos una sola vez
 Trate de reutilizar camp...
Recomendaciones El botón de registro debe ser
claro y llamativo.
 Ubicar el botón en lugares clave.
 Proporciona retroalimentación al usuario.
 Retroalimente sobre disponibilidad de usuario instantáneamente.
 Proporcion...
http://www.flickr.com/photos/65819195@N00/9131696836
Nunca hagas
pensar a tu
usuario
Describa detalladamente como llenar ...
1
2
3
1
3
2
× Muchos campos
× Diferentes
idiomas
× Obligatorios
× Teléf. y celular
× FEHLT?
× 2 direcciones
× No infiere postal
× Agru...
REGISTRO
LENTO
REGISTRO LENTO
Problema
El usuario quiere usar y probar el sitio sin
registrarse formalmente.
Usos
 Navegación sin regist...
Deja Interactuar
al usuario
REGISTRO LENTO
Solución
o Permita que interactúe con el sistema y
posponga el registro.
o Versión ligera – carros de compr...
Jamendo.com
http://spanish.jotform.com/
VOTAR PARA
PROMOVER
VOTAR PARA PROMOVER
Problema
El usuario quiere promover un contenido para
ayudar a decidir cual es mejor.
Usos
 Los usuar...
VOTAR PARA PROMOVER
Solución
o Mecanismo de votación
• Votación, historial y posterior cambio.
• Retroalimente.
o Mostrar ...
VOTAR PARA PROMOVER
Razón fundamental
 Comunidad participativa
 Potente detector de contenidos populares
 Potente promo...
VOTAR PARA PROMOVER
A tener en cuenta
o El usuario es el centro, pros y contras.
o Opinión subjetiva de calidad.
o Popular...
La multitud no tiene sabiduría
¿Sabiduría de las
multitudes?
o Basan su voto a partir
de otros.
o La comunicación entre
la...
Amazon.com
votanoticias.com
RECORDAR
Patrones de Diseño Web (Getting Input - Obtención de Información) - Presentación
Upcoming SlideShare
Loading in...5
×

Patrones de Diseño Web (Getting Input - Obtención de Información) - Presentación

358

Published on

Descripción y consejos de ALGUNOS patrones de diseño web (categoría Obtención de información - Getting input).
Este es un resumen del documento de texto disponible en:
http://www.slideshare.net/AlexNaupay/patrones-de-diseo-web-getting-input-obtencin-de-informacin

Published in: Internet
0 Comments
3 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
358
On Slideshare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
16
Comments
0
Likes
3
Embeds 0
No embeds

No notes for slide

Patrones de Diseño Web (Getting Input - Obtención de Información) - Presentación

  1. 1. PATRONES DE DISEÑO WEB Alex Naupay El INICIO DEL CAMINO A LA SOLUCIÓN
  2. 2. Agenda Patrones de diseño Registro de cuenta Registro Lento (Lazy registration) Votar para promover Obtención de información
  3. 3. PATRÓN DE DISEÑO
  4. 4. PATRÓN DE DISEÑO o Los patrones de diseño son la base para las soluciones a problemas comunes. o Conjunto de recomendaciones. o Pieza de conocimiento: problema, contexto, solución, ventajas, desventajas, .. Pretensiones  Reutilizar la experiencia  Formar un vocabulario común  Estandarizar el modo de realizar un diseño  Facilitar el aprendizaje a las nuevas generaciones
  5. 5. o Son un punto de partida, no un destino. o No están bien o mal, son más útiles o menos útiles. o No son una solución en sí misma. o No son dogmas. o Son producto de la experiencia. A tener en cuenta www.flickr.com/photos/hanspoo/3658287658
  6. 6. ÁMBITOS DE APLICACIÓN  Gran éxito en el desarrollo de software Patrones de diseño de interfaces de usuario o Intentan definir las mejores formas de construir interfaces para la interacción hombre- computadora. o Buscan la reutilización de interfaces eficaces y un manejo óptimo de recursos. Haciendo más eficaz el consumo del tiempo en diseño.
  7. 7. REGISTRO DE CUENTA
  8. 8. REGISTRO DE CUENTA Problema Se quiere conocer al usuario Usos  Proteger el acceso al sitio.  La información a mostrar depende de quién es el usuario. • Ubicación geográfica, zona horaria, edad, intereses, interacciones anteriores, etc.
  9. 9. Solución Permitir al usuario registrar una cuenta en el sitio web para recordar sus detalles y mostrarle contenidos personalizados. Razón fundamental  Saber quién usa el sistema  Saber la frecuencia de visita  Se sabe que hacen en el sitio web  Se podrían diferenciar precios, contenidos, etc.  Puede ofrecer algo diferente a usuarios habituales  Almacenar más información para usarlo después REGISTRO DE CUENTA
  10. 10. • Prefieren el anonimato. • Cada campo es un impedimento capaz de provocar abandono. • Completar es desagradable Formularios en la web, recomendaciones generales de diseño http://www.alzado.org/articulo.php?id_art=50 Preferimos el anonimato
  11. 11.  Solo pida información absolutamente necesaria  Infiera información  Pida datos una sola vez  Trate de reutilizar campos  Agrupe campos lógicamente. Aconsejable los obligatorios primero  Libera la carga visual No tenemos tiempo http://www.flickr.com/photos/beinghumanforever/8229951883
  12. 12. Recomendaciones El botón de registro debe ser claro y llamativo.  Ubicar el botón en lugares clave.
  13. 13.  Proporciona retroalimentación al usuario.  Retroalimente sobre disponibilidad de usuario instantáneamente.  Proporcione un medidor de seguridad de contraseña.  La fortaleza de la contraseña, depende de la necesidad de protección.
  14. 14. http://www.flickr.com/photos/65819195@N00/9131696836 Nunca hagas pensar a tu usuario Describa detalladamente como llenar el formulario. Redacte instrucciones en forma positiva. Usa lenguaje sencillo y claro. http://www.flickr.com/photos/ecogreentechco/5633655855
  15. 15. 1 2 3
  16. 16. 1 3 2
  17. 17. × Muchos campos × Diferentes idiomas × Obligatorios × Teléf. y celular × FEHLT? × 2 direcciones × No infiere postal × Agrupación Así No
  18. 18. REGISTRO LENTO
  19. 19. REGISTRO LENTO Problema El usuario quiere usar y probar el sitio sin registrarse formalmente. Usos  Navegación sin registro.  Registro es un gran paso para el usuario.  Probar y comparar con otras alternativas.  El registro involucra dinero.  No ejercer presión sobre el usuario.  Idea de tiempo.
  20. 20. Deja Interactuar al usuario
  21. 21. REGISTRO LENTO Solución o Permita que interactúe con el sistema y posponga el registro. o Versión ligera – carros de compra. o Versión pesada – crear una cuenta anónima. Razón fundamental  Incentiva para que te den sus datos.  El servicio debe valer la pena.  Ofréceles protección y seguridad.
  22. 22. Jamendo.com
  23. 23. http://spanish.jotform.com/
  24. 24. VOTAR PARA PROMOVER
  25. 25. VOTAR PARA PROMOVER Problema El usuario quiere promover un contenido para ayudar a decidir cual es mejor. Usos  Los usuarios eligen democráticamente la calidad.  Confianza en la subjetividad del usuario.  Gran comunidad.
  26. 26. VOTAR PARA PROMOVER Solución o Mecanismo de votación • Votación, historial y posterior cambio. • Retroalimente. o Mostrar los números • Popularidad, comparación. o Resuma los populares o Favorezca los populares
  27. 27. VOTAR PARA PROMOVER Razón fundamental  Comunidad participativa  Potente detector de contenidos populares  Potente promovedor de contenidos recientes  Evita contratar revisores profesionales
  28. 28. VOTAR PARA PROMOVER A tener en cuenta o El usuario es el centro, pros y contras. o Opinión subjetiva de calidad. o Popularidad = Calidad ? o Medidas contra el mal uso • Limita el numero de votos. • Atento a la actividad maliciosa y al mal humor. • Votos con diferente valor.
  29. 29. La multitud no tiene sabiduría ¿Sabiduría de las multitudes? o Basan su voto a partir de otros. o La comunicación entre la multitud afecta el juicio cualitativo. La multitud no tiene Sabiduría.
  30. 30. Amazon.com
  31. 31. votanoticias.com
  32. 32. RECORDAR
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×