Diseño Escalable UP 2009
Upcoming SlideShare
Loading in...5
×
 

Like this? Share it with your network

Share

Diseño Escalable UP 2009

on

  • 616 views

 

Statistics

Views

Total Views
616
Views on SlideShare
616
Embed Views
0

Actions

Likes
0
Downloads
4
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Diseño Escalable UP 2009 Presentation Transcript

  • 1. Diseño Escalable Betina García Café Binario - betina@cafebinario.com MEMBER
  • 2. Una historia conocida Cuando ya creíamos terminarlo renace con nuevos cambios. “Design is never done” “El diseño nunca está terminado” (Bruce Sterling) Concepto: Los sitios no deben pensarse como productos finales. página 1
  • 3. ¿Cómo evitamos esta frustración de pelear contra nuestro propio trabajo? Diseño Escalable Una posible respuesta a considerar “Diseñar pensando en el futuro” página 2
  • 4. ¿Qué tener en cuenta al diseñar nuestro sitio? Diseñar pensando en la escalabilidad. Comprender los distintos roles en el proceso de diseño web: metodología esencial de trabajo. Conocer los elementos que permiten adaptar el diseño a nuevos contenidos. página 3
  • 5. Diseñar pensando en la escalabilidad El plan de negocio puede escalar. Los contenidos crecen constantemente. Las empresas utilizan contenidos dinámicos. (ejemplo: web social). Anticipar dónde y cómo crecerá el contenido a futuro y estar atentos a la integración con nuevas tecnologías y sus implicancias (web 2.0, redes sociales, blogs, wikis, Google Maps, etc). página 4
  • 6. Diseñar pensando en la escalabilidad ejemplos Bloggin (Bloggers) Fotos (Flickr) Marcadores (Del icio.us) web 2.0 Agregadores (Bloglines) Sindicación (Feedburner) Mapas API (Google Maps) Audio (Odeo) Búsqueda Blogs (Technorati) Correo etiquetado (Gmail) Autoría masiva (Wikipedia) Retroalimentación (Ebay) Opinión Clientes (Amazon) concepto aplicación operaciones tecnología Plataforma Microcontenido Publicación personal CSS Web Lectura/Escritura Usuarios individuales Redes Sociales AJAX Controlado por usuarios Colaboración Cliente a cliente RSS/ATOM Conversación Aplicación a medida API P2P HTML/XHTML OPML página 5
  • 7. Diseñar pensando en la escalabilidad Contenidos que escalan estructuras textos imágenes página 6
  • 8. Diseñar pensando en la escalabilidad estructuras página 7
  • 9. Diseñar pensando en la escalabilidad textos página 8
  • 10. Diseñar pensando en la escalabilidad imágenes página 9
  • 11. Diseñar pensando en la escalabilidad Resumen: Comprender que la web es una parte del negocio de la empresa y es muy probable que éste crezca acompañando el crecimiento de la misma (nuevos mercados, ampliación del negocio, etc). Prever contenidos dinámicos: Anticipar dónde y como crecerá el contenido en el futuro. Atender a posibles contenido de comunidades de usuarios, Web 2.0, redes sociales, blogs, wikis, etc. y nuevas tecnologias (Google Maps, etc) página 10
  • 12. Distintos roles en el proceso de diseño web Disciplinas Diseño de experiencia de usuario Diseño de Interacción Estándares Principios Interacción Diseño de interfaces Escalabilidad Desarrollo página 11
  • 13. Distintos roles en el proceso de diseño web Roles Consultor UX / Análisis Cualitativo Consultor IXD / Análisis Cuantitativo Estándares Principios Interacción Diseñador / Maquetador Escalabilidad Desarrollador página 12
  • 14. Conocer los elementos que permiten adaptar el diseño a nuevos contenidos. Estructuras de pantallas. Estructuras de interfaz de usuario. Componentes. página 13
  • 15. Estructuras de pantallas Una buena estructura Navegación del contexto pensada desde la escalabilidad Datos de secciones Herramientas del sitio ayuda mucho a la hora de su crecimiento. Mensajes (opcional) (Así como un arquitecto decide en su plano cómo va a ser la cocina y cuál va a ser el lugar Filtros donde va a instalar el nuevo horno) Datos página 14
  • 16. Estructuras de pantallas página 15
  • 17. Estructuras de pantallas página 16
  • 18. Estructuras de interfaz de usuario Ejemplo de lista horizontal que no escala bien en otros idiomas. Se aconseja para estos casos, utilizar listas desplegables o listas verticales si los items debieran estar visibles. Nota: El diseñador debe evaluar la elección de la no escala bien estructura de acuerdo a la necesidad (o no) de escalabilidad. página 17
  • 19. Componentes Probar su funcionamiento con distintos contenidos Si bien el componente escala bien, debemos probar cómo se adapta a su contenido. La última figura muestra cómo debería escalar en caso de tener un ítem con tres palabras. página 18
  • 20. Componentes Resumen Usar estructuras de pantallas nos permite estar preparados para futuros cambios. Trabajar con una interfaz de usuario flexible permite que el contenido se adapte a las nuevas necesidades. Estudiar y conocer qué componentes nos ayudan a que los contenidos dinámicos escalen. página 19
  • 21. Diseñar pensando en el futuro nos obliga a considerar la escalabilidad como una variable más de nuestro sitio. página 20
  • 22. ¡Muchas Gracias! Betina García betina@cafebinario.com www.cafebinario.com MEMBER