Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

80
Tendencias de estilo en el Diseño Web: Un acercamiento a través del tiempo. Por: L.D.G. Víctor Luis Juárez Estrada Especialista en Diseño Interactivo

Transcript of Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

Page 1: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

Tendencias de estilo en el Diseño

Web:Un acercamiento a través del tiempo.

Por: L.D.G. Víctor Luis Juárez Estrada Especialista en Diseño

Interactivo

Page 2: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

El origen: 1991

¿Quién comenzó todo ésto?

Page 3: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

Tim Berners-LeeCreador de la WorldWideWeb

Fundador de la W3C

El origen: 1991

Fuente: http://www.w3.org/People/Berners-Lee/Longer.html

Page 4: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

Computador NeXTApple Inc.

El origen: 1991

Fuente: http://www.w3.org/People/Berners-Lee/Longer.html

Page 5: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

La primer página Web del Mundo

El origen: 1991

Fuente: http://www.w3.org/History/19921103-hypertext/hypertext/WWW/TheProject.html

Page 6: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

1993

¡Vengan, vengan!(Encontré algo que les va a gustar)

Page 7: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

Se difunde la WWW.

1993

Fuente: http://www94.web.cern.ch/WWW94/Welcome.html

Page 8: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

1993

El primer navegador.

Fuente: http://home.mcom.com/home/welcome.html

Page 9: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

1994-1995

Ésto no va a durar mucho… No sirve para nada.

Page 10: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

1994-1995

Yahoo!

Page 11: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

1994

Page 12: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

1995

Page 13: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

1996

Page 14: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

1998

Page 15: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

2000

Page 16: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

2002

Page 17: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

2003

Page 18: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

2005

Page 19: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

2006

Page 20: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

2013

Page 21: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

1994-1995

¡Está bueno!Quiero aprender a hacer páginas web.

Page 22: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

1994-1995

La primer guía para Webmasters.

Fuente: http://www.netside.net/boba/webmasters.html

Page 23: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

1994-1995

Tu Universidad on-line (Hungría).

Fuente: http://epa.oszk.hu/00000/00019/00059/

Page 24: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

1994-1995

Diseño Web “avanzado”.

Fuente: http://www.3riversstadium.com/index2.html

Page 25: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

1996-1997

¡Hola!¿Hay alguien más ahí?

Page 26: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

1996-1997

Antes…

Fuente: http://www.google.com/about/company/history/

Page 27: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

1996-1997

Después…

Fuente: http://www.google.com/about/company/history/

Page 28: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

1996-1997

Google!

Fuente: http://www.google.com/about/company/history/

Page 29: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

1996-1997

Los grandes mitos on-line.

Fuente: http://www.princeton.edu/~accion/chupa.html

Page 30: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

1996-1997

Explotando Photoshop al máximo.

Fuente: http://www.cchaven.com/

Page 31: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

1996-1997

Explorando la composición.

Fuente: http://www2.warnerbros.com/spacejam/movie/jam.htm

Page 32: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

1996-1997

El auge de los GIF’s animados.

Fuente: http://www.snowcrest.net/kitty/hpages/index.html

Page 33: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

1998-1999

Los pionerosAquellos que sólo los conocen en su casa y en un Cyber-Café.

Page 34: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

1998-1999

Composición y Jerarquía.

Fuente: http://deniro.jvlnet.com/

Page 35: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

1998-1999

El PEOR navegador de la Historia.

Fuente: http://toastytech.com/evil/index.html

Page 36: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

1998-1999

Los efectos producidos porcomputadora comunican la vanguardia de todo tipo de tecnología.

La usabilidad yexperiencia del usuarioeran temas aúnimpensables.

Fuente: http://www.mipg.upenn.edu/~Vnews/

Page 37: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

1998-1999

El uso del color.

Fuente: http://www.randomhouse.com/features/iamjackiechan/

Page 38: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

1998-1999

El abuso en los elementos animados yausencia de composición y jerarquía.

Fuente: http://members.iinet.net.au/~rayis/pets.htm

Page 39: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

1998-1999

RESUMEN:

Al ser un campo emergente y en constante cambio, los Sitios en Internet eran creados por especialistas en áreas afinesa la Informática Administrativa oIngeniería en Sistemas.

El aprendizaje de los lenguajes de programación ha sido siempre un campo áspero para los profesionales del Diseño.

¿Qué hacían entonces los diseñadores?Dominaban el mundo editorial impreso.

Page 40: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

