Crafting UX: Construindo a Experiência do Usuário
Crafting UX: Construindo a Experiência do Usuário
  • 14
  • 13 934
Como Criar Protótipos no Figma Usando ChatGPT | [Passo a passo]
Quer acelerar o processo de criação de protótipos no Figma? Neste vídeo, eu vou te mostrar um prompt incrível para o ChatGPT que transforma suas ideias em um passo a passo completo para criar designs de aplicativos no Figma.
Com ele, você pode economizar tempo, organizar suas ideias e focar no que realmente importa: a criatividade!
📥 Baixe o prompt e comece agora mesmo:
craftingux.com.br/prompt-para-criar-prototipos-no-figma-com-chatgpt/
🎥 Assista e aprenda:
Como funciona o prompt.
Como ele pode simplificar seu fluxo de trabalho.
Dicas para criar protótipos mais rápidos e eficientes.
Se gostou dessa dica, deixe o like 👍 e se inscreva no canal para mais conteúdos sobre design, Figma e inteligência artificial!
📌 Quer mais?
Comente aqui o que achou e compartilhe com outros designers que podem se beneficiar dessa ferramenta!
#Figma #ChatGPT #UXDesign #Prototipação #DesignDeApps
มุมมอง: 94

วีดีโอ

Como Criar uma BARRA DE PROGRESSO ANIMADA no Figma + Dica BONUS
มุมมอง 211หลายเดือนก่อน
Neste vídeo, você vai aprender a criar uma progress bar no Figma, um elemento essencial para melhorar a experiência do usuário nos seus projetos de design! As barras de progresso ajudam a informar o andamento de uma tarefa, deixando claro que o sistema está funcionando e o que o usuário pode esperar. Vamos explorar como criar tanto uma barra de progresso linear quanto uma circular, usando anima...
Como criar TABELAS no FIGMA 2024 [RESPONSIVA]
มุมมอง 2992 หลายเดือนก่อน
No vídeo de hoje, você vai aprender a criar uma tabela responsiva no Figma utilizando o poderoso recurso de Auto Layout! Esse é um dos truques mais importantes para designers de interfaces, já que permite que suas tabelas se adaptem automaticamente a diferentes tamanhos de tela - essencial para projetos web e mobile. Se você quer criar tabelas mais dinâmicas e eficientes, sem perder tempo ajust...
Criando tabela no Figma [MUITO FÁCIL]
มุมมอง 5983 หลายเดือนก่อน
Mais um vídeo de Figma aqui no canal, e nesse video eu vou te dar uma dica bem simples e bem rápida que vai te ajudar muito nos seus protótipos. Hoje eu vou mostrar como criar tabelas no Figma de um jeito bem simples. Não existe só esse jeito de fazer tabela aqui no figma, existe plug-in e existem vários outros modos, alguns mais fáceis e outros mais complexos. Se inscreva no canal, ative o sin...
Como Criar Uma Tela de Planos e Preços no Figma [Passo a Passo]
มุมมอง 3093 หลายเดือนก่อน
Neste vídeo, vou te mostrar como criar uma tela de Planos e Preços incrível usando o Figma! Essa tela é fundamental para quem oferece serviços online e quer apresentar suas opções de planos de forma clara e atraente aos clientes. 🔔 Se inscreva para mais tutoriais de design e UI/UX! 00:00 - Introdução 00:43 - Criando a página com colunas 02:47 - Titulo da página 05:00 - Criando o card do plano 0...
Como criar uma TELA DE LOGIN no Figma
มุมมอง 4.4K8 หลายเดือนก่อน
No tutorial de hoje, vamos aprender como criar uma tela de login no Figma, passo a passo! Se você é iniciante no mundo do design ou quer aprimorar suas habilidades, esse vídeo é para você. Vamos explorar juntos o processo de criação de uma interface de usuário amigável e funcional, utilizando a ferramenta poderosa e colaborativa que é o Figma. Desde a concepção dos elementos básicos até os deta...
Recriando o TINDER [FIGMA TUTORIAL 2024]
มุมมอง 2389 หลายเดือนก่อน
No vídeo de hoje, eu vou te ensinar como evoluir no Figma replicando um dos maiores aplicativos do momento, o Tinder. Além de aprender macetes interessantes do Figma você vai conhecer plugins e dicas de design para deixar seus protótipos ainda melhores. 0:00 introdução 0:14 info celular 6:00 parte superior 12:21 imagem 18:07 detalhe das imagens 19:08 parte inferior 25:50 prototipo finalizado Nã...
Novidade no Figma: MULTI-SELECT & MULTI-EDIT | Figma Update (2024)
มุมมอง 2139 หลายเดือนก่อน
Nesse vídeo eu vou passar pelas novas funcionalidades que o Figma lançou recentemente. Se você curtiu o vídeo, não esqueça de deixar o seu like, compartilhar com os amigos e se inscrever no canal para mais conteúdos como esse. E não se esqueça de ativar o sininho para receber notificações!
Efeito de Vidro no Figma: Cartão Transparente em 6 Minutos!💎✨
มุมมอง 3219 หลายเดือนก่อน
E ai pessoal? No video de hoje vamos fazer o efeito de vidro no Figma. Esse efeito que ficou popular com a apple tanto no Iphone quanto no Mac vai te ajudar a deixar seus designs ainda mais modernos e atrativos. E hoje vamos criar um cartão transparente no estilo do nubank para aprender essa técnica no Figma! Bora pro vídeo!
Botão ANIMADO no Figma + Material Design 3!
มุมมอง 8149 หลายเดือนก่อน
Olá pessoal! No video de hoje, nós vamos aprender como criar um botão animado para deixar seus protótipos no Figma cada vez mais reais. Esse botão terá os efeitos de hover quando passamos o mouse por cima dele e pressed quando a gente pressionar ele. Conheça o Material design 3: m3.material.io/ Aprenda a criar um campo para formulário animado no Figma: th-cam.com/video/PTFNXstplfk/w-d-xo.html
Como criar um INPUT FIELD para seu FORMULÁRIO no Figma
มุมมอง 5K10 หลายเดือนก่อน
Aprenda como criar um input field de texto ANIMADO no Figma usando componentes iterativos. Nós vamos nos basear nos exemplos do que há de mais moderno em UI e UX design para gerar esse campo animado para os seus protótipos. No final você poderá criar input text fields lindos e repressivos, deixando seus protótipos ainda mais elegantes. Qualquer dúvida deixe um comentário que ajudarei com o maio...
Aprenda a animar texto no Figma | Figma Tutorial
มุมมอง 1.3K10 หลายเดือนก่อน
Você já quis criar um texto animado igual ao desses sites bonitos? Se sua resposta foi sim, você está no vídeo certo. Por que nesse vídeo eu vou te mostrar como fazer essa animação avançada no Figma em apenas cinco minutos. #figma #uxdesign #uidesign #userexperience #animatedtext #likeapro #comofazer

