Herramientas web para diseño web

¡Hola a todos!

Este post es un post muy sencillo que no pretende ser mas que un compilado de utilidades que utilizo para diseñar mientras mi trabajo me lleva por esos lares de la computación. La verdad es que yo estoy muy lejos de ser un buen diseñador, pero si algo me ha enseñado la programación es a buscar soluciones ya hechas por gente que realmente sabe del tema para que parezca que sabemos del tema.

Lo primero que hago es buscar un diseño web ya armado y sacarle todas las cuestiones de copyright. Nah, nah! Mentira. Buscamos un diseño web gratuito que nos permita quitarle el copyright si el entorno para el que trabajamos prefiere no tener esas cosas, caso contrario dejamos el copyright, que después de todo no es tan grave.

Luego, identificamos el color principal del tema y utilizamos este excelente calculador de colores complementarios y encontramos colores que querramos usar. Para el boton de eliminar buscamos un color rojo que sea complementario al color principal y así. Luego, con ese color, hacemos el boton con este excelente generador de botones, y ya tenemos la interfaz armada! :D

Tambien hay íconos aca que tienen una licencia que podes usar, y esto te puede ayudar para hacer mockups.

Después para hacer los formularios mas decentes (algo que no es ni cerca de lo fácil que debería ser) utilizamos uniform.js. Para elegir las tipografías como diría mi hermano, podemos usar esta página que nos dice las fuent… tipografías que podemos utilizar con confianza en cualquier browser y systema operativo.

Si tenemos que hacer algo “real time”, conviene usar Socket.IO, pero eso es para terminar de sacar los enlaces de mis favoritos y ponerlos en mi blog, nada relacionado con diseño.

Un abrazo,
Pedro

Los principios perdidos de el diseño

Estimados lectores:

Escribo para ofrecer un link a un sitio web que nos explica los principios que hemos de seguir para lograr que nuestro diseño web sea agradable a los ojos de nuestros visitantes.

Se listan y ofrecen ejemplos visuales de los siguientes fundamentos básicos:

  • Balance (simetrico, asimetrico, radial)
  • Contraste (grande y pequeño, suave y áspero, grueso y fino, claro y oscuro, orgánico y geométrico)
  • Énfasis y subordinación
  • Fuerzas direccionales
  • Proporción
  • Escala
  • Repetición y ritmo
  • Unidad en la variedad

¡Espero que sea de utilidad! aquí está el enlace.

Saludos,
Droope

Calcular colores complementarios

Hola gente,

Muchas veces, cuando estamos intentando terminar con los detalles finales de un sitio web, nos damos cuenta que necesitamos un color rojo para resaltar un error del usuario, o un color azul para clarificar algún asunto pendiente, y no solo eso, nos damos cuenta de que no hay esperanza de que nosotros mismos encontremos un color que no se vea espantoso.

Eso sucede, mis queridos amigos, porque apestamos buscando colores complementarios. La buena noticia, sin embargo, es que lo que muchos artistas y grandes pintores de otros tiempos lograban con tiempo y con talento, hoy lo podemos automatizar con software: software tan inteligente que es capaz de encontrar colores complementarios, inversos, reflexivos, rojos, amarillos y azules y todo eso.

Encontré en mi camino, la herramienta ideal para calcular colores complementarios. Estos colores son calculados a través de alguna oscura operación matemática, y por alguna razón, sin posibilidad de fallo, son agradables para nuestros ojos.

¿Útil, verdad?

Mis dos preferidos son estos:

Un abrazo grande,
Pedro