5 extensiones para Chrome imprescindibles para un diseñador

5/5 - (1 voto)

principal_

 

Cada día aparecen nuevas herramientas que nos ayudan a agilizar ciertos procesos de trabajo, muy interesantes para nuestros proyectos. En el diseño estas herramientas son muy útiles, y hoy os traemos una selección de 5 herramientas fundamentales que debes conocer. Son extensiones para Google Chrome, mediante las cuales completaremos de forma más eficiente los procesos de diseño, y mejoraremos la calidad de nuestros trabajos.

 

 

1 – Colorzilla

 

colorzilla-for-firefox

 

Esta herramienta ayuda a diseñadores y desarrolladores web a gestionar el color. Se trata de un conjunto de herramientas relacionadas con el color: un selector de color, un cuentagotas con el que podremos saber el color exacto que se está usando en una web, tanto en formato RGB, Hex, etc., también podemos generar paletas de colores para nuestros proyectos, e incluso generar el css de degradados que creemos.

 

 

2 – Page Ruler

 

 

Esta herramienta nos permite tomar medidas, en tiempo real, de cualquier elemento de una web, obtenemos las medidas de alto por ancho en píxeles. El funcionamiento es muy sencillo y básico, pero muy útil si queremos obtener medidas de algún elemento de forma rápida.

Nota: Somos muy fans de Measurelt, pero no es 100% compatible con Chrome, así que esperemos que solucionen esto, de momento lo usamos solo en Firefox.

 

 

3 – Awesome Screenshot

 

 

Con esta extensión podemos generar capturas de la página web, de su totalidad, de la zona que estamos viendo, o de la zona que elijamos. Da la opción de ‘garabatear’ sobre nuestra captura de pantalla con diferentes elementos, cuadrados, elipses, flechas, líneas, textos o dibujos libres, además de poder recortar la zona que nos interese. Una vez lo tengamos listo en la previsualización lo guardamos y listo.

Nota: Echamos de menos en Chrome la herramienta de Pearl Crescent, pero solo está para Firefox, aún así esta herramienta cumple la misma función. Actualización 2018: Ya está disponible: https://chrome.google.com/webstore/detail/page-saver/kbchedinmkicifjhlmlcnklhephjpngp

 

4 – Responsive Web Design Tester

 

 

Hoy en día es fundamental tener en cuenta el diseño Responsive, por lo que esta herramienta nos ayudará a visualizar una web en diferentes tipos de dispositivos.
Simplemente haciendo click derecho sobre la web, y eligiendo el dispositivo sobre el que queremos visualizar nuestra web, aparecerá una nueva ventana donde podremos ver como queda dicha web en el dispositivo seleccionado. Tenemos una gama limitada de dispositivos, pero suficientes para hacer un test de como se visualiza y se adapta la web elegida.

 

4.1 Herramianta online que también cumple esta función:

resizer_rd

http://design.google.com/resizer/

Ésta herramienta online es oficial de Google, la cual solemos utilizar también para comprobar la adaptabilidad de una web nueva que hemos desarrollado. Cuantas más pruebas realicemos, más nos cercioraremos de que el responsive está bien ejecutado en la más amplia gama de dispositivos.

Simplemente ponemos la URL y nos aparece en los diferentes tipos de dispositivos.

 

 

5 – Font Playground

 

 

Con esta herramienta podemos probar como quedaría una web con otro tipo de tipografía, de una forma sencilla y rápida, a tiempo real. Puede seleccionas entre las mas de 10.000 fuentes de Google Fonts, y ver como quedaría una misma web con el cambio de la tipografía. Es muy importante a nivel visual escoger la tipografía adecuada para nuestro proyecto, y puede darle a la web un aspecto mucho más interesante si elegimos la tipografía más apropiada.

 

 

+ EXTRA

What Font

 

what-font

 

Con esta herramienta podemos saber de una forma rápida la tipografía de una web (siempre que sea texto, claro) simplemente con pasar por encima con el ratón. Además si clicamos sobre el texto que nos interesa nos abre un desplegable donde nos informa del tamaño, el interlineado, y el color. Realmente rápida y útil!

 

 

Comparte
¿Quieres más información?
Ponte en contacto con nosotros.
Nacho Olcina
Nacho Olcina
Responsable del departamento de UI / UX de acceseo • Amante de la naturaleza • Fotógrafo aficionado • Fan tech • Eternamente autodidacta 🚀

Enviar Comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.

Artículos relacionados

Suscríbete a nuestra newsletter
para estar al día en el mundo online
¿Tienes alguna incidencia?

Cuéntanos qué ocurre
y nos pondremos con ello lo antes posible.

    Este sitio está protegido por reCAPTCHA, y la Política de privacidad y Términos de servicio de Google.

    ¡Cuéntanos tus ideas!
    +34 96 653 19 14
    info@acceseo.com

      Este sitio está protegido por reCAPTCHA, y la Política de privacidad y Términos de servicio de Google.

      Te ayudamos a conseguir
      hasta 12.000 € del bono Kit Digital
      Te ayudamos a conseguir
      hasta 12.000 € del bono Kit Digital