Bocetos webs: Nuevo diseño de Digg

A este blog le gusta mucho publicar bocetos de sitios webs. Porque nos gusta conocer el proceso de creación de las páginas, los criterios elegidos, cómo deciden las prioridades de los elementos. Por eso festejamos cuando publican esos detalles de un proyecto, cualquiera sea. Hoy tenemos el caso de Digg. Ya en manos de sus nuevos dueños, el histórico sitio de contenido agregado va por una actualización importante.

En su blog explican que están trabajando en el nuevo diseño que busca llegar a todos los usuarios desde distintas vías, con diferentes formatos de contenido. Y tienen planeado salir con el nuevo sitio en los próximos días.

Estas son las primeras maquetas que hicieron del sitio:

Digg Boceto

Continuar leyendo “Bocetos webs: Nuevo diseño de Digg”

Bocetos de sitios webs

Hay diferentes técnicas, costumbres y manías en los creadores de sitios webs. En mi caso, cuando tuve que sentarme a pensar cómo quería un sitio (en su mayoría fueron de noticias), primero recurrí al lápiz y papel. Después lo pasé en digital con alguna herramienta de mockups. Pero el inicio, el punto cero, fue en un cuaderno.

Es conocido el primer boceto de Twitter. Cuando el sitio ni siquiera tenía todas las funcionalidades que tiene hoy:

Twitter Wireframe

Hay muchas instancias antes de que esas líneas que simulan una web se transformen en un código accesible para todos. Wireframes, Mockups, son algunos de los nombre que suelen recibir. Y hay de varios tipo: aquellas que están en una instancia de pruebas y se puede acceder desde una navegador (prototipo navegable) o están digitalizadas pero sin posiblidad de navegación, como un dibujo pero hecho con software.

Vuelvo al punto cero. Ese instante en que la idea que nos moviliza tiene la primera prueba empírica de realización. Es un momento clave aunque existan altísimas chances de que el sitio final no se le parezca en nada.

Por eso me resulta llamativo ver los bocetos de otros sitios, sean masivos o no, porque allí está el inicio de la idea, su escencia.

Les dejo algunas imágnes de bocetos que estuve mirando. Hay varios blogs que armaron listas y listas de estos dibujos. Les paso 2: uno en DesignBeep, otro en Webdesignledger.

The Washington Post – Post Points Website Sketch (fuente):

Bermuda Triangle Site (fuente):

Vimeo profile page idea (fuente):

Vimeo conversations page ideas (fuente):

¡Si ven más ejemplos no dejen de avisarme!

Los bocetos de los primeros íconos de Mac

Smile Computer Mac

Los orígenes de la Interfaz Gráfica de Usuario (GUI) están rodeados de polémicas, robos, copias y, por supuesto, genialidad. (Que los precursores fue Xerox, que Steve Jobs ‘robó’ esa idea para Mac, que Bill Gates copió para Windows y una encantadora historia de enredos que tantas veces fue contada).

Font Chicago

Por esto resulta interesante el trabajo de Susan Kare: la diseñadora encargada de crear los íconos y la tipografía (“Chicago”) que ayudó, desde su lugar, a dar impulso a la masificación de las computadoras personales. No es poca cosa.

En su nuevo libro “Icons” se publican muchos de los bocetos originales creados en 1983 hasta la fecha.

Más información: