Auto-gerenciar cores da interface do usuário no esboço com corrente
Combinar cores para se adequar à sua página pode ser um incômodo. Isso também é verdade para modelos de websites e interfaces do usuário de aplicativos para dispositivos móveis - ambos exigem ótimo esquema de cores que combina com todos os elementos da página.
Se você usa frequentemente ferramentas de cores, não terá dificuldade em encontrar grandes paletas. Mas e se você pudesse automatizar o processo? Sim, é possível através da cadeia.
Cadeia é um complemento grátis do Sketch que permite automatizar a seleção de cores (bem, principalmente). Você simplesmente escolhe uma cor principal e “cadeia” outros elementos junto com essa cor. Este plugin faz todo o trabalho pesado para você.
Com Chain você pode escolher o estilo de correspondência de cores e quanta variação você deseja. Basicamente, funciona por misturando vários elementos de página juntos, alguns mais claros e alguns mais escuros, todos puxando de uma cor base. Esta é surpreendentemente uma ferramenta útil para quem preferir Esboço sobre gigantes como o Photoshop.
Então, digamos que você tenha uma barra de navegação, um cabeçalho de herói e um botão CTA brilhante. Você quer atualizar todos esses elementos de uma só vez e misturá-los em um estilo de cor perfeita.
Chain permite fazer isso em um único menu no Sketch. Você pode até criar múltiplos “correntes” de elementos de página, cada um com seu próprio estilo e metas exclusivas.
Cada cadeia tem quatro opções de cores:
- Matiz
- Alfa
- Saturação
- Brilho
Dessa forma, você pode escolher como misturar as cores e como misturá-las de uma maneira que pareça ótima.
Embora seja um plugin super útil para designers, provavelmente não é a solução completa para o design da IA. Você ainda vai querer examinar as opções de cores e certificar-se de que elas realmente parece bom.
Você pode baixar uma cópia do Chain do repositório GitHub totalmente grátis para a vida. Depois de dar uma olhada no Chain e levá-lo para um passeio de teste, você ficará surpreso com o quanto ele pode ajudar seu fluxo de trabalho de design.
Se você ainda não tem certeza de como isso funciona, assista ao vídeo de demonstração de 1 minuto mostrando muitos exemplos para agradar aos olhos.