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

1. PATRONES DE
DISEÑO WEB
Alex Naupay
El INICIO DEL CAMINO A LA SOLUCIÓN

2. Agenda
Patrones de diseño
Registro de cuenta
Registro Lento (Lazy registration)
Votar para promover
Obtención de información

3. PATRÓN
DE DISEÑO

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. 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. Á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. REGISTRO
DE CUENTA

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. 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. • 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.  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. Recomendaciones El botón de registro debe ser
claro y llamativo.
 Ubicar el botón en lugares clave.

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. 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. 1
2
3

16. 1
3
2

17. × Muchos campos
× Diferentes
idiomas
× Obligatorios
× Teléf. y celular
× FEHLT?
× 2 direcciones
× No infiere postal
× Agrupación
Así No

18. REGISTRO
LENTO

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. Deja Interactuar
al usuario

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. Jamendo.com

23. http://spanish.jotform.com/

24. VOTAR PARA
PROMOVER

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. 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. VOTAR PARA PROMOVER
Razón fundamental
 Comunidad participativa
 Potente detector de contenidos populares
 Potente promovedor de contenidos
recientes
 Evita contratar revisores profesionales

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. 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. Amazon.com

31. votanoticias.com

33. RECORDAR