Diseño para la Web Social
De la idea al proyecto

Master y Doctorado en Ingeniería Web
Universidad de Oviedo

9 mayo 2008
...
La Coctelera
La Comunidad El País
MTV.es
ADN.es
Una historia
30’s Vannevar Bush
50’s Eugene Garfield
60’s Ted Nelson
60’s Doug Engelbart
80’s Microsoft
90’s Tim Berners Lee
Terra
Geocities
Geoffrey Moore’s Adoption Curve. Adaptación Don Norman: http://www.jnd.org
Puf!


Visibilidad




                                                                                  Madurez
         ...
Crash Puntocom




                                  Google IPO
                                  19 ago 2004
Netscape IPO...
CRISIS.COM
Estándares Web
Blogs, RSS
Blogger
Wilkipedia
19 de agosto 2004
IPO de Google
2002 - David Sifry


                     Emprendedor Open
                     Source
                     ¡Millones de b...
Technorati
2004 - Joshua Schachter


                    Un programador de
                    Morgan Stanley, NY
                   ...
del.icio.us
2002 - Stewart Butterfield, Catherina
Fake

                     Pareja de Vancouver
                     prepara un video ...
2004 - Kevin Rose


                    Programador reconvertido
                    a presentador de
                    ...
Digg.com
Digg.com 2008
2002 - RC


            Un estudiante de
            informática la Universidad
            de Southhampton
            Pl...
Audioscrobbler, Last.fm
2005 - Chad Hurley, Steve Chen, Jawed
Karim

                    Empleados de Paypal
                    Acuden a una fiest...
2001 - Jason Fried


                     Empresario-diseñador en
                     Chicago
                     Busca ...
Yahoo Maps. Teleatlas
Basecamp
Ruby on Rails
2005 - Eduardo Manchón, Joaquín
Cuenca

                   Dos españoles.
                   Uno consultor de
            ...
Panoramio
Google y Yahoo salen de compras
Web 2.0
Institucionalización de la conversación
“Superhéroes” digitales
Google
cómprame
4.0

                     Puf!


              3.0

              Puf!


       2.0

       Puf!


1.0

Puf!
Trulia.com
Flickr Graph
Programmableweb
Actividad social
Web como plataforma de participación
Tagging
El usuario como creador de significado
Amgem California Tour
Digg Labs
En la web todo es diseño...
          TODO
Proyectos “laterales”
      Menos personas
       Menos tiempo
     Menos presupuesto
Convertir debilidades en fortalezas
                     Sun Tzu. El Arte de la Guerra
Proyectos pequeños y
     centrados
Fuente: Ankaj, Gopal. Yahoo
Haz cosas que la gente quiera usar...
          ¡Te ayudarán!
Datos abiertos: RSS,APIs, Web Services,
¿Televisión?
Uso creativo de tecnologías ya
         disponibles:
AJAX, microformatos, REST...
Comunidades de desarrolladores
Diseño centrado y valiente
Comienza por un problema cercano...
Diseño y usuarios

“   “Si hace años le hubiera preguntado a la
    gente que quería para desplazarse me
    hubieran resp...
Diseño y usuarios

“   “Si le preguntas al público que creen que
    necesitarán, siempre estarás detrás de todos.
    Nun...
Diseño y usuarios

“   “La gente no sabe lo que quiere hasta que no
    lo ve”
                                        Ste...
Aprende y crece con tus usuarios
Cómo evolucionar...
1996
1997
1998
Texto




        1999
2000
2001
2002
2003
2004
2005
Hoy...
Todo en uno...
1998
1999
2001
2002
2003
2004
2005
2007
Hoy...
Hacer una cosa y bien
Cuidado con la tecnología!
Código MSIE sucio y pesado, no
accesibles, URLs tecnodependientes,
dificultan colaboración, no evolutivos
   devoradores de...
¡Oblígales a cumplir con los estándares!




              ¡En serio!