ความคิดเห็น

  • @rhaqueldesouzasilva5440
    @rhaqueldesouzasilva5440 24 วันที่ผ่านมา

    Oii, e quando eu preciso criar uma ação ao pressionar, exemplo, quando seleciono um email no gmail, eu seguro e o estado muda para selecionado, cmo prototipar algo parecido? Pode me dar uma luz?

    • @construindoux
      @construindoux 19 วันที่ผ่านมา

      Oi, você pode usar a propriedade "while pressed" (quando pressionado) e cria um estado para isso.

  • @florzinha007
    @florzinha007 25 วันที่ผ่านมา

    Eu não tenho o Constraints 😢😢 como faço pra arrumar isso??

    • @construindoux
      @construindoux 19 วันที่ผ่านมา

      faz com as variantes, é só criar uma variante para cada estado e fazer a iteração entre elas

  • @orazionarducci4872
    @orazionarducci4872 หลายเดือนก่อน

    Outra pergunta, agora mais complexa: suponha que uma das colunas se refere a área em m2. Digamos que eu queira exibir também a largura e a altura desta área num combo box na célula correspondente. Quando o ComboBox está aberto ele exibe cada dimensão e ao mesmo tempo expande a largura da linha inteira. Tem jeito de reproduzir isso no Figma?

    • @construindoux
      @construindoux หลายเดือนก่อน

      Cara, é um pouco mais difícil mas eu acho que é possível sim. Cria um componente do combobox a parte com as iterações que ele terá (acredito que as opções de largura e altura quando clicar no combobox) e depois insere esse combo box (a variante dele antes de mostrar altura a largura) dentro da coluna na tabela. Estou preparando um vídeo ensinando a criar combobox no figma e já posso dar esse exemplo de utilização dentro de uma tabela. Fica de olho nos novos videos.

  • @orazionarducci4872
    @orazionarducci4872 หลายเดือนก่อน

    Tem como deixar cada coluna com largura apropriada ao seu conteúdo? por exemplo: as colunas (Código, descrição, valor, cliente).

    • @construindoux
      @construindoux หลายเดือนก่อน

      Opa, tem sim, é só pegar o grupo da coluna e diminuir a largura toda dele.

  • @joaosousa2059
    @joaosousa2059 หลายเดือนก่อน

    por alguma razão nao funciona mais... Segui tudo certo e fica fixo no primeiro texto

    • @construindoux
      @construindoux หลายเดือนก่อน

      @joaosousa2059 funciona sim, até refiz com as ultimas atualizações do Figma para verificar se mudou algo. Vê se Na você está criando os frames certinho e na hora de fazer o fluxo pelo prototipo está ligando texto no texto e se está usando change to e after delay.

  • @marcio013
    @marcio013 2 หลายเดือนก่อน

    Que aula meu amigo, parabéns e obrigado pelo conteúdo, me ajudou muito!

    • @construindoux
      @construindoux 2 หลายเดือนก่อน

      Fico feliz em ter ajudado!!!

  • @azybeki
    @azybeki 3 หลายเดือนก่อน

    Obrigado ❤

  • @henriqueteles8139
    @henriqueteles8139 3 หลายเดือนก่อน

    Fala, meu amigo! tô entrando agora nessa área de UI/UX e achei seu canal. Parabéns pelos conteúdos! Me tira uma dúvida? quando eu modifico a distância vertical e horizontal, nada ocorre. o que eu tô fazendo de errado? kkkk grande abraço!

    • @construindoux
      @construindoux 3 หลายเดือนก่อน

      Fala grande! Obrigado pelo apoio! Vê se você está alterando a distancia do item certo kkkkk, acontece comigo o tempo todo.

  • @azybeki
    @azybeki 3 หลายเดือนก่อน

    Vlw

  • @azybeki
    @azybeki 3 หลายเดือนก่อน

    Qual curso vc recomenda pra quem quer ser Ui design? Design Gráfico? Ou outro? Edit: sei que é uma profissão muito ampla e que tem muita coisa envolvida exige muito conhecimento, e por isso que não e só um curso e sim varios outros a mais pra assim vc expandir seu conhecimento na área, oque vc ne recomenda estudar e qual curso específico?

    • @construindoux
      @construindoux 3 หลายเดือนก่อน

      Começa aprendendo um pouco das ferramentas, exemplo o próprio figma. Depois procura cursos de design de interface. Depois UX design e assim vai

    • @azybeki
      @azybeki 3 หลายเดือนก่อน

      @@construindoux vlw

  • @azybeki
    @azybeki 3 หลายเดือนก่อน

    Vlw

  • @azybeki
    @azybeki 3 หลายเดือนก่อน

    Mano vc e muito bom

  • @azybeki
    @azybeki 3 หลายเดือนก่อน

    Tem alguma forma de fazer isso pelo Android?

    • @construindoux
      @construindoux 3 หลายเดือนก่อน

      O figma tem o aplicativo para android, não é muito legal de mexer mas da pra fazer. Se você quiser mudar esse layout para android, na hora de criar, temos o padrão de frames para dispositivos móveis.

    • @azybeki
      @azybeki 3 หลายเดือนก่อน

      @@construindoux blz vou ver dps

  • @azybeki
    @azybeki 3 หลายเดือนก่อน

    Muito man, acho que finalmente achei qual profissão seguir tenho 20 anos é não sabia qual profissão seguir então dps de pesquisar muito sobre ui design desde 2023 vim pesquisando é agora tô 60% ciente que essa profissão é pra min eu gosto eu curto bastante, porém oque ne deixa desanimado é a IA sim tem algumas IA que fazem UI design é isso me deixa pensante dms oque vc acha ? Sera que a profissão Ui design pode ser "extinta" se a IA de Ui design se torna algo 30x ou 50x mais melhor e eficiente? Disso que eu tenho medo...

    • @construindoux
      @construindoux 3 หลายเดือนก่อน

      Fala garoto! Fico feliz que tenha interesse em vir para essa área! Cara, com essa vinda com tudo da IA acho que todo mundo teve medo, mas já estamos entrando numa fase de entender o que a IA faz bem e o que ela não faz. Nós devemos ver a IA mais como uma ferramenta que vai melhorar nosso trabalho do que como algo que vai roubar ele. É importante a gente dominar o uso dessas IAs para ajudar a gente no nosso trabalho. Fica tranquilo e pode vir que essa área não vai parar :D

    • @azybeki
      @azybeki 3 หลายเดือนก่อน

      @@construindoux blz vlw pelo conselho

  • @fernanda50497
    @fernanda50497 3 หลายเดือนก่อน

    Como eu faço pra aparecer um texto quando Clico invez do cursor piscando?

    • @construindoux
      @construindoux 3 หลายเดือนก่อน

      Em vez de usar a variante do cursor na ação de clique, crie uma de texto

    • @fernanda50497
      @fernanda50497 3 หลายเดือนก่อน

      @@construindoux obrigada 😁

    • @JJSilva89
      @JJSilva89 3 หลายเดือนก่อน

      ​​​@@construindoux E caso eu queira usar ambas (barra e texto) crio uma variável booleana? Enquanto não digitar a barra é true, após digitar a barra é false? Conteúdo top, man! 🤔👏

    • @construindoux
      @construindoux 3 หลายเดือนก่อน

      @@JJSilva89 Eu nunca precisei fazer algo desse tipo, mas na teoria, seria assim mesmo!

  • @muttermendes5173
    @muttermendes5173 3 หลายเดือนก่อน

    Irmão, como posso fazer pra conseguir digitar no input do figma? Queria que fosse possivel pois estou realizando um projeto e seria ótimo se vc puder me ajudar. Vlw paizão ótimo vídeo!

    • @construindoux
      @construindoux 3 หลายเดือนก่อน

      Fala irmão, grato pelo comentário! Cara, o Figma não tem uma função específica pra isso, quando precisamos fazer, a gente usa as iterações do prototipo colocando letra por letra.

  • @grc__
    @grc__ 3 หลายเดือนก่อน

    ótimo vídeo

  • @WendellOscar-zz6js
    @WendellOscar-zz6js 4 หลายเดือนก่อน

    Topppp

  • @FrancianeAquino-d1o
    @FrancianeAquino-d1o 4 หลายเดือนก่อน

    Gostei! Muito obrigada! sabe dizer como salvar em formato .rar no pc depois de pronto?

    • @construindoux
      @construindoux 4 หลายเดือนก่อน

      O figma permite você exportar o prototipo em png, jpg, svg e pdf. Depois disso você pode compactar para formato .rar

  • @marcelo_math
    @marcelo_math 4 หลายเดือนก่อน

    Valeu, campeão! Tens o meu like e subscrição.

    • @construindoux
      @construindoux 4 หลายเดือนก่อน

      Obrigado querido!

  • @eduardomendesdearaujo439
    @eduardomendesdearaujo439 4 หลายเดือนก่อน

    Tem alguma forma de exportar o protótipo em formato de vídeo ?

    • @construindoux
      @construindoux 4 หลายเดือนก่อน

      Se você for em exportar talvez tenha alguns formatos de video, se não tiver, talvez exista algum plugin.

  • @ericmuramatsu
    @ericmuramatsu 4 หลายเดือนก่อน

    Começando agora no figma. Muito didático. Ganhou um seguidor

    • @construindoux
      @construindoux 4 หลายเดือนก่อน

      Obrigado por incentivar meu trabalho! Espero ter ajudado

  • @sheltonfaustino1876
    @sheltonfaustino1876 5 หลายเดือนก่อน

    Você e melhor

  • @iriscax
    @iriscax 5 หลายเดือนก่อน

    excelente vídeo! existe alguma forma de melhorar o protótipo, inserindo, por exmeplo, formas do usuário digitar os dados e aparecer?

    • @construindoux
      @construindoux 4 หลายเดือนก่อน

      Tem algumas formas de fazer, mas talvez dê muito trabalho que não valha a pena.

  • @Louis-dk5kt
    @Louis-dk5kt 6 หลายเดือนก่อน

    Continue criando esses tutoriais, por favor hahaha!!! Me ajudou muito!!!

    • @construindoux
      @construindoux 4 หลายเดือนก่อน

      Vou continuar sim, obrigado pelo apoio!

  • @saravitoria5559
    @saravitoria5559 6 หลายเดือนก่อน

    Nossa amei o vídeo o único que me ensinou de verdade, tinha visto vários vídeos de famosos e nenhum teve essa eficiência para ensinar.me ajudou muito

    • @construindoux
      @construindoux 6 หลายเดือนก่อน

      Fico feliz em conseguir ter ajudado!

  • @hebertribeiro2253
    @hebertribeiro2253 6 หลายเดือนก่อน

    Parabéns , ficou muito intuititvo e prático.

    • @construindoux
      @construindoux 6 หลายเดือนก่อน

      Muito obrigado!

  • @izahaguiar
    @izahaguiar 7 หลายเดือนก่อน

    como anexar a uma landing page tmb feita no figma? (com um botão de direcionamento)

    • @construindoux
      @construindoux 6 หลายเดือนก่อน

      Você pode copiar ela do fluxo que vc criou e colocar ela dentro do documento do figma da tela de login. Ai no botão vc faz o direcionamento pro fluxo que vc precisa.

  • @gustavogalvao3299
    @gustavogalvao3299 7 หลายเดือนก่อน

    MUITO BOM MANO, vlw

    • @construindoux
      @construindoux 7 หลายเดือนก่อน

      Muito obrigado!

  • @stephaneleandro4515
    @stephaneleandro4515 7 หลายเดือนก่อน

    esse vídeo me ajudou muitoo. você poderia gravar um ensinando criar um teclado e codificar?

    • @construindoux
      @construindoux 7 หลายเดือนก่อน

      Fico feliz em ter ajudado. Em breve vai sair um vídeo com esse conteúdo.

  • @amaurymachado3711
    @amaurymachado3711 9 หลายเดือนก่อน

    Bom dia to com um problema no figma quando eu importo pro great pages ele.fica ok no desktop.mais nao versao mobile ele fica pequeno mesmo fazendo as alterações alguem pode.me ajudar ?sabe como resolver.?

    • @construindoux
      @construindoux 9 หลายเดือนก่อน

      Você está gerando o código html e importando no great pages?

    • @amaurymachado3711
      @amaurymachado3711 9 หลายเดือนก่อน

      @@construindoux nao , eu estou expostando em jpeg

    • @construindoux
      @construindoux 9 หลายเดือนก่อน

      Tenta criar um novo protótipo com um novo frame, e na hora de criar o frame escolhe alguma das opções de phone, isso pode resolver.

  • @LMatheusFS
    @LMatheusFS 10 หลายเดือนก่อน

    Eu ainda não tinha visto um conteúdo desse em português. Me ajudou bastante