Les acercamos un pequeño listado de los 6 pasos a seguir para completar un proyecto de diseño web.

Es un excelente ayuda memoria que nos servirá para tener un trabajo organizado y prolijo a la hora de enfrentar nuevo sitio web.

Fuente: The University Of Texas At Austin

6 pasos del diseño web es una entrada de: Vitamina Geek, queda prohibida la utilizacion de contenidos de este Feed sin permiso escrito del autor. Si usted ve sitios que infringen nuestro copyright por favor comuniquese a ilegal@internetox.com que tomaremos acciones judiciales inmediatamente.

La página de error 404 ideal debe ser informativa, intuitiva, funcional y, en último lugar, esteticamente correcta.

Uno de mis consejos al respecto es mantener la gráfica general del sitio (menues, cabeceras, etc.) y cambiar la parte central, lugar donde indicaremos que hubo un error 404. Nuestras visitas verán que algo no funciona, pero tendrán la facilidad de continuar con su recorrido por nuestra web. Otro consejo muy importante es tener un registro de estos errores, para corregir posibles fallas que lo generen y evitar que se repita.

En este area debemos destacar el trabajo de compañias como Ebay (Ver 404) o Bing (Ver 404), ya que tienen páginas que ayudan al usuario… y prácticamente desechar las páginas de error de compañias como Google.

Justamente de ellos venimos a hablar. Google puede ser el mejor buscador, el mejor servicio de mail y el número uno en videos online, pero… ¿Jamás pensaron en mejorar sus páginas de error?

A continuación veremos los servicios más populares de google con sus respectivas páginas de error 404:

1- Blogger, Google Docs y Adwords
Las páginas de error de estos servicios son las peores de la lista. No se han tomado la molestia ni siquiera de cambiar la página por defecto.

Link: http://www.blogger.com/404

2- Google Adsense
De similares características al anterior, la página de error 404 de adsense ocupa el segundo lugar en el ranking.

Link: https://www.google.com/adsense/report/overview/404

3- Gmail, Google Search y generales de Google.com
Este es el más común dentro de Google, es reflejado por la mayoría de los sitios alojados dentro de Google.com (ej: loquesea.google.com). Ocupa el tercer lugar porque, al menos este, tiene un poco más de trabajo encima. Esta página de error parece haber sido creada por Larry Page en 1997! De usabilidad ni hablemos, sólo incorpora un poco de gráfica.

Link: http://www.google.com/6+654654

4- Google Custom Search
Finalmente estamos llegando a un buen puerto… no el mejor, pero bueno al fin.
La página de error de Google Custom Search al menos tiene una descripción y la posibilidad de ir a la página anterior o volver a la home. El diseño no está 100% integrado, pero cuenta con el logotipo y la fuente tipografica del servicio.

Link: http://www.google.com/cse/404

5- Feedburner
Llegando al final de nuestra lista nos encontramos con Google FeedBurner y una página de error que, si bien no es la mejor de todas, tiene las características necesarias para considerarse pasable.

Link: http://feedburner.google.com/fb/a/home/404

6- Youtube
La estrella de Google, Youtube también cuenta con una página de error personalizada en la que podemos ver una descripción del error y la posibilidad de ver o buscar otros videos. Esta página al menos tiene calidad, además cabe destacar que en el caso de youtube no es una página que se vea con mucha frecuencia.

Link: http://www.youtube.com/esta-pagina-no-existe

7- Orkut
La última de la lista y la mejor de todas las páginas de error de los servicios google. Orkut parece haber entendido realmente que es lo que necesitan los usuarios a la hora de caer en una página de error 404.

Link: http://www.orkut.com/Main#404

Antes de terminar me gustaría aclarar que, en algunos de los casos mencionados son muy pocas las veces que nos topamos con estas páginas, ya que hablamos de sitios cerrados o con poco margen de error. Sin embargo no justifico el mal desempeño de la empresa en materia de páginas de error 404 que voy a continuar catalogando como la peor que he visto en mi vida.

Muchas gracias.

Google es definitivamente el peor en páginas de error 404 es una entrada de: Vitamina Geek, queda prohibida la utilizacion de contenidos de este Feed sin permiso escrito del autor. Si usted ve sitios que infringen nuestro copyright por favor comuniquese a ilegal@internetox.com que tomaremos acciones judiciales inmediatamente.

Templatr es un completo editor de diseño online que nos permite crear fácilmente nuestras plantillas para WordPress sin la necesidad de tener conocimientos de HTML o PHP.

Para comenzar, debemos elegir un esquema o layout, que es el diseño principal del theme. Tenemos para elegir de una o dos columnas laterales o una inferior. Tu la eliges.

Luego procedemos a cargar todo el elemento gráfico, imágenes y todo lo demás que representará la personalidad de nuestra plantilla. Finalmente, usaremos el Designer, para editar los colores y tamaños de cada una de las secciones del theme.

Una buena alternativa para aquellos que no se deciden por un theme en específico.

Enlace: Templatr

Crea tus plantillas WordPress con Templatr es una entrada de: Vitamina Geek, queda prohibida la utilizacion de contenidos de este Feed sin permiso escrito del autor. Si usted ve sitios que infringen nuestro copyright por favor comuniquese a ilegal@internetox.com que tomaremos acciones judiciales inmediatamente.

Si eres un apasionado por el diseño, y usas Twitter, probablemente querrás personalizar a fondo tu espacio en la ya mencionada red social. Pues hoy te dejo un sitio que te ayudará en eso: Themeleon.

