Figma - Criando interfaces do zero até o protótipo final
- Conhecendo a ferramenta
-
Mão na massa!
Definindo os estilos e criando a splashScren00:08:29Criando a tela de login e senha00:13:26Criando o cabeçalho e instalando plugins00:12:40Desenhando as categorias com grids00:13:26Scroll na horizontal00:12:35Fixando elementos durante o scroll00:05:26Desenhando a tela de detalhes00:15:24Configurando o protótipo navegável00:05:19Compartilhando projeto e colocando comentários00:04:34
Camila Yukari Yatabe
17/07/2023
Oi prof, tudo bem? não sei se vai responder pq esse curso é de uns anos atrás, mas quando eu estou mexendo com o frame das recomentações, o texto mexe junto e desconfigura. Sendo que conmfigurei os constraints como Left e Top, que nem o senhor ensinou. Poderia me ajudar com isso? Saberia me dizer onde estou errando? Muito obrigada desde já! Estou adorando o curso!
Letícia Serra
09/04/2023
nao encontro a opção de google nexus pra device no meu figma
Kamila Soares
20/02/2023
Olá, eu estou colocando no prototype a home, mas nao aparece os grids dos alimentos, fica em branco, aparecendo somente o banner e o scroll. O que eu faço?
Clarissa Maria Sales de Souza
29/03/2022
Boa tarde, professor! As aulas são ótimas, parabéns pela didática.
Tenho uma dúvida, a última caixinha de comentários do meu scrool fica sem margem em relação a tela do celular, deixei até o frame um pouco maior para ver se resolvia, mas não resolveu. Link do meu protótipo: https://www.figma.com/proto/ca3gdLEMkbs7j6AMLbgycs/aula-pratica?node-id=5%3A80&scaling=min-zoom&page-id=0%3A1&starting-point-node-id=3%3A15
Alexsane Soares Souza
14/02/2022
Boa tarde professor! Quando coloco para visualização minha tela aparece esmagada e desproporcional, saberia me dizer o por que? obrigada.
Samuel Seixas Magalhães
11/02/2022
Boa tarde! Não consegui encontrar a opção "prototype" =(
Taynara Ramires Conceição dos Santos
22/01/2022
Queria dizer que estou gostando muito do curso, você explica muito bem, já estou me sentindo bem familiarizada com o programa que antes eu tinha receio de usar, estou muito animada, obrigada pelo conteúdo, muito bom mesmo!!
Denise da Silva Costa
17/07/2021
Olá Professor, na parte de executar o prototype no momento em que tem a parte de promoção da semana, etc. Só aparece a partir da primeira foto do cardápio, o restante que diz " o que voce está procurando" e tals não aparece. O que pode ser ?
Maira Teresinha Lopes Penteado
18/06/2021
Gente! O curso é fantástico, mas temos direito a certificado?
Olá Maira, sim, no final do curso você pode emitir um certificado.
Obrigado por acompanhar.
caroline chirnev
19/05/2021
Bom dia, professor, tudo bem?
Quando coloquei para visualizar o app no protótipo, a imagem fica menor que a tela, mas assim que ativo tela inteira a imagem preenche o protótipo, fiquei na dúvida se está certo ou não?
Luiz Gabriel Silva de Araujo
22/04/2021
Olá, professor! Fiz igual você mostrou no vídeo e tudo funcionou muito bem. Mas a letra dos depoimentos ficaram pequenas e eu gostaria de aumenta-las, mas não sei como fazer isso pois não consigo ver os demais depoimentos. Já fui no Frame que criei e desmarquei a caixa de "Clip content" mas mesmo assim não consigo visualizar os outros depoimentos.
Olá, você tem que desmarcar o "clip content" do frame geral também, que engloba tudo, assim você irá conseguir ver eles.
Nesse seu caso tem 2 frames com clip content, o do design, e o do scroll.
Keven Guilherme Cruz Santos
13/04/2021
tem como eu fazer esse scroll mas eu só pode funcionar se eu clicar na seta ?
Camila De lima chaves
08/04/2021
olá professor, fiz todos os passos mas não sei porque qnd tento visualizar ele pronto no phototype não aparece proporcional a medida do celular, fica pequeno.
Karoline Freitag
28/03/2021
Olá Wilian quando coloco para visualizar no modelo do celular que escolhi, a tela não fica toda. Como faço para concertar?
Gustavo Veronési
22/03/2021
Fiz todos os passos para o scroll na horizontal e não funcionou. Pq?
Caroline Bossle
18/02/2021
Professor qual o melhor meio de fazer edições nas caixinhas de recomendações depois que elas já estão dentro do frame scroll? Devo desfazer o frame pra poder editar ou arrasto os elementos nas layers lá para o topo? Obrigada
Olá Caroline, você pode clicar no seu frame, e desmarcar a opção clip content, assim você irá conseguir ver as caixinhas que estão oculta no scroll.
Gabriel Cordeiro
09/02/2021
quando seleciono o frame para fazer o scroll, não acontece esse corte que você mencionou no minuto 11:31! o figma seleciona todo o frame e redimensiona ele ao invés de cortar, como faço para resolver isso? obrigado
fabiana moreira
26/11/2020
Olá, bom dia! Quando coloco para visualizar em Google Nexus 5x, o protótipo fica bem pequeno dentro da tela. Consegue saber se posso estar fazendo algo errado? No caso, os tamanhos dos frames são 360 x 640, somente a tela home que a altura é maior. Mas nenhuma fica perfeito na visualização conforme seu vídeo.
Outra coisa, estava funcionando ontem o Scroll de depoimentos, hoje não está funcionando e está tudo ok: Clip Content, Prototype: Horizontal Scrolling. Saberia me falar se tem algo de errado que estou fazendo?
Diego Galofero Aureliano da Silva
16/11/2020
Consegui fazer camarada. Estava com dificuldade mas eu consegui.
Diego Galofero Aureliano da Silva
13/11/2020
Olá, Fiz cada passo com sua aula mas meu scroll não está rolando. Tem alguma dica do que eu pude ter feito errado? Aparece a primeira caixa de comentário e metadinha da outra e só.
Gabriel Cipriani Rodrigues
26/10/2020
Minhas fotos do unsplash ficam com baixíssima qualidade, vc sabe porque?
Olá Gabriel, a imagem fica em baixa resolução por que ela fica do tamanho exato do seu quadrado.
Uma alternativa é criar um quadrado 10x maior, e depois aplicar a imagem dentro dele, então na hora de reduzir você não irá perder a qualidade.
Outra opção é salvar a imagem no seu computador, e importar arrastando para o figma, assim você irá manter o tamanho original da imagem.
Gabriel Menezes
03/09/2020
Bom dia professor, primeiramente gostaria de agradecer por disponibilizar esse curso e parabeliza-lo pela excelente didática.
Tenho uma dúvida quanto ao Prototype, na pagina de login quando eu coloco uma imagem de fundo ela fica fixa e os outros elementos ficam se movendo sobre a imagem. Há alguma maneira de resolver isso? obg
Monica Borio
22/07/2020
Tô adorando o curso. Obrigada!!! Tenho uma dúvida sobre o tamanho da tela. Quando aumento a altura do frame as vezes os elementos dentro dela esticam junto. Como resolvo isso?
Olá Monica, selecione todos os seus objetos, e na opção constraints, veja se estão configurados como Left e Top, caso contrário esses elementos serão arrastados junto quando você aumentar seu layout. Eu explico mais sobre isso na aula "Desenhando as categorias com grids", logo no início.
Kamila Kelly Cardoso de Lima
23/05/2020
Professor, no modo de visualização o scrolling não ta funcionando. Fiz com cautela o passo a passo e já vi o vídeo varias vezes, não entendo porque não ta funcionando.
Francine Michelon De Carli
21/04/2020
Professor, funcionou tudo direitinho quando eu fiz da primeira vez, mas percebi que tinha esquecido de alterar uma das fotos. Arrastei pra fora e mudei a foto, mas não consegui mais fazer o esquema de encolher os outros comentários. Teria uma forma mais fácil de alterar essas informações que estão em um formato de scroll ou eu precisaria sempre arrastar pra fora do frame, fazer as edições e jogar tudo pra dentro de novo e reconfigurar? No aguardo. Obrigada. PS: adorei seu método, bem fácil de acompanhar e aprender!
Olá Francine, você pode navegar pelas fotos no seu painel da esquerda (Layers), com isso mesmo a foto estando oculta, você irá conseguir selecionar e depois edita-lá pelas propriedades que vai se abrir na barra direita.
jhonatas Lima Moura
19/04/2020
Boa tarde professor!
Fiz tudo q o senhor pediu, executei cada etapa, porém quando vou p o modo de visualização, alguns elementos n aparecem como planejado? O que será q eu fiz de errado?
Olá jhonatas, se os elementos não estão aparecendo na visualização, é por que provavelmente você deixou eles para fora do frame, verifique na sua barra esquerda lateral, e arraste eles para dentro do seu frame que irá aparecer.