2000-2009

Está divertido…Hagámoslo útil.

Page 41: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

2000-2009

Estética y composición más cuidados.

Fuente: http://1997-2001.state.gov/

Page 42: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

2000-2009

Primeros intentos por mejorar la usabilidad ylectura de los contenidos.

Fuente: http://www.dogmark.net/indexint.html

Page 43: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

2000-2009

La creación de encabezados y seccionesdefindas ya es un “logro”.

Fuente: http://espn.go.com/wpb/wnba/statistics/index.html

Page 44: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

2000-2009

El mismo Portal en la actualidad (2013).

Fuente: http://sports.espn.go.com/sports/womenbb/index

Page 45: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

2000-2009

“INTERNET matará a las bibliotecas del mundo.”

Arquitectura de la información+

Estética+

Usabilidad+

HTML+CSS+FLASH(2005)

Page 46: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.
Page 47: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.
Page 48: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.
Page 49: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

Composición en Plataforma Flash.

Page 50: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

Composición en Plataforma Flash.

Page 51: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

Composición en Plataforma Flash.

Page 52: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

2000-2009

Me cuesta trabajo leer en Internet…

Usabilidad+

Experiencia del Usuario(2009)

Page 53: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.
Page 54: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.
Page 55: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.
Page 56: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.
Page 57: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.
Page 58: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.
Page 59: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

2010-2012

Diseño sobre tendencias de estilo(Objetivo: Impulsar la industria del Diseño Web)

o

Quiero un efectito padre…

Fuente: http://uxdesign.smashingmagazine.com/2012/03/15/symptoms-of-epidemic-web-design-trends/

Page 60: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

Puntadas.

Page 61: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

Bordes Zig-Zag.

Page 62: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

Cintas con horquilla.

Page 63: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

Texturas.

Page 64: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

Tipografía para Internet.

Page 65: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

Ilustración / Grabados del Siglo XIX

Page 66: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

Tonos pastel.

Page 67: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

Composiciones tipográficas en bloque.

Page 68: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

Logotipos circulares / Lettering.

Page 69: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

Skewomorphic / Texturas del mundo real.

Page 70: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

2012-2013…

Diseño Plano (Flat UI Design)El aburrimiento sobre las texturas y la falsa realidad virtual.

¿Quien dijo que el mundo NO era plano?

Page 71: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

Fuente: http://fltdsgn.com/

Page 72: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

Fuente: http://fltdsgn.com/

Page 73: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

2013…

Cualquier estilodemandado por la forma del dispositivo que lo contenga.

Realización de Sitios Web que respondan a los medios de comunicación (Diseño Web Responsivo).

El contenido sobresale del diseño.

Page 74: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

2013…

FUENTE: http://www.nngroup.com/articles/computer-screens-getting-bigger/

Page 75: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

2013…

FUENTE: http://corporateskills.co.uk/?p=627

Page 76: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

RESUMEN

“La red tiene aproximadamente un millón de millones de páginas. El cerebro humano tiene alrededor de 100,000 millonesde neuronas”,

escribe Kevin Kelly en su libro de 2010, Lo que quiere la tecnología (What Technology Wants).

FUENTE: http://mexico.cnn.com/tecnologia/2011/09/13/hay-mas-paginas-de-internet-que-neuronas-en-el-cerebro-humano

Page 77: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

RESUMEN

Puedes envejecer tratando de unificar el Diseño Web.

Page 78: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

Para una mayor referencia de los contenidos, consulta y haz click en:

Archivo Histórico de Sitios en Internet (1993-2010)

Los mejores 50 Sitios del 2009

Los mejores 50 Sitios del 2010

Los mejores Sitios en Flash de todo el tiempo

CSS Design Awards

Flash Websites Awards

Smashig Magazine (Revista especializada en Diseño Web)

Descarga:

Libros complementarios: http://leucorama.mx/descargas/libros.zip

Esta presentación: http://leucorama.mx/descargas/estilo-web.pptx

+REFERENCIAS

Page 79: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

Tendencias de estilo en el Diseño

Web:Un acercamiento a través del tiempo.

Page 80: Tendencias de estilo en el diseño web: Un acercamiento a través el tiempo.

<victor>Diseñador Web

</victor>

<email>[email protected],[email protected]

</email>

<facebook>Víctor Juárez

</facebook>

<twitter>@vicusdg

</twitter>

Para una mayor referencia de los contenidos, consulta: http://www.404pagefound.com/