Themeleon es una funcionalidad más de ColourLovers, genial sitio web que nos permite generar diferentes paletas de colores para tus sitios web. En este caso las podrás utilizar en Twitter.

Para crear tu propio fondo personalizado, primeramente elegimos el formato, colores, tonos, etc. en nuestra paleta. Una vez creada, iniciamos sesión en nuestro Twitter, cargamos la paleta generada y ya está.

Muy buena manera de personalizar Twitter, esta vez con algo más de creatividad y que difiere de los fondos generales que usan los demás usuarios a lo largo del mundo.

Enlace: Themeleon

Descarga fondos para Twitter en Themeleon es una entrada de: Vitamina Geek, queda prohibida la utilizacion de contenidos de este Feed sin permiso escrito del autor. Si usted ve sitios que infringen nuestro copyright por favor comuniquese a ilegal@internetox.com que tomaremos acciones judiciales inmediatamente.

En esta lección aprenderemos a crear un texto con efecto de neón. Para empezar creamos un documento del tamaño deseado, y use el color que quiera. Como nosotros vamos a dibujar un cartel de neón sobre una pared de ladrillo, usaremos un color rojo ladrillo #6c000a. Ahora crearemos la pared, donde estará situado nuestro cartel. Para esto usamos Filter -> Texture -> Texturizer:

Le daremos más realidad a la pared: como el color principal usaremos #230001, y el color de #670000. Creamos un nuevo layer y le aplicamos Filter -> Render -> Clouds. Cambiamos el modo de aplicación del nuevo layer de Normal a Overlay. Activamos la herramienta Marquee Tool y aclaramos algunos ladrillos con Image -> Adjustments -> Brightness / Contrast:

Ahora creamos un nuevo layer de texto, y activando Type Toll escribimos nuestro texto. Al seleccionar el texto lo eliminamos y usamos la función Edit -> Stroke:

Ahora es el momento de darle la iluminación de neón, para hacerlo usamos funciones Inner Glow y Outer Glow, Layer -> Layer Style -> Inner Glow:

Layer -> Layer Style -> Outer Glow:

Sólo quedan algunos detalles: Entrando a Layer -> Layer Style -> Stroke y usamos siguientes configuraciones:

La combinación de colores es según su preferencia, acá tienen el mio:

Ya esta, ahí tienen el resultado:

Texto con efecto de neón en Photoshop es una entrada de: Vitamina Geek, queda prohibida la utilizacion de contenidos de este Feed sin permiso escrito del autor. Si usted ve sitios que infringen nuestro copyright por favor comuniquese a ilegal@internetox.com que tomaremos acciones judiciales inmediatamente.

Ya por muchos es sabido que DeviantArt es el sitio número 1 para los diseñadores que necesitan recursos para trabajar.

En deviantart miles de diseñadores experimentados y principiantes se encuentran y comparten sus conocimientos y herramientas, en la mayoría de los casos, gratuitamente.

La gente de First Web Designer ha creado un compilado con 39 botones gratis para nuestros diseños, todos tomados de deviantart.

Del listado, queremos destacar el que nos parecio de lo mejor. Se trata de Web UI Treasure, creado por ArtDesigner.lv

En el encontraremos una gran variedad de botones que pueden ser perfectamente aplicables a cualquiera de nuestros trabajos. Si bien no se encuentra alojado en Deviant Art como los demas, fue encontrado ahi.
Aqui les dejamos el link de descarga: http://artdesigner.lv/WEB_TreasureChest_Download

Para que se den una idea, la imagen colocada en este post fue tomada de ese recurso.

Entrando en http://www.1stwebdesigner.com/development/free-buttons-webdesign-resources-deviantart/ podras encontrar los 38 recursos gratis restantes.

Botones gratis para nuestros diseños es una entrada de: Vitamina Geek, queda prohibida la utilizacion de contenidos de este Feed sin permiso escrito del autor. Si usted ve sitios que infringen nuestro copyright por favor comuniquese a ilegal@internetox.com que tomaremos acciones judiciales inmediatamente.

Compilado de tutoriales photoshop

La gente de trazos web nos acerca un excelente compilado con 79 tutoriales de photoshop.

Si no tenemos los conocimientos o la creatividad para crear un buen diseño en photoshop con este compilado vamos a poder crearlos paso a paso sin ningun problema.

No solo tendremos como resultado un buen diseño para nuestra web, sino que obtendremos algo mucho mas importante, que es el aprendizaje de ciertas tecnicas, consejos y demas, que haran que nuestro trabajo tenga un valor mayor a medida que avancemos en esta carrera.

Nunca olvidemos esto, podemos copiar un tutorial, podemos “robar” alguna idea, podemos crear basandonos en otro, pero nunca podemos dejar de aprender de todo eso. El diseñador que toma prestado y aprende, es admirable… el diseñador que toma prestado y no aprende nada, es un simple ladron de contenidos.

En este mundo aprendemos de lo que vemos en el otro, sobretodo en diseño, pero cuando dejamos de aprender, ya no tiene sentido seguir en el diseño. O al menos no tiene sentido llamarse diseñador.

Fuente: http://www.trazos-web.com/2009/11/03/79-tutoriales-para-crear-disenos-web-en-photoshop/

Tutoriales de Photoshop es una entrada de: Vitamina Geek, queda prohibida la utilizacion de contenidos de este Feed sin permiso escrito del autor. Si usted ve sitios que infringen nuestro copyright por favor comuniquese a ilegal@internetox.com que tomaremos acciones judiciales inmediatamente.