Sem sombra de dúvidas 2016 foi o ano das ferramentas de prototipação.
Novas ferramentas foram lançadas e as já existentes ganharam novas funcionalidades. Com isso em mente, selecionei algumas ferramentas para ficar de olho durante o ano de 2017.
A minha escolha foi baseada na popularidade entre as comunidades de usuários. Tenho certeza que algumas ficaram de fora. Fique a vontade para sugerir ferramentas nos comentários.
01. Figma
Figma se destaca pelos seus recursos colaborativos em tempo real. Designers podem trabalhar juntos remotamente. Programadores podem adicionar/escrever seu próprio código em um projeto em tempo real enquanto a equipe vai dando feedback. Me arrisco a dizer que ele é o Slack para designers.
Site: https://www.figma.com
Informações: https://medium.com/figma-design
Comunidade: https://www.facebook.com/figmadesign/
Plataforma: Mac e Windows
Valor: Free
02. Adobe XD
O XD é um aplicativo de desenho vetorial que permite a criação de protótipos. Alguns usuários dizem que o XD é uma cópia do Sketch ou uma combinação de Sketch + Invision + Craft (conhecido antes como Silverflow). O XD oferece uma boa conectividade entre os produtos Adobe. Além disso, ao contrário do Sketch, que é exclusivo do Mac, o XD também está disponível no Windows. Uma pequena vantagem que vejo no XD é a sua taxa de lançamentos de novas features, todo mês — religiosamente — tem alguma novidade na ferramenta.
Está completando 5 meses agora em Janeiro que migrei do Sketch para o XD e o utilizo único e exclusivamente.
Site: http://www.adobe.com/products/experience-design.html
Informações: https://blogs.adobe.com/creativecloud/tag/xd-product-updates/?segment=design
Comunidade: https://www.facebook.com/AdobeExperienceDesign/
Plataforma: Mac e Windows
Valor: Free
03. Sketch & Plugins
O Sketch busca facilitar ao máximo a construção de interfaces, os seus plugins são ótimos para agilizar o processo de criação — a ferramenta possui um exército de plugins para aumentar a produtividade. Sem sombra de dúvidas a comunidade mais ativa e participativa de todas as ferramentas mencionadas é a do Sketch.
Site: https://www.sketchapp.com/
Plugins: https://speckyboy.com/plugins-sketch-app/
Informações: https://medium.com/sketch-app
Comunidade: https://www.facebook.com/sketchapp/
Plataforma: Mac
Valor: $99 Obamas (mas possui versão trial)
04. Zeplin
Zeplin é o plugin mais conhecido/famoso para o Sketch. É utilizado para trabalhos colaborativos entre designers e desenvolvedores. Ele ajuda os desenvolvedores a verificar de forma MUITO fácil as especificações das UI — os desenvolvedores não precisam ficar perguntando aos designers detalhes da interface(cor, tamanho de fonte, espaçamento,etc). O plugin exporta todas as propriedades em um arquivo CSS.
Site: https://zeplin.io
Informações: https://medium.com/zeplin-gazette
Comunidade: https://www.facebook.com/zeplin.io/
Plataforma: Mac e Windows
Valor: Free
05. Stage & Gallery
Após a aquisição da Pixate e da Form pelo Google, as equipes por trás de ambos os softwares estão trabalhando juntas em novas ferramentas de design.
Stage é uma ferramenta de protótipos de interação, uma mistura de Pixate e Form.
Gallery é um conjunto de ferramenta de colaboração — funciona como uma espécie de Github para designers (possui controle de versão, compartilhamentos de arquivos, comentários de projetos, etc).
Ambos os aplicativos estão programados para serem lançados esse ano (2017). Alguns sites especializados em tecnologia, especulam que as aplicações podem fazer uso da plataforma de nuvem do Google.
Site Stage https://material.io/stage/
Site Gallery: https://material.io/gallery/
Plataforma: Mac e Windows
Valor: Free (aparentemente)
06. Framer
De todas as ferramentas de prototipagem mencionadas neste post, Framer tem a mais alta curva de aprendizado. Ao contrário de outras ferramentas de prototipagem, aqui se utiliza codificação CoffeeScript*. Em versões anteriores, os designers tinham de digitar manualmente o código, mas uma versão lançada em meados de 2016 (maio, eu acho) e foi introduzido o auto-code para reduzir a codificação manual.
* Em linhas gerais, é um tipo de linguagem JavaScript que aceita sintaxe de Ruby e Python. A linguagem tem bastante seguidores na comunidade Ruby. CoffeeScript http://coffeescript.org/.
Site: https://framerjs.com/
Informações: https://blog.framerjs.com/
Comunidade: https://www.facebook.com/groups/framerjs/
Plataforma: Mac e Windows
Valor: $15 Obamas (mas possui versão trial)
Curiosidades
- Invision adquiriu a Macaw e logo depois EASEE e Muzli (TechCrunch, TheNextWeb, InvisionBlog)
- Marvel adquiriu POP (TechCrunch)
- Figma está trabalhando em coisas interessantes
- Adobe está tentando recuperar o atraso
Concluindo
Muita gente irá questionar: “E o InVision? Ele é uma ferramenta de prototipação!”. Sim. Mas ele não é uma ferramenta de criação — por enquanto. O InVision é uma ótima ferramenta para testes, controle de versão e apresentações — ele precisa de outras ferramentas para “criar conteúdo”.
Como já disse em outras ocasiões, a melhor ferramenta é aquela que resolve o seu problema de forma rápida. A ferramenta não vai te tornar um super designer ou mestre da prototipação, ela te deixa mais produtivo.
Já usei (profissionalmente, a vera, pra valer) Framer, Sketch e o Figma — mas atualmente me sinto mais à vontade e produtivo com o Adobe XD.
Se eu tivesse que apostar uma grana em uma ferramenta para ficar de olho nesse ano de 2017, eu apostaria no Adobe XD e na Figma. Deixaria o Invision em “banho Maria” por causa das suas recentes aquisições.
Tem alguma sugestão de ferramenta? Adicione nos comentários e compartilhe.
Referência
The most promising design tools you should try in 2017
The state of design tools in 2017
Stuff
www | linkedin | twitter | instagram
Gosto de ouvir opiniões, se tiver alguma; estamos aí!
No bullshit. No gimmicks. You got it! I make money not art.
