10 extensões do Google Chrome para designers

Se você é um web designer que segue o processo de design padrão, suas tarefas incluem coisas como:

• Pesquisando
• Estrutura de arame
• Escolhendo um esquema de cores
• Escolhendo a fonte certa
• Testando várias variações
• Colaborando com clientes e colegas de equipe

E mais alguns…

Você sabia que pode fazer tudo isso e muito mais diretamente no seu navegador? Sim, se você é um profissional do Google Chrome, pode realizar todas essas tarefas por meio das extensões do Chrome. A maioria deles com apenas alguns cliques.

Portanto, economize muito tempo e experimente essas 10 extensões do Google Chrome para designers.

1. Testador de Web Design Responsivo

Poste a atualização otimizada para dispositivos móveis do Google, responsividade é a palavra de ordem! Então, aqui está uma extensão que permite testar seu site em todos os principais dispositivos móveis Android e Apple.

Ele também funciona offline, por isso é uma ótima opção, mesmo enquanto você está trabalhando em seu design localmente. Ele possui predefinições para todos os dispositivos populares, mas você também pode adicionar suas dimensões personalizadas.

Depois de selecionar um dispositivo para visualização, a guia atual é aberta em uma janela pop-up mostrando como sua página ficaria nesse dispositivo.

2. Tipo Maravilha

As fontes realmente definem o clima de um site, mas é uma tarefa e tanto escolher a certa. Você sabe o que fazer – voltar ao seu código, fazer alterações e visualizar. E tudo isso de novo e de novo.

Mas é aqui que entra esta extensão de fonte prática. O TypeWonder permite que você altere a fonte de qualquer site em seu navegador.

Basta visitar seu site e clicar no ícone da extensão. Você recebe várias opções de fonte. Clicar em qualquer um quase instantaneamente cria uma visualização do seu site nessa fonte. Se você estiver satisfeito com a visualização, poderá obter o código relevante para adicionar ao seu site e seu arquivo CSS.

3. Empacotador de guias

Pesquisar é um grande negócio. E se você é um designer que leva a pesquisa a sério, posso dizer com segurança que, a qualquer momento, você tem pelo menos sete a dez abas abertas.

E se você tivesse que obter a opinião de seu amigo designer ou colega de equipe sobre os sites aos quais você está se referindo? Você marcará todas as páginas em uma pasta, exportará tudo isso e, em seguida, escolherá o conjunto para enviar, é claro, depois de abrir seu programa de e-mail. Bastante trabalho!

Felizmente, você não precisa trabalhar tanto. O Tab Packager permite empacotar todas as guias abertas. E então você pode enviar através do link do pacote com apenas um clique. Você pode compartilhar via e-mail, Twitter e muitos outros serviços.

4. TrackDuck

A comunicação eficaz está por trás de cada projeto bem-sucedido. Mas pode ser cansativo ficar indo e voltando com e-mails tentando fazer pequenos ajustes ou fazer grandes mudanças.

Agora, isso pode parecer um exagero, mas o TrackDuck é como um mini-Asana, exclusivamente para designers.

TrackDuck é uma ferramenta de colaboração visual que permite adicionar sites como projetos. Depois de adicionar um projeto, você pode convidar seus colegas de equipe para ele. Sempre que você deixar um comentário sobre este projeto (ou site – o que você pode fazer apenas clicando no ícone da extensão), é gerada uma tarefa sobre o comentário. Você pode atribuir essa tarefa a seus colegas de equipe, adicionar anexos e capturas de tela e integrá-la a muitas ferramentas de colaboração, como Trello e Basecamp.

5. ColorZilla

Você nunca sabe quando verá uma cor linda que inspirará a paleta do seu próximo projeto da web.

Então, como você captura qualquer cor na web?

Bem, aqui está o ColorZilla – é facilmente o brinde favorito do Chrome de todos os designers. Seu recurso mais básico e popular é obter o código para qualquer cor em uma página da web.

Outro recurso é que permite obter o esquema de cores de qualquer site. Você terá que clicar na opção Analisador de cores da página da Web e uma paleta mostrando todas as cores dessa página da Web será exibida.

6. Qual Fonte

Há tantas vezes quando você se depara com um site que usa a fonte, cor e tamanho perfeitos. Na verdade, pode ser tão bom que você queira usar a combinação exata em seu site.

Mas você não precisa mais seguir a rota Inspecionar Elemento – o WhatFont disseca qualquer fonte em uma página da Web com um único clique.

Basta clicar no ícone da extensão e passar o mouse sobre a seção de texto que você está interessado. WhatFont produz o tipo de fonte, tamanho, altura, cor e família.

7. Estrutura de arame instantânea

Se você definir a hierarquia de informações do seu site antes de projetá-lo, criará um site amigável. E o wireframing é a melhor maneira de fazer isso.

A extensão Instant Wireframe permite visualizar um wireframe razoavelmente bom de qualquer página da web. Ainda está em beta, mas faz um trabalho justo.

Se você encontrar um site do qual gostaria de visualizar o wireframe, basta clicar no ícone da extensão na barra de endereços. Vale a pena tentar!

8. Régua de página

Existem algumas maneiras de medir as dimensões dos elementos de uma página da web. Mas a maioria deles envolve várias etapas e leva tempo.

O Page Ruler é a maneira mais prática de fazer isso. A Régua de Página permite que você veja a altura, a largura e a posição relativa de um elemento. Você também pode analisar os elementos div-wise.

E é excelente para criar banners perfeitos em pixels, imagens em destaque e outros materiais de marketing.

9. Paleta para Chrome

Os sites estão cheios de imagens e você não pode dizer quando verá uma imagem boa o suficiente para inspirar uma paleta de cores.

Mas você não precisa se preocupar, pois o Palette for Chrome sempre cobre você. Basta clicar com o botão direito na imagem que achar interessante e escolher a opção desta extensão. Ele criará instantaneamente uma paleta de cores inspirada na imagem escolhida. Você pode especificar o número de cores que deseja gerar para o esquema de cores.

Eu teria gostado mais se houvesse uma maneira de exportar o esquema de cores. Mas a extensão ainda é um must-have.

10. ExtensãoMuzli – Café da Manhã Design

Você sabe, quando você está apenas começando, você se inscreve em todos os principais blogs do seu nicho. Seus feeds RSS estão todos acionados. Mas à medida que seu trabalho se acumula, você fica um pouco desconectado. E não é que você não precise de inspiração, é só que fica difícil recuperar o atraso.

ExtensionMuzli é construído para compensar isso. Ele seleciona histórias de cerca de 12 a 15 dos principais recursos de design. Há também uma seção de trabalhos de web design, se você quiser mudar.

Depois de instalar esta extensão, sua nova guia apresentará algumas das mais recentes histórias de design inspirador ou educacional de toda a rede. Ele oferece uma maneira elegante de manter uma guia sobre as últimas novidades do seu nicho.

Então, lá vai você. Fortaleça seu Chrome com essas incríveis extensões de web designer e veja sua produtividade disparar. Como você divide seu processo de design e quais extensões você usa para quais tarefas? Eu adoraria aprender mais.