en Diseño Web

Interfaces gráficas de usuario (plantillas de diseño)

Ahora que empieza un año nuevo es un buen momento para hacer nuevos propósitos, y qué mejor que mejorar tus diseños siguiendo una retícula o desarrollando para nuevos dispositivos. Os traemos unas cuantas plantillas que pueden hacerte más facil llevar a cabo este propósito de año nuevo.

Navegadores de escritorio

Retícula de 960px

960px Grid

Es una buena base para tus diseños web puesto que es una medida muy versatil que te permite multiples divisiones en columnas de diferentes anchos. Además este ancho cabe perfectamente en los navegadores a una resolución de pantalla de 1024×768 px., que es la más estandar actualmente, quitándo bordes y barras de scroll.

Más info | Plantilla de retícula de 960px.

Descargar 960px Grid.

Elementos del navegador web

Si quieres dotar a tus diseños de algo más de realismo puedes presentarlos incrustados en una ventana de navegador o añadiendo elementos de formulario, como botones, inputs, barras de scroll, etc… Siendos sinceros la interfaz gráfica de Mac OS X es la más bonita y apreciada por los diseñadores, pero de todas formas os dejamos las plantillas de los más habituales.

Navegadores en Mac OS X

Navegadores en Windows Vista

Navegadores en Windows XP

Dispositivos Móviles

Cada vez es más frecuente el uso de móviles para navegar por internet, por ello la necesidad de crear una versión móvil de tu web se está conviertiendo en algo indispensable. Debido a la multitud de dispositivos diferentes que existen tenemos la opción de crear una web genérica, o si le queremos dotar de valor añadido a nuestra web, podemos adaptar nuestro sitio a cada uno de los diferentes dispositivos.

Plantilla de la interfaz de iPhone

Nuestro compañero Albert García, ya nos habló sobre Plantilla para photoshop de la interfaz de iPhone. Y ahora os traemos el PSD del la última versión del sistema operativo Móvil de Apple, el iPhone OS 3.0, que viene con nuevos elementos gráficos como:

• Mapa y elementos del mapa, inluido el enrrollado
Elementos para copiar y pegar
• Editor de barra de línea de tiempo
• iPhone Horizontal
• Barras de paneles horizontales y teclados

iPhone GUI 3.0

Más info | iPhone GUI PSD 3.0.

Descargar iPhone GUI PSD 3.0.

Plantilla de la interfaz del iPad

Si tienes pensado desarrollar también para el iPad seguro que la anterior GUI se te queda corta. Así que te dejo una específica para el iPad.

Más info | iPad GUI PSD.

Descargar iPad GUI PSD.

Plantilla de la interfaz de Andrid

Los chicos de Smashing Magazine, que recientemente han publicado The Smashing Book, nos dejan esta interfaz completita para su uso libre.

Android GUI

Más info | Android GUI PSD Vector Kit.

Descargar Android GUI PSD Vector Kit.

Plantilla de la interfaz de Palm Pre

La gente de teehan+lax, los que han desarrollado iPhone GUI PSD 3.0., nos vuelve a sorprender con Palm Pre GUI PSD.

Palm Pre GUI

Más info | Palm Pre GUI PSD.

Descargar Palm Pre GUI PSD (tipografía Coconut).

Descargar Palm Pre GUI PSD (tipografía Avenir).

Posts Relacionados

Limpieza de floats en Internet Explorer 7 Durante los últimos meses, Microsoft nos ha tenido en vilo ( sobretodo a los desarrolladores web ), pendientes del soporte a la especificación de CS...
¿Qué significa la “K” de CMYK? CMYK son las siglas del modelo de color que se usa normalmente en impresión. CMYK hace uso de 4 colores básicos ( Cyan, Magenta, Amarillo y Negro ) ...
Todos los capítulos de “Getting Real”... Getting Real es el libro sobre desarrollo de proyectos web en el que 37 Signals ha tratado de plasmar su filosofía de trabajo. A lo largo de 16 capí...
  • http://uninstallme.com kus

    Buenísimo!!
    Las ventanas de Safari y Firefox en Mac me van a venir de perlas.

    Saludetes

  • http://blog.albertlg.com albertlg

    Muy buena recopilación de GUIs, chicos. 😉

  • http://rockstarunder.com.ar/ pablo

    Gracias, me seran muy utiles estas GUI, gracias!!!

  • joana ramirez

    que vaina mala ey coloquen algo mejor que no les quede grande

  • http://www.proyectoycreacionweb.com/ www.proyectoycreacionweb.com

    Gracias por el aporte, me será muy útil para introducir los elementos gráficos más sencillos con mayor rapidez en los diseños web de mis páginas web.