Treinamento de prototipagem
Passos até a criação 🎨
- Um briefing com o cliente. E saber exatamente qual é a principal ação daquele projeto.
- De acordo com o briefing serão montados wireframes.
- As telas de wireframes são passadas para algum software, eu particularmente utilizo o Whimsical. Ele produz frames de baixa fidelidade.
- Tudo certo... é hora de produzir um documento de orçamento. E caso a negociação finalize, serão feitos os próximos passos.
- É a hora de partir para o design. Nessa etapa serão desenhadas as telas de alta fidelidade do software. Aqui o cliente já deve ter em mãos a identidade visual do software em questão. E para o desenvolvimento dessas tela, eu utilizo o Figma, mas também recomendo o Adobe XD, ambos são gratuitos.
- É hora de codar! 😝
Passos da criação 🧙🏾♀️
- Definir uma paleta de cores.
- Definir a tipografia. Geralmente são pegas referencias de mais usadas em desenvolvimento de UI.
- Disposição dos elementos
Instalação Figma
-
Linux
sudo apt install figma-linux -y
-
Windows & MacOS
Download Figma Desktop Apps, Mobile Apps, and Font Installers
Sites de suporte
Figma: the collaborative interface design tool.
Dribbble - Discover the World's Top Designers & Creative Professionals
Flaticon, the largest database of free vector icons
Beautiful Free Images & Pictures | Unsplash