Este documento resume la evolución de la web social desde los años 30 hasta la actualidad, destacando hitos como el nacimiento de plataformas pioneras como Blogger, Wikipedia, Flickr y redes sociales como LinkedIn, MySpace y Facebook. Asimismo, analiza conceptos clave como objetos sociales, redes sociales, servicios y datos abiertos que han permitido el desarrollo de nuevos modelos de negocio basados en publicidad, cuotas de suscripción y servicios. Por último, ofrece consejos para el diseño centrado en el usuario y la iter

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. La Coctelera

3. La Comunidad El País

4. MTV.es

5. ADN.es

7. Una historia

8. 30’s Vannevar Bush

10. 50’s Eugene Garfield

11. 60’s Ted Nelson

13. 60’s Doug Engelbart

15. 80’s Microsoft

16. 90’s Tim Berners Lee

23. Terra

24. Geocities

28. Geoffrey Moore’s Adoption Curve. Adaptación Don Norman: http://www.jnd.org

31. 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

32. Crash Puntocom
Google IPO
19 ago 2004
Netscape IPO
9 ago 1995
Crisis y huída de recursos del sector

33. CRISIS.COM

34. Estándares Web

36. Blogs, RSS

37. Blogger

38. Wilkipedia

39. 19 de agosto 2004
IPO de Google

40. 2002 - David Sifry
Emprendedor Open
Source
¡Millones de blogs ahí
fuera! Alguno tiene que
ser interesante!
http://www.flickr.com/photos/thomashawk/396470587/

41. Technorati

44. 2004 - Joshua Schachter
Un programador de
Morgan Stanley, NY
Publica sus enlaces en un
servidor de internet
http://www.flickr.com/photos/laughingsquid/260374290/

45. del.icio.us

46. 2002 - Stewart Butterfield, Catherina
Fake
Pareja de Vancouver
prepara un video juego
online.
Fuente: Wikipedia

49. 2004 - Kevin Rose
Programador reconvertido
a presentador de
televisión.
Busca un experimento
para que los
espectadores participen
en su programa.
Fuente: Wikipedia

50. Digg.com

51. Digg.com 2008

52. 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.

53. Audioscrobbler, Last.fm

54. 2005 - Chad Hurley, Steve Chen, Jawed
Karim
Empleados de Paypal
Acuden a una fiesta en
San Francisco donde
graban videos...
Fuente: Wikipedia

57. 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.

58. Yahoo Maps. Teleatlas

59. Basecamp

60. Ruby on Rails

63. 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.

65. Panoramio

66. Google y Yahoo salen de compras

67. Web 2.0
Institucionalización de la conversación

69. “Superhéroes” digitales

71. Google
cómprame

73. 4.0
Puf!
3.0
Puf!
2.0
Puf!
1.0
Puf!

74. Trulia.com

75. Flickr Graph

76. Programmableweb

77. Actividad social
Web como plataforma de participación

78. Tagging
El usuario como creador de significado

79. Amgem California Tour

80. Digg Labs

81. En la web todo es diseño...
TODO

82. Proyectos “laterales”
Menos personas
Menos tiempo
Menos presupuesto

84. Convertir debilidades en fortalezas
Sun Tzu. El Arte de la Guerra

85. Proyectos pequeños y
centrados

86. Fuente: Ankaj, Gopal. Yahoo

87. Haz cosas que la gente quiera usar...
¡Te ayudarán!

88. Datos abiertos: RSS,APIs, Web Services,

89. ¿Televisión?

90. Uso creativo de tecnologías ya
disponibles:
AJAX, microformatos, REST...

91. Comunidades de desarrolladores

92. Diseño centrado y valiente
Comienza por un problema cercano...

93. 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

95. 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

97. Diseño y usuarios
“ “La gente no sabe lo que quiere hasta que no
lo ve”
Steve Jobs

100. Aprende y crece con tus usuarios

101. Cómo evolucionar...

102. 1996

103. 1997

104. 1998

105. Texto
1999

106. 2000

107. 2001

108. 2002

109. 2003

110. 2004

111. 2005

112. Hoy...

113. Todo en uno...

114. 1998

115. 1999

116. 2001

117. 2002

118. 2003

119. 2004

120. 2005

121. 2007

122. Hoy...

123. Hacer una cosa y bien

124. Cuidado con la tecnología!

129. Código MSIE sucio y pesado, no
accesibles, URLs tecnodependientes,
dificultan colaboración, no evolutivos
devoradores de recursos, falsa
escalabilidad...

130. ¡Oblígales a cumplir con los estándares!
¡En serio!

131. Cuidado con la metodología!
Que me lea... qué?!

132. Los usuarios son
tontos
Desarrollador: exige soporte de usabilidad y diseño

134. La web social

135. Creación de espacios de información
que generen valor a partir de la
interacción egoísta de sus usuarios

136. de la jerarquía a la red
Lectura Conversacional

137. adactio.com/extras/lifestream

138. 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

139. Objetos sociales
Aquellos que sirven a las personas para
hablar y establecer conversaciones en
torno a ellos.

140. 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

141. 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

142. 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

144. 0 vis tas
.8 60 .86
67

146. ¿Y el modelo de negocio?
O cómo no morir de éxito

147. Basecamp - 37 Signals

148. 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

149. 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

150. 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

151. España
“proyectos laterales”

152. Menéame

153. nvivo.es

154. Panoramio

155. La Coctelera

156. Unvlog.com

157. Piensa...
Ninguno de estos proyectos se hubiera
hecho si se hubiera pensado en el
dinero desde el comienzo.

158. ¿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.

159. ¡Disfruta del viaje!

161. Fotos: Luis Villa
www.flickr.com/photos/maguisso
Contacto
blog > www.grancomo.com
lvilla@grancomo.com