Por que o Sketch é o queridinho dos UI Designers
Tudo o que você precisa saber sobre o novo app que desafia até o gigante Photoshop
A ideia era trazer pra cá um relato menos apaixonado e mais preciso, para te ajudar a fazer uma escolha racional da melhor ferramenta para desenhar interfaces. Por isso, passamos seis meses usando o Sketch antes de escrever esse texto. Mas, o relato imparcial, que deveria se chamar “Photoshop vs Sketch”, acabou virando “Por que o Sketch é o queridinho dos UI Designers”.
Portanto, não vamos fingir que o Photoshop ainda é o dono do nosso coração, porque já fizemos declarações públicas de afeto ao Sketch. Isso não significa que somos incapazes de apontar questões críticas ou de argumentar com bons motivos para escolher um e não o outro.
Então, se você prefere escolhas emocionadas a decisões calculadas, siga-nos os bons.
Primeiras impressões
Depois de utilizar o Photoshop por dez anos, a primeira impressão que tivemos do Sketch é que ele é bem mais simples e prático. Para quem está acostumado com os aplicativos da Adobe, algumas funcionalidades são intuitivas. Outras requerem um pouco mais de uso até se tornarem naturais.
Por ser todo em vetor, o Sketch torna a adaptação dos projetos para diferentes resoluções de tela bem mais prática. Essa facilidade se estende também para a exportação de ícones.
Sem falar que a primeira experiência que se tem com programa é um canvas infinito, que te permite criar, duplicar e arrastar telas ou elementos livremente.
Por ter sido feito para UI Designers, todas as ferramentas do Sketch buscam facilitar ao máximo a construção de interfaces. Há quem diga que, por ter um nicho tão definido, o programa acaba se limitando demais.
Ele é mesmo muito mais enxuto que o Photoshop, mas essas “limitações” impedem que o designer crie soluções mirabolantes — que fazem todo sentido na cabeça dele, mas vira uma enxaqueca crônica no cérebro dos desenvolvedores. Olhando por esse ângulo, as delimitações representam uma grande vantagem. De nada, desenvolvedores frontend.
A médio prazo, o Sketch melhora o fluxo de design e, consequentemente, o desempenho do designer. Com ele, o ritmo é muito mais fluido.
Mas… no que, exatamente, o Sketch é melhor do que o Photoshop?
Senta, que a lista é extensa…
Configuração de fonte
O corpo de texto, entre-linhas e demais configurações de fonte são pensadas para serem muito semelhantes à renderização do navegador. Dessa forma, o desenvolvedor frontend não precisa se preocupar tanto em ficar comparando projeto gráfico e implementação.
CSS friendly
Os efeitos de preenchimento, borda e degradês têm a mesma limitação de um código CSS. Então, dificilmente um projeto gráfico apresentará algo que o desenvolvedor não consiga replicar com facilidade.
Coleção de símbolos
Com um pouco de paciência e muita organização, é possível criar uma biblioteca de símbolos para cada arquivo e componentizá-lo. A partir disso, sempre que houver mudanças em algum componente, todo o projeto gráfico será atualizado automaticamente.
Por exemplo: se eu transformei um botão que era verde em azul e tenho um símbolo “botão” catalogado, quando eu modifícá-lo, todos os outros também serão alterados. Feitiçaria? Não, tecnologia (e muito amor).
Pós projeto
Além de organizar tudo muito direitinho, dividindo por páginas, interações e pastas, o Sketch facilita a medição de margens, paddings, tamanhos de texto, cores, etc. Existem, inclusive, plugins que documentam essas medidas automaticamente. Basta selecionar o objetivo, apertar um atalho e, tcharam, está tudo lá: anotadinho. Usar essa funcionalidade para projetos mobile é uma maravilha.
Exportação: nota 10
Na categoria mobile, a escola Unidos do Sketch ganha nota dez pela exportação. Você só precisa selecionar tudo o que quiser exportar e depois definir os tamanhos e sufixos pra cada .png. São 109 itens? Moleza. Com um clique é possível exportar uma imagem para todas as zilhões de resoluções do android e pras milhões de resoluções do iOS. Se for um projeto desktop, você pode salvar uma versão para monitores de retina automaticamente.
O que falta no Sketch?
Para ficar perfeito, o Sketch precisaria: ter um conceito de “projeto” e salvar a mesma biblioteca de símbolos para vários arquivos diferentes. Hoje, para manter os símbolos atualizados, é preciso desenhar todas as interfaces em apenas um arquivo. Isso nem sempre é possível, principalmente porque alguns produtos precisam de muitas interfaces.
Para quem o Sketch é recomendado?
Para todos os UI Designers que gostam de praticidade; desenvolvedores frontend que codificam as telas e; desenvolvedores que precisam entender o comportamento de uma interação e têm preguiça de ler documentações.
Enfim, para todo mundo que quer usar um programa fácil, prático, bonito e mais barato do que o Photoshop.
Dicas de leitura
Se você ainda não se convenceu de que o Sketch é melhor ou quer mais informações antes de abandonar o bom e velho Photoshop, não deixe de ler:
- Este infográfico comparativo entre os dois programas sensação de 2015;
- Este artigo do Blog de AI, que compara o Axure e o Sketch;
- O SketchCasts, que te ajuda a entender como o Sketch funciona;
- A comunidade oficial do Sketch 3 e;
- Esta coleção do Medium, com textos em várias línguas, cheia de dicas e tutoriais.
