[DESATUALIZADO] O que é Prototipação (prototype) em design + Ferramentas | Bootcampinho UI/UX Design
Por Maiane Gabriele em 12 de dezembro de 2022
Você sabe o que é a prototipação (prototype) no processo de design? Aprenda nessa aula o que é, ferramentas e muito mais!
Compartilhe!
🔴🔴🔴 ATENÇÃO! 🔴🔴🔴
Esta aula está desatualizada. A nova aula, focada em Figma, se encontra na página Curso de Figma.
Quando eu gravei o curso eu falava bastante do XD. Porém, o cenário mudou bastante desde a Adobe anunciou a intenção de comprar o Figma (no momento a compra ainda está embolada). Porém, o XD deixou de receber atualizações relevantes desde então. Por esse motivo, nesse momento, pensando em ferramentas de mercado:
Recomendo que vocês utilizem o Figma para o curso.
No momento é a ferramenta mais forte e de longe a mais utilizada pelas empresas. Porém, sempre cuidem para estar atentos ao cenário de design e ficar de olho caso novas ferramentas surjam.
[/div]
🐮 Desafio do Alfred
Desafio (obrigatório)
- Prototipação: comece a navegar no Figma e tente crie, pelo menos, duas telas do seu projeto.
- Dica: tente começar o seu projeto de forma estruturada, pensando na criação de variáveis, estilos, componentes e similares.
Desafio Extra (opcional)
- Selecione de 1 a 3 designs já existentes, que você julgue serem bons exemplos de design. Se preferir, utilize algumas dessas ideias:
- Referências no Dribbble
- Referências no Behance
- Busque empresas, startups ou similares que você julgue que faça um bom trabalho online.
- Após selecionar os designs, recrie (copie, sem colocar a tela original embaixo) três telas em sua ferramenta de prototipação preferida.
- Atenção! Este exercício é apenas para estudo. De forma alguma divulgue dizendo que é um layout seu, que você inventou ou algo doido assim.
- Enquanto copia os layouts, tente identificar:
- Quais tamanhos de tipografia foram utilizados?
- Quais cores foram utilizadas?
- Como os elementos estão alinhados?
- Quais outros padrões de design você consegue identificar?
Materiais extras
Templates Notion
Ferramentas
Guias de estudo
- 12 Mini guias gratuitos de UI/UX Design
- Get started with Figma (em inglês)
- Get started with Adobe XD (em inglês)
Playlist
Vídeos
Listas de ferramentas e métodos de UI/UX design
- Uma ampla lista de métodos e entregáveis de UX design
Diversas ferramentas de prototipação, links e entregáveis comuns nos mundos de UI/UX Design. - ‘The great’ UX design toolbox (em inglês)
Lista com cerca de 900 ferramentas que podem ser utilizadas em diversas etapas do design. - Métodos e entregáveis em UX (em inglês)
Quadro do Miro com diversas ferramentas e métodos de UI/UX Design.
Perguntas Frequentes
Não existe nenhuma pergunta frequente nesta aula. 🙁
Ainda está com dúvidas?
- Cheque as “Perguntas Frequentes” e os comentários do vídeo do YouTube da aula
- Caso ainda tenha dúvidas, deixe ela nos comentários do vídeo do YouTube da aula que você assistiu.
Sobre o Bootcampinho Gratuito UI/UX Design
Você já pensou em aprender UI/UX Design de forma gratuita, com todos os vídeos diretamente no YouTube? Não é preciso fazer cadastro, deixar seus dados nem nenhuma complicação.
É só começar a assistir e praticar.
Para ajudar você o Bootcampinho Gratuito de UI/UX Design ainda conta com roteiro bem estruturado, materiais de apoio, templates de apoio e muito mais.
Informações importantes
- Dúvidas: as dúvidas deverão ser feitas através dos comentários no YouTube. Cheque os comentários para ver se sua dúvida não foi respondida e também a página de cada aula para ver se a resposta não está nas “Perguntas Frequentes” da aula.
- Certificados: os certificados são limitados. Para mais informações, cheque a página do curso.
- Grade Completa: clique aqui para ver a grade completa do curso.
Gostou deste material?
Me ajude compartilhando!