Cuidado con la metodología!


                    Que me lea... qué?!
Los usuarios son
                                     tontos




Desarrollador: exige soporte de usabilidad y diseño
La web social
Creación de espacios de información
    que generen valor a partir de la
 interacción egoísta de sus usuarios
de la jerarquía      a la red




    Lectura       Conversacional
adactio.com/extras/lifestream
Redes        Objetos          Geo
Sociales      sociales       Servicios


 Personas      Digitales /    Cartografía
     ...
Objetos sociales
Aquellos que sirven a las personas para
hablar y establecer conversaciones en
torno a ellos.
Algo de que hablar...
                                             Música
                                              My...
Sitio                                                               Widgets

 Nombre del sitio


 Navegación secciones

 C...
Mecánica de participación




?
    ¿Propuesta de valor?
                                                                 ...
0 vis tas
     .8 60 .86
67
¿Y el modelo de negocio?
  O cómo no morir de éxito
Basecamp - 37 Signals
Infraestructura                             Mercado
    Personal
                  Producto / Servicio     Usuarios/Client...
Beneficios



 1. Publicidad Technorati, Digg, menéame
 2. Cuentas “Freemium” Flickr, Last.fm, Linkedin
 3. Servicios intel...
Open Source                                                 Software
                                                     ...
España
“proyectos laterales”
Menéame
nvivo.es
Panoramio
La Coctelera
Unvlog.com
Piensa...

Ninguno de estos proyectos se hubiera
  hecho si se hubiera pensado en el
     dinero desde el comienzo.
¿Te apasiona esto?

 1. Tu carrera profesional depende de tí, no de las empresas.
 2. Busca proyectos laterales, si no sal...
¡Disfruta del viaje!
Fotos: Luis Villa
www.flickr.com/photos/maguisso

Contacto
blog > www.grancomo.com
lvilla@grancomo.com
Diseño para la Web Social - de la idea al proyecto
Diseño para la Web Social - de la idea al proyecto
Diseño para la Web Social - de la idea al proyecto
Diseño para la Web Social - de la idea al proyecto
Diseño para la Web Social - de la idea al proyecto
Diseño para la Web Social - de la idea al proyecto
Diseño para la Web Social - de la idea al proyecto
Diseño para la Web Social - de la idea al proyecto
Diseño para la Web Social - de la idea al proyecto
Diseño para la Web Social - de la idea al proyecto
Diseño para la Web Social - de la idea al proyecto
Diseño para la Web Social - de la idea al proyecto
Diseño para la Web Social - de la idea al proyecto
Diseño para la Web Social - de la idea al proyecto
Diseño para la Web Social - de la idea al proyecto
Diseño para la Web Social - de la idea al proyecto
Diseño para la Web Social - de la idea al proyecto
Diseño para la Web Social - de la idea al proyecto
Diseño para la Web Social - de la idea al proyecto
Diseño para la Web Social - de la idea al proyecto
Diseño para la Web Social - de la idea al proyecto
Diseño para la Web Social - de la idea al proyecto
Diseño para la Web Social - de la idea al proyecto
Diseño para la Web Social - de la idea al proyecto
Diseño para la Web Social - de la idea al proyecto
Diseño para la Web Social - de la idea al proyecto
Diseño para la Web Social - de la idea al proyecto
Diseño para la Web Social - de la idea al proyecto
Diseño para la Web Social - de la idea al proyecto
Diseño para la Web Social - de la idea al proyecto
Diseño para la Web Social - de la idea al proyecto
Diseño para la Web Social - de la idea al proyecto
Diseño para la Web Social - de la idea al proyecto
Diseño para la Web Social - de la idea al proyecto
Diseño para la Web Social - de la idea al proyecto
Diseño para la Web Social - de la idea al proyecto
Diseño para la Web Social - de la idea al proyecto
Diseño para la Web Social - de la idea al proyecto
Diseño para la Web Social - de la idea al proyecto
Diseño para la Web Social - de la idea al proyecto
Diseño para la Web Social - de la idea al proyecto
Upcoming SlideShare
Loading in …5
×

