“Criar designs e protótipos de alta fidelidade no Figma” é o quinto curso de um programa de certificação que vai lhe fornecer as habilidades necessárias para se candidatar a empregos de nível básico em design de experiência do usuário (UX, na sigla em inglês). Neste curso, você seguirá tutoriais passo a passo para aprender como criar designs de alta fidelidade chamados de maquetes no Figma, uma ferramenta de design muito usada. Depois, você transformará esses designs em um protótipo interativo que funciona como um produto final. Você realizará pesquisas para coletar feedback sobre seus designs e fazer melhorias. Por último, você aprenderá a compartilhar seus designs com as equipes de desenvolvimento e a destacar seu trabalho no seu portfólio profissional
Criar designs e protótipos de alta fidelidade no Figma
Criar designs e protótipos de alta fidelidade no Figma
This course is part of Google UX Design (PT) Professional Certificate
Instructor: Google Career Certificates
6,161 already enrolled
Included with
110 reviews
110 reviews
What you'll learn
Criar maquetes e protótipos de alta fidelidade na ferramenta de design Figma.
Definir e aplicar elementos e princípios comuns de design visual.
Demonstrar como os sistemas de design podem ser usados para organizar, padronizar e aprimorar designs.
Compreender a função das sessões de crítica de design e do feedback para gerar iterações dos designs.
Skills you'll gain
- Usability Testing
- Usability
- Design Reviews
- Software Design Documents
- User Experience Design
- Digital Design
- Typography
- Design Elements And Principles
- Graphic and Visual Design
- User Research
- User Interface and User Experience (UI/UX) Design
- Interaction Design
- Mockups
- User Experience
- Software Documentation
- User Interface (UI) Design
- Prototyping
- Peer Review
Tools you'll learn
Details to know
Add to your LinkedIn profile
39 assignments
Build your Design and Product expertise
- Learn new concepts from industry experts
- Gain a foundational understanding of a subject or tool
- Develop job-relevant skills with hands-on projects
- Earn a shareable career certificate from Google
There are 6 modules in this course
Concentre-se no design visual, que é a aparência de um produto ou tecnologia para os usuários. Nesta parte do curso, você vai começar a criar mockups, que são designs de alta fidelidade que representam um produto final. Para criar mockups, você vai usar elementos de design visual, como tipografia, cor e iconografia. Esses elementos costumam ser organizados em layouts usando métodos como grades, contenção e espaço negativo. Você vai aplicar todos esses aprendizados de design visual na criação dos designs do aplicativo móvel em que você tem trabalhado ao longo do programa de certificação.
What's included
16 videos24 readings12 assignments1 peer review2 discussion prompts2 plugins
16 videos•Total 52 minutes
- Introdução ao Curso 5: Criar designs e protótipos de alta fidelidade no Figma•2 minutes
- Kunal - Minha jornada até a UX•3 minutes
- Boas-vindas à semana 1•2 minutes
- Introdução a mockups•4 minutes
- Chikezie - Transição de designs de baixa fidelidade para alta fidelidade •2 minutes
- Introdução a elementos fundamentais do design visual •2 minutes
- Tipografia no design de UX•3 minutes
- A importância da tipografia •6 minutes
- Colorir um design de UX•8 minutes
- Iconografia no design de UX•5 minutes
- Adicionar imagens aos seus mockups•3 minutes
- Introdução a layouts•1 minute
- Usar grades para orientar layouts •4 minutes
- Usar contenção em layouts•3 minutes
- Usar espaço negativo (em branco) em layouts•4 minutes
- Finalização: Fundamentos da criação de mockups •1 minute
24 readings•Total 230 minutes
- Boas-vindas ao Curso 5•10 minutes
- Opcional - Leia caso este seja seu primeiro curso do programa de certificação•10 minutes
- Opcional - Interprete os resultados do seu teste•5 minutes
- Habilidades fundamentais para criar mockups no Figma•10 minutes
- Exemplar de atividade: Usar designs de baixa fidelidade para iniciar os mockups do seu projeto de portfólio•10 minutes
- Trabalhar com tipografia em mockups•10 minutes
- Adicionar copy do produto a mockups•10 minutes
- Exemplar de atividade: Adicionar tipografia aos mockups do seu projeto de portfólio•10 minutes
- Trabalhar com cores em mockups •10 minutes
- Considerações de acessibilidade em relação a cores•10 minutes
- Exemplar de atividade: Adicione cores aos seus mockups do projeto do portfólio •10 minutes
- Trabalhar com ícones em mockups •10 minutes
- Exemplar de atividade: Adicione ícones aos seus mockups do projeto do portfólio•10 minutes
- Saiba mais elementos de design visual •10 minutes
- Encontrar imagens de estoque para mockups•10 minutes
- Outras considerações de design•10 minutes
- Criar grades em mockups•10 minutes
- Exemplar de atividade: Crie grades nos seus mockups do projeto de portfólio•10 minutes
- Criar contenção em mockups•10 minutes
- Exemplar de atividade: Crie contenção nos seus mockups do projeto de portfólio•10 minutes
- Usar espaço negativo em mockups•10 minutes
- Exemplar de atividade: Revise os mockups do seu projeto de portfólio adicionando espaço negativo•10 minutes
- Padrões comuns de design em aplicativos•10 minutes
- Glossário•5 minutes
12 assignments•Total 314 minutes
- Opcional - Teste seus conhecimentos sobre conceitos anteriores•42 minutes
- Opcional - Envie a instrução escolhida para o projeto de portfólio•30 minutes
- Atividade: Usar designs de baixa fidelidade para iniciar os mockups do seu projeto de portfólio•30 minutes
- Teste seus conhecimentos sobre tipografia•8 minutes
- Atividade: Adicionar tipografia aos mockups do seu projeto de portfólio•30 minutes
- Teste seu conhecimento sobre cor•4 minutes
- Atividade: Adicione cores aos seus mockups do projeto do portfólio •30 minutes
- Atividade: Adicione ícones aos seus mockups do projeto do portfólio•30 minutes
- Atividade: Crie grades nos seus mockups do projeto de portfólio•30 minutes
- Atividade: Crie contenção nos seus mockups do projeto de portfólio•30 minutes
- Atividade: Revise os mockups do seu projeto de portfólio adicionando espaço negativo•30 minutes
- Autorreflexão: Compartilhe o que você aprendeu sobre layouts de página•20 minutes
1 peer review•Total 60 minutes
- Desafio semanal 1: Aplicar elementos de base de design visual aos mockups do projeto do portfólio•60 minutes
2 discussion prompts•Total 20 minutes
- Compartilhe um exemplo de tipografia interessante em um app •10 minutes
- Compartilhe um exemplo dos ícones do seu app favorito•10 minutes
2 plugins•Total 25 minutes
- Construa um modelo a partir de elementos fundamentais•15 minutes
- Teste seus conhecimentos sobre contenção e espaço negativo no design•10 minutes
Nesta parte do curso, você vai usar princípios de design visual para refinar mockups. Primeiro, você vai usar ênfase para direcionar os usuários às partes mais importantes de uma página. Em seguida, vai aplicar hierarquia, escala e proporção para organizar os elementos em cada página do aplicativo. Em seguida, vai considerar unidade e variedade para destacar ou ajudar elementos do aplicativo a funcionarem em conjunto. Por fim, você vai rever os princípios de Gestalt, como similaridade, proximidade e região comum, para ajudar os usuários a interpretar seus designs facilmente.
What's included
8 videos11 readings7 assignments1 peer review2 discussion prompts1 plugin
8 videos•Total 29 minutes
- Boas-vindas à semana 2•1 minute
- Ênfase no design de UX•4 minutes
- Hierarquia no design de UX•4 minutes
- Escala e proporção no design de UX•5 minutes
- Unidade e variedade no design de UX•4 minutes
- Aplicar os princípios de Gestalt a mockups•6 minutes
- Reflita sobre seu progresso•4 minutes
- Finalização: Como aplicar princípios de design visual a mockups •1 minute
11 readings•Total 105 minutes
- Usar ênfase em mockups•10 minutes
- Usar hierarquia em mockups•10 minutes
- Escala e proporção em mockups •10 minutes
- Unidade e variedade em mockups •10 minutes
- Exemplar de atividade: Aplique princípios de design visual aos seus mockups do projeto do portfólio •10 minutes
- Saiba mais sobre outros princípios de Gestalt •10 minutes
- Exemplar de atividade: Aplique os princípios de Gestalt aos seus mockups do projetos do portfólio•10 minutes
- Outros elementos e princípios de design visual •10 minutes
- Saiba mais sobre os princípios de design de interface •10 minutes
- Como incluir a navegação em mockups•10 minutes
- Glossário•5 minutes
7 assignments•Total 98 minutes
- Teste seus conhecimentos sobre ênfase e hierarquia•8 minutes
- Teste seus conhecimentos sobre escala e proporção•2 minutes
- Teste seus conhecimentos sobre unidade e variedade•4 minutes
- Atividade: Aplique princípios de design visual aos seus mockups do projeto do portfólio •30 minutes
- Teste seus conhecimentos sobre os princípios de Gestalt•4 minutes
- Atividade: Aplique os princípios de Gestalt aos seus mockups do projetos do portfólio•30 minutes
- Autorreflexão: Como incluir a navegação em mockups•20 minutes
1 peer review•Total 60 minutes
- Desafio semanal 2: Aperfeiçoe seus mockups do projeto do portfólio•60 minutes
2 discussion prompts•Total 20 minutes
- Explique a lógica por trás da forma como você aplicou os princípios de design visual•10 minutes
- Explique a lógica por trás do seu uso dos princípios de Gestalt•10 minutes
1 plugin•Total 15 minutes
- Aplicar princípios de design visual•15 minutes
Venha explorar o mundo dos sistemas de design! Nesta parte do curso, você será apresentado às partes de um sistema de design, bem como aos benefícios de usá-lo. Você vai examinar os sistemas de design de várias empresas e ter a oportunidade de usá-los em seus próprios modelos. Você também vai aprender a usar e criar folhas de adesivos no Figma.
What's included
9 videos5 readings5 assignments1 discussion prompt
9 videos•Total 34 minutes
- Boas-vindas à semana 3•1 minute
- Introdução aos sistemas de design•3 minutes
- Benefícios dos sistemas de design •4 minutes
- Sistema de design do Google: Material Design•5 minutes
- Sistema de design da Shopify: Polaris •4 minutes
- Criar uma folha de adesivos no Figma•4 minutes
- Usar uma biblioteca de sistema de design no Figma•9 minutes
- Shabi – Considere tecnologias assistivas ao trabalhar em sistemas de design•2 minutes
- Finalização: Como explorar sistemas de design•1 minute
5 readings•Total 45 minutes
- Teste sistemas de design conhecidos •10 minutes
- Exemplar de atividade: Crie uma folha de adesivos para os designs de projetos de portfólio•10 minutes
- Inspire-se nos sistemas de design•10 minutes
- Opcional – Aprenda com o Figma – Use uma biblioteca de sistema de design•10 minutes
- Glossário•5 minutes
5 assignments•Total 104 minutes
- Desafio semanal 3: Explorar sistemas de design•60 minutes
- Teste seus conhecimentos sobre sistemas de design•6 minutes
- Testar seu conhecimento sobre recursos de sistemas de design de código aberto•4 minutes
- Atividade: Crie uma folha de adesivos para os designs de projetos de portfólio•30 minutes
- Testar seus conhecimentos sobre como trabalhar com sistemas de design no Figma•4 minutes
1 discussion prompt•Total 10 minutes
- Compartilhar um sistema de design de código aberto que você quer utilizar nos próprios designs•10 minutes
Dar, receber e implementar feedback é uma parte necessária do processo de design de UX. Nesta parte do curso, você vai explorar métodos eficazes para dar e receber feedback. Você também vai aprender sobre sessões de crítica de design, que serão uma parte importante do seu primeiro trabalho como designer de UX. Por fim, você vai aprender a transformar o feedback em etapas acionáveis que podem ser realizadas para revisar designs.
What's included
10 videos2 readings4 assignments2 discussion prompts1 plugin
10 videos•Total 36 minutes
- Boas-vindas à semana 4•1 minute
- Dar e receber feedbacks como designer de UX•5 minutes
- Noções básicas das sessões de crítica de design•4 minutes
- Práticas recomendadas para sessões de crítica de design•3 minutes
- Kunal – Minha experiência com sessões de crítica de design•4 minutes
- Introdução a uma sessão de crítica simulada•2 minutes
- Observar uma sessão de crítica simulada•6 minutes
- Transformar o feedback da sessão de crítica em ações•6 minutes
- Iterar em modelos com base no feedback das sessões críticas•5 minutes
- Finalização: como participar de sessões de crítica de design•1 minute
2 readings•Total 15 minutes
- Saiba mais sobre as sessões de crítica de design•10 minutes
- Glossário•5 minutes
4 assignments•Total 99 minutes
- Desafio semanal 4: Participar de sessões de crítica de design•65 minutes
- Testar seus conhecimentos sobre sessões de crítica de design•6 minutes
- Autorreflexão: solicitar feedback sobre seu trabalho•20 minutes
- Testar seus conhecimentos sobre como implementar feedback de sessões críticas•8 minutes
2 discussion prompts•Total 20 minutes
- Compartilhar os feedbacks que você recebeu•10 minutes
- Compartilhar os aprendizados da sessão de crítica simulada•10 minutes
1 plugin•Total 15 minutes
- Dar e receber feedbacks como designer de UX•15 minutes
Já está tudo pronto para você começar a criar protótipos de alta fidelidade no Figma! Seguindo seis etapas, você vai transformar seus mockups em um protótipo pronto para testes. Além disso, você vai explorar dois novos conceitos, gestos e movimentos, que podem ajudar a enriquecer a experiência do usuário e aumentar a usabilidade dos protótipos.
What's included
9 videos4 readings3 assignments1 peer review
9 videos•Total 32 minutes
- Boas-vindas à semana 5•1 minute
- Introdução aos protótipos de alta fidelidade •4 minutes
- Criar um protótipo de alta fidelidade no Figma •4 minutes
- Gestos e movimentos no design de UX •2 minutes
- Adicionar gestos e movimentos no Figma •6 minutes
- Questões de acessibilidade para gestos e movimentos •3 minutes
- Jen - Projetar pensando na acessibilidade•4 minutes
- Aprenda do Figma - Interações e feedback do protótipo •8 minutes
- Finalização: Como criar protótipos de alta fidelidade•1 minute
4 readings•Total 35 minutes
- Tipos de gestos e movimentos •10 minutes
- Saiba mais sobre protótipos no Figma •10 minutes
- Outras maneiras de aprimorar protótipos de alta fidelidade•10 minutes
- Glossário•5 minutes
3 assignments•Total 38 minutes
- Teste seus conhecimentos sobre a criação de um protótipo de alta fidelidade no Figma•10 minutes
- Teste seus conhecimentos sobre gestos e movimentos•8 minutes
- Autorreflexão: Considerar questões de acessibilidade ao projetar com movimentos •20 minutes
1 peer review•Total 60 minutes
- Desafio semanal 5: Criar um protótipo de alta fidelidade para o projeto do portfólio•60 minutes
Agora que você tem um protótipo de alta fidelidade, é hora de testar os designs. Para começar, você vai realizar um estudo de usabilidade para testar seu protótipo de alta fidelidade de um app para dispositivos móveis. Você vai analisar o feedback recebido para criar insights acionáveis e iterar em seus designs. Em seguida, vai aprender como transferir designs para engenheiros para produção. Por fim, você vai transformar tudo o que aprendeu sobre pesquisa de usuários, ideação, wireframes, designs e protótipos em um estudo de caso para seu portfólio profissional de UX.
What's included
12 videos12 readings8 assignments1 peer review3 discussion prompts
12 videos•Total 40 minutes
- Bem-vindo à semana 6•1 minute
- Planejar um estudo de pesquisa de UX•4 minutes
- Realizar um estudo de usabilidade•3 minutes
- Analisar e sintetizar os resultados do estudo de usabilidade•2 minutes
- Iterar em designs de alta fidelidade•10 minutes
- Identificar quando um design está concluído•2 minutes
- Documentar e compartilhar designs•1 minute
- Transferir designs para produção•2 minutes
- Aprender com o Figma – Preparar-se para a transferência•5 minutes
- Criar um estudo de caso para seu projeto de portfólio•7 minutes
- Finalização: Como testar e iterar designs•1 minute
- Parabéns por concluir o Curso 5: Criar designs e protótipos de alta fidelidade no Figma•2 minutes
12 readings•Total 110 minutes
- Saiba mais sobre como planejar um estudo de pesquisa de UX•10 minutes
- Exemplo de atividade: Planejar um estudo de pesquisa de UX para seu projeto de portfólio•10 minutes
- Saber mais sobre como realizar um estudo de usabilidade•10 minutes
- Exemplar de atividade: Realizar um estudo de usabilidade para seu projeto de portfólio•10 minutes
- Saber mais sobre como analisar e sintetizar os resultados do estudo de usabilidade•10 minutes
- Exemplar de atividade: Analisar e sintetizar os resultados do estudo de usabilidade do seu projeto de portfólio•10 minutes
- Exemplar de atividade: Refinar designs de projeto de portfólio de alta fidelidade•10 minutes
- Saiba mais sobre como identificar quando um design está concluído•10 minutes
- Designs finais do app para passear com cães no Figma•10 minutes
- Saber mais sobre como criar um estudo de caso para seu projeto de portfólio•10 minutes
- Glossário •5 minutes
- Comece o próximo curso•5 minutes
8 assignments•Total 160 minutes
- Atividade: Planejar um estudo de pesquisa de UX para seu projeto de portfólio•30 minutes
- Autorreflexão: Considerar o viés em seu estudo de usabilidade•20 minutes
- Atividade: Realizar um estudo de usabilidade para seu projeto de portfólio•30 minutes
- Testar seus conhecimentos sobre como criar insights de pesquisa•8 minutes
- Atividade: Analisar e sintetizar os resultados do estudo de usabilidade do seu projeto de portfólio•30 minutes
- Atividade: Refinar designs de projeto de portfólio de alta fidelidade•30 minutes
- Testar seus conhecimentos sobre a transferência de designs•4 minutes
- Testar seus conhecimentos sobre estudos de caso em portfólios de UX •8 minutes
1 peer review•Total 90 minutes
- Desafio semanal 6: Criar um estudo de caso para seu portfólio•90 minutes
3 discussion prompts•Total 30 minutes
- Compartilhar os aprendizados do seu estudo de usabilidade •10 minutes
- Compartilhar um exemplo de um estudo de caso em um portfólio de design de UX•10 minutes
- Compartilhe sua experiência no curso •10 minutes
Earn a career certificate
Add this credential to your LinkedIn profile, resume, or CV. Share it on social media and in your performance review.
Instructor
Instructor ratings
We asked all learners to give feedback on our instructors based on the quality of their teaching style.
Offered by
Offered by
Grow with Google is an initiative that draws on Google's decades-long history of building products, platforms, and services that help people and businesses grow. We aim to help everyone – those who make up the workforce of today and the students who will drive the workforce of tomorrow – access the best of Google’s training and tools to grow their skills, careers, and businesses.
Why people choose Coursera for their career
Felipe M.
Jennifer J.
Larry W.
Chaitanya A.
Learner reviews
110 reviews
- 5 stars
96.36%
- 4 stars
2.72%
- 3 stars
0%
- 2 stars
0.90%
- 1 star
0%
Showing 3 of 110
Reviewed on Jun 5, 2024
Muito bom. Engloba todo o processo de finalização do primeiro projeto que começou a ser desenvolvido do curso 2 até aqui. As aulas e os materiais disponíveis são ótimos.
Reviewed on Oct 13, 2022
Muito bom, chega a ser perfeito . Mas é preciso sempre ter animo por que ele é longo.
Reviewed on Mar 12, 2024
É um ótimo curso, aprendi muitas coisas novas em que posso aplicar na minha carreira profissional.
Frequently asked questions
Designers de experiência do usuário (UX) têm como foco a experiência de usuários que utilizam produtos como sites, aplicativos e objetos físicos. Designers de UX tornam essas interações diárias práticas, agradáveis e acessíveis. A função de um designer de UX iniciante pode incluir ter ideias para resolver problemas e realizar pesquisas com os usuários, além de projetar wireframes, maquetes e protótipos.
Se você gosta de conversar e tem empatia com as pessoas, gosta de desenhar, pensar de maneira criativa ou prestar atenção a detalhes, um trabalho como designer de UX pode ser uma boa opção para você!
Este é o quinto de sete cursos que vão lhe fornecer as habilidades de que você precisa para se candidatar a empregos de nível básico em design de experiência do usuário. É altamente recomendável concluir os quatro primeiros cursos do Certificado de Design de UX do Google UX antes deste:
- Curso 1:Fundamentos do design da experiência do usuário (UX)
- Curso 2:Início do processo de design de UX: ter empatia, definir e idealizar
- Curso 3:Construir wireframes e protótipos de baixa fidelidade
- Curso 4:Conduzir pesquisas de UX e testar os primeiros conceitos
Como alternativa, você deve ter experiência na realização de pesquisas com usuários para ter empatia com eles e determinar problemas específicos. Você também precisa ter a capacidade de criar personas, histórias de usuários e mapas de jornada do usuário, assim como declarações de problema e propostas de valor. Você precisa saber como criar wireframes e protótipo de baixa fidelidade em papel e na ferramenta de design Figma. Além disso, é útil ter experiência na realização de estudos de usabilidade e na iteração de designs. Se você não estiver familiarizado com esses tópicos, eles são abordados nos cursos anteriores do Certificado de Design de UX do Google.
Figma e Adobe XD são as ferramentas de design ensinadas nos sete cursos do Certificado de Design de UX do Google. O foco deste curso é a criação de designs no Figma.
Também serão usadas planilhas e aplicativos de processamento de texto e de apresentação. Ao longo do programa, você usará a plataforma que escolher para criar um portfólio profissional que servirá de vitrine do seu trabalho de design de UX.
Uma das partes mais interessantes de ingressar na área de experiência do usuário é o grande número de oportunidades de trabalho disponíveis. Quase todas as empresas precisam de designers de UX para ajudar a criar produtos digitais e físicos. Embora a demanda por designers de UX continue aumentando, atualmente há uma escassez de profissionais de design de UX para preencher esses cargos.
Uma carreira em design de UX oferece a oportunidade de trabalhar como generalista, exercendo a função de designer de UX, designer de UI ou pesquisador de UX, ou como especialista, por exemplo, no cargo de designer visual ou designer de interação. Depois de concluir este programa de certificação, você poderá pesquisar todos esses cargos e encontrar a função que melhor se adequa a você.
Este é o quinto de sete cursos do Certificado de Design de UX do Google. Recomendamos que você conclua os sete cursos deste programa de certificação na ordem apresentada, porque o conteúdo e as aplicações de cada curso se baseiam nas informações apresentadas e praticadas em cursos anteriores.
To access the course materials, assignments and to earn a Certificate, you will need to purchase the Certificate experience when you enroll in a course. You can try a Free Trial instead, or apply for Financial Aid. The course may offer 'Full Course, No Certificate' instead. This option lets you see all course materials, submit required assessments, and get a final grade. This also means that you will not be able to purchase a Certificate experience.
When you enroll in the course, you get access to all of the courses in the Certificate, and you earn a certificate when you complete the work. Your electronic Certificate will be added to your Accomplishments page - from there, you can print your Certificate or add it to your LinkedIn profile.
More questions
Financial aid available,