Haga que el diseño web sea más eficiente con las herramientas en línea gratuitas de Mudcu.be

Si alguna vez probaste el diseño web y no eres realmente una persona artística, entonces sabes que la no programación real “diseño” parte de la ecuación puede ser un poco desafiante.

Para algunas personas, como ciertos miembros de mi familia que son demasiado baratos para comprar software de creación de imágenes, la dificultad surge cuando quieren crear logotipos o fondos a medida. Para algunos programadores, el problema surge cuando se necesita el código CSS, y no han llegado a la velocidad de los últimos estándares de CSS..

Puede pasar mucho tiempo manteniéndose al tanto de las últimas tendencias y estándares de diseño web. Con la llegada de tantas herramientas de diseño web WYSIWYG, la creación de sitios web está cayendo más en el dominio de los no programadores que de los programadores en estos días. El problema con eso es que cuando se trata de ajustar un diseño para hacer lo que realmente quieres que haga, tienes que volver a un programador, no hay forma de evitarlo..

Afortunadamente, hay muchos recursos que pueden ayudarlo antes de que tenga que dirigirse a un programador para que lo ayude. Aquí en MUO, nos encanta el diseño web y cubrimos el tema a menudo, como Ann's Firebug review Guía de aficionados para personalizar el diseño de sitios web con FireBug Guía de aficionados para personalizar el diseño de sitios web con FireBug Lea más, o la lista de Steve de blogs de diseño web a seguir 6 Los mejores Blogs de diseño web para seguir 6 Mejores blogs de diseño web para seguir Leer más .

Un sitio en particular que proporciona una lista completa de herramientas de diseño web realmente útiles que cualquiera puede usar es Mudcu.be.

Mudcu.be herramientas de diseño web

Mudcu.be es lo que yo llamaría una caja de herramientas de herramientas básicas para un diseñador web que trabaja con un presupuesto muy pequeño (o sin presupuesto). Las herramientas que encontrará en este sitio están muy centradas en los gráficos y en el diseño o la coordinación de los colores de su sitio web. En última instancia, los colores son realmente lo que puede hacer o deshacer un diseño, por lo que estas son herramientas importantes a tener en cuenta..

Si usted es una de esas personas que simplemente no tiene dinero para comprar un software de calidad para la creación de imágenes o pinturas, o tal vez está viajando con una computadora portátil pequeña o una netbook y necesita una solución de edición de imágenes basada en la web. Una herramienta en Mudcu.be que puede ayudar es el Sketchpad.

La herramienta Sketchpad te permitirá fabricar prácticamente cualquier imagen que desees en una herramienta basada en web que no sea muy diferente a Windows Paint. Sin embargo, después de usar Sketchpad por un tiempo, sentí que es mucho más fácil de usar y mucho más flexible que Windows Paint. Cuando haya terminado, simplemente haga clic en la pequeña imagen del disco en la parte superior y podrá guardar la imagen que acaba de crear en su computadora. Es fácil.

Ahora, en mi opinión, las mejores herramientas que ofrece Michael Deal en su sitio son la selección de herramientas de gradiente de color de COLRD. Estas son una serie de herramientas de paleta de colores que le permiten ajustar cuidadosamente los elementos de color para crear el tono exacto del color que necesite. Ajusta el matiz, la saturación y la luminancia, y ajusta los niveles de rojo, verde y azul, y puedes seleccionar el cuadro de colores similares de la derecha si lo deseas. Cuando haya terminado, el código de color del tono que creó se muestra justo encima de los controles deslizantes.

La serie de herramientas COLRD incluye aplicaciones web similares a la anterior. los “Crear” El menú te permite elegir entre la herramienta de color anterior o puedes ir con Paleta, Degradado o Imagen de ADN.

Las otras herramientas se explican por sí mismas, pero vale la pena mencionar Image DNA. Con esta herramienta, puede abrir cualquier imagen que tenga en su computadora y luego usarla para identificar los colores dentro de la foto..

La belleza de una herramienta como esta es que si planea usar ciertas imágenes en su página web, esta aplicación web le permite identificar los colores que puede usar en su página web que coincidirán perfectamente con los colores dominantes en su foto. Esto puede ayudar a los diseñadores web aficionados a superar el muy común problema del choque de colores en una página web: convertir lo que podría ser un diseño decente en un sitio web atroz..

Hablando de sitios web atroces, hoy en día, ¿por qué demonios la gente todavía tiene antecedentes desagradables que parecen haber salido directamente de los años 90? Una vez que tenga todos los colores e imágenes de su sitio web ordenados con las herramientas anteriores, puede pasar al Generador de fondos.

Esta aplicación web le permitirá elegir entre una larga lista de “texturas” para su fondo Algunos de ellos pueden tener un aspecto cursi si no lo explicas bien, pero muchos de ellos se ven realmente bien si utilizas las selecciones de degradado para ajustar el tono del color para que se vea bien con tus imágenes y los colores del sitio web. Una vez que haya terminado, simplemente haga clic en el “Generar CSS” botón, y el código CSS se genera para usted. No hay nada más fácil que eso..

La herramienta incluso viene con un “simulador” función, donde puede probar el fondo en su página web antes de implementarlo. Esto es lo que parece cuando ejecuto el simulador en Google.com.

A Michael le encanta el color, y ninguna herramienta lo muestra más que su Esfera de color. De la forma en que lo describe en el sitio web, se supone que la esfera de color le permite “visualizar armonías de colores” usando fórmulas que se le ocurrieron. En realidad, es bastante impresionante porque le permite comenzar con una selección de cierto color, por ejemplo, rojo, y luego divide su color de elección en un degradado de otros colores que fluyen en “armonía”. Estos serían los colores que querría mantener en su sitio web para garantizar que todos los colores funcionen bien juntos.

Solo jugando con la Color Sphere por un tiempo, debo decir que aunque no sé qué fórmulas usa, las opciones de color realmente funcionan bien juntas.

Otra de las aplicaciones de Michael que vale la pena mencionar es en realidad una oferta de Appspot llamada Daltonize. Esta es una herramienta realmente impresionante que le permite identificar el tipo de ceguera al color que tiene, y luego usar esa selección para permitir que su navegador le muestre páginas web en un formato que tenga en cuenta su ceguera al color..

Después de instalar el marcador en su navegador, siguiendo las instrucciones, verá un icono de globo en su barra de herramientas (al menos en Chrome). La configuración de Daltonize le permitirá identificar las deficiencias en la visión del color cada vez que abra el navegador, y también puede cambiar la selección del tipo de ceguera del color en cualquier momento.

Así es como se ve la página resultante cuando usa el filtro de ceguera de color. Si no estás ciego al color, la imagen de abajo mostrará mi blog, que normalmente tiene un tono naranja para los lados del encabezado y el color del icono, como un color púrpura brillante. Parece que también tiñó algunas de las imágenes en el sitio. Herramienta muy impresionante!

Esta no es una lista de todas las herramientas de diseño disponibles en Mudcu.be, por lo que si lo que le gusta es el color, o si está buscando formas de incorporar mejor el color en su diseño web, este sitio es una visita obligada..

¿Alguna vez luchas con los colores en tus esfuerzos de diseño web? ¿Qué herramientas o técnicas utilizas para emparejar las cosas? Comparta sus pensamientos e ideas en la sección de comentarios a continuación!

Crédito de la imagen: diseño web Via Shutterstock

Explorar más sobre: ​​Diseño web, Desarrollo web, Herramientas para webmasters.