Diseño para la Web Social - de la idea al proyecto

6,557 views
6,478 views

Published on

Published in: Technology
0 Comments
13 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
6,557
On SlideShare
0
From Embeds
0
Number of Embeds
6
Actions
Shares
0
Downloads
180
Comments
0
Likes
13
Embeds 0
No embeds

No notes for slide

Diseño para la Web Social - de la idea al proyecto

  1. 1. Diseño para la Web Social De la idea al proyecto Master y Doctorado en Ingeniería Web Universidad de Oviedo 9 mayo 2008 Luis Villa lvilla@grancomo.com
  2. 2. La Coctelera
  3. 3. La Comunidad El País
  4. 4. MTV.es
  5. 5. ADN.es
  6. 6. Una historia
  7. 7. 30’s Vannevar Bush
  8. 8. 50’s Eugene Garfield
  9. 9. 60’s Ted Nelson
  10. 10. 60’s Doug Engelbart
  11. 11. 80’s Microsoft
  12. 12. 90’s Tim Berners Lee
  13. 13. Terra
  14. 14. Geocities
  15. 15. Geoffrey Moore’s Adoption Curve. Adaptación Don Norman: http://www.jnd.org
  16. 16. Puf! Visibilidad Madurez nte na as la la la de a o e l vas de de de ad nc o d ti eta n era ón eta id se lógic Pic pecta un lusió ad inaci es uctiv De no C si L M d c Ex adas m Te De Ilu Pro Infl Fuente: Curva de Gartner. Gartner
  17. 17. Crash Puntocom Google IPO 19 ago 2004 Netscape IPO 9 ago 1995 Crisis y huída de recursos del sector
  18. 18. CRISIS.COM
  19. 19. Estándares Web
  20. 20. Blogs, RSS
  21. 21. Blogger
  22. 22. Wilkipedia
  23. 23. 19 de agosto 2004 IPO de Google
  24. 24. 2002 - David Sifry Emprendedor Open Source ¡Millones de blogs ahí fuera! Alguno tiene que ser interesante! http://www.flickr.com/photos/thomashawk/396470587/
  25. 25. Technorati
  26. 26. 2004 - Joshua Schachter Un programador de Morgan Stanley, NY Publica sus enlaces en un servidor de internet http://www.flickr.com/photos/laughingsquid/260374290/
  27. 27. del.icio.us
  28. 28. 2002 - Stewart Butterfield, Catherina Fake Pareja de Vancouver prepara un video juego online. Fuente: Wikipedia
  29. 29. 2004 - Kevin Rose Programador reconvertido a presentador de televisión. Busca un experimento para que los espectadores participen en su programa. Fuente: Wikipedia
  30. 30. Digg.com
  31. 31. Digg.com 2008
  32. 32. 2002 - RC Un estudiante de informática la Universidad de Southhampton Plugin de tracking de música Programadores alemanes y austriacos crean una Radio Online y comunidad de música.
  33. 33. Audioscrobbler, Last.fm
  34. 34. 2005 - Chad Hurley, Steve Chen, Jawed Karim Empleados de Paypal Acuden a una fiesta en San Francisco donde graban videos... Fuente: Wikipedia
  35. 35. 2001 - Jason Fried Empresario-diseñador en Chicago Busca una herramienta de gestión de proyectos Estudiante de Copehnague Se ofrece como programador Límite: 10 horas/semana.
  36. 36. Yahoo Maps. Teleatlas
  37. 37. Basecamp
  38. 38. Ruby on Rails
  39. 39. 2005 - Eduardo Manchón, Joaquín Cuenca Dos españoles. Uno consultor de usabilidad y aficionado a la fotografía establecido en Alemania. Otro, hacker, programador ubicado en Francia.
  40. 40. Panoramio
  41. 41. Google y Yahoo salen de compras
  42. 42. Web 2.0 Institucionalización de la conversación
  43. 43. “Superhéroes” digitales
  44. 44. Google cómprame
  45. 45. 4.0 Puf! 3.0 Puf! 2.0 Puf! 1.0 Puf!
  46. 46. Trulia.com
  47. 47. Flickr Graph
  48. 48. Programmableweb
  49. 49. Actividad social Web como plataforma de participación
  50. 50. Tagging El usuario como creador de significado
  51. 51. Amgem California Tour
  52. 52. Digg Labs
  53. 53. En la web todo es diseño... TODO
  54. 54. Proyectos “laterales” Menos personas Menos tiempo Menos presupuesto
  55. 55. Convertir debilidades en fortalezas Sun Tzu. El Arte de la Guerra
  56. 56. Proyectos pequeños y centrados
  57. 57. Fuente: Ankaj, Gopal. Yahoo
  58. 58. Haz cosas que la gente quiera usar... ¡Te ayudarán!
  59. 59. Datos abiertos: RSS,APIs, Web Services,
  60. 60. ¿Televisión?
  61. 61. Uso creativo de tecnologías ya disponibles: AJAX, microformatos, REST...
  62. 62. Comunidades de desarrolladores
  63. 63. Diseño centrado y valiente Comienza por un problema cercano...
  64. 64. Diseño y usuarios “ “Si hace años le hubiera preguntado a la gente que quería para desplazarse me hubieran respondido,... caballos más rápidos” Henry Ford
  65. 65. Diseño y usuarios “ “Si le preguntas al público que creen que necesitarán, siempre estarás detrás de todos. Nunca avanzarás a no ser que pienses diez años en adelante y crees un mercado para los productos que crees que el mercado necesitará entonces” Morita, SONY
  66. 66. Diseño y usuarios “ “La gente no sabe lo que quiere hasta que no lo ve” Steve Jobs
  67. 67. Aprende y crece con tus usuarios
  68. 68. Cómo evolucionar...
  69. 69. 1996
  70. 70. 1997
  71. 71. 1998
  72. 72. Texto 1999
  73. 73. 2000
  74. 74. 2001
  75. 75. 2002
  76. 76. 2003
  77. 77. 2004
  78. 78. 2005
  79. 79. Hoy...
  80. 80. Todo en uno...
  81. 81. 1998
  82. 82. 1999
  83. 83. 2001
  84. 84. 2002
  85. 85. 2003
  86. 86. 2004
  87. 87. 2005
  88. 88. 2007
  89. 89. Hoy...
  90. 90. Hacer una cosa y bien
  91. 91. Cuidado con la tecnología!
  92. 92. Código MSIE sucio y pesado, no accesibles, URLs tecnodependientes, dificultan colaboración, no evolutivos devoradores de recursos, falsa escalabilidad...
  93. 93. ¡Oblígales a cumplir con los estándares! ¡En serio!
  94. 94. Cuidado con la metodología! Que me lea... qué?!
  95. 95. Los usuarios son tontos Desarrollador: exige soporte de usabilidad y diseño
  96. 96. La web social
  97. 97. Creación de espacios de información que generen valor a partir de la interacción egoísta de sus usuarios
  98. 98. de la jerarquía a la red Lectura Conversacional
  99. 99. adactio.com/extras/lifestream
  100. 100. Redes Objetos Geo Sociales sociales Servicios Personas Digitales / Cartografía físicos Linkedin GMaps MySpace del.icio.us Yahoo Maps Facebook Dopplr OpenStreet Map Bebo Upcoming.org Friendster Last.fm Orkut Plazes Odeo 11870 Flickr Jaiku
  101. 101. Objetos sociales Aquellos que sirven a las personas para hablar y establecer conversaciones en torno a ellos.
  102. 102. Algo de que hablar... Música MySpace Fotos Last.fm Status Flickr Pandora Twitter Photobucket Jaiku Pownce Comentar Compartir Videos Ver Favoritos del.icio.us Youtube ma.gnolia.com Vimeo Blip.tv Unvlog.com Puntuar Recomendar Mascotas “Celebrities” Dogster Lugares Techcrunch Catster 11870 Plazes
  103. 103. Sitio Widgets Nombre del sitio Navegación secciones Contenido Autor Perfil, contacto Post Foto Archivos Fecha / temas Vídeo Tags / datos Acciones sobre objeto Compartir, guardar, puntuar... Comentarios / participación Red/grupos RSS Widgets Actividad en otros sites Música, fotos, redes
  104. 104. Mecánica de participación ? ¿Propuesta de valor? Grupos Líderes Expertos Contenido Registro Barreras de entrada Contenido ¿mejorado? Filtros Inteligencia colectiva Perfil Creación Comentar Consumir Identidad Compartir Etiquetar Filtrar Contactos Críticar Descubrir Intereses Valorar Guardar como contacto
  105. 105. 0 vis tas .8 60 .86 67
  106. 106. ¿Y el modelo de negocio? O cómo no morir de éxito
  107. 107. Basecamp - 37 Signals
  108. 108. Infraestructura Mercado Personal Producto / Servicio Usuarios/Clientes Procesos Entrega = Interfaz Competidores Tecnología Márketing Partners Costes Ingresos Personal Publicidad Instalaciones Resultado Cuotas Hosting Ingresos - Costes Servicios Hardware Intermediación Licencias Ventas
  109. 109. Beneficios 1. Publicidad Technorati, Digg, menéame 2. Cuentas “Freemium” Flickr, Last.fm, Linkedin 3. Servicios inteligencia Technorati, Trulia 4. Mejora lateral de otros servicios Last.fm, del.icio.us, Amazon... 5. Experimentación e innovación Digg Labs, Twitter, del.icio.us
  110. 110. Open Source Software Comerciantes Productos Adaware-se Software Wordpress Netflix Wikimedia iTunes Google Docs Movable Type Amazon Intermediación Pandora Proveedor servicios-datos Negocio Gmail Google Adsense Match Skype Servicio VOX Twitter Aplicación Basecamp eBay Technorati YouTube last.fm Linkedin Revver Blip.tv digg La Coctelera Ning Squidoo del.icio.us Contenido abierto Flickr Newsvine Menéame Redes Sociales Blogger Creative Commons Facebook Wikipedia MySpace Contenidos Musicbrainz Publicidad Gratuito Pago Libre Uso Libre Freemium Pago Libre Pago Donaciones Pago por Cuenta Pro servicios Modelo de Ingresos Fuente (Adaptado) L. Grivet Web Business Models 2.0
  111. 111. España “proyectos laterales”
  112. 112. Menéame
  113. 113. nvivo.es
  114. 114. Panoramio
  115. 115. La Coctelera
  116. 116. Unvlog.com
  117. 117. Piensa... Ninguno de estos proyectos se hubiera hecho si se hubiera pensado en el dinero desde el comienzo.
  118. 118. ¿Te apasiona esto? 1. Tu carrera profesional depende de tí, no de las empresas. 2. Busca proyectos laterales, si no sale bien aprenderás mucho. 3. Busca una idea: detecta un problema o necesidad y pégate a él. 4. Haz las cosas bien: tus usuarios son lo primero 5. Mantén la simplicidad o haz sencillo lo complejo. 6. No te ciegues con la tecnología. 7. Siempre en evolución: itera, itera... 8. Busca colegas, relaciónate, intercambia experiencias, aprende.
  119. 119. ¡Disfruta del viaje!
  120. 120. Fotos: Luis Villa www.flickr.com/photos/maguisso Contacto blog > www.grancomo.com lvilla@grancomo.com

×