UX Tips
UX Tips
  • 8
  • 13 553
Como fazer variants no Figma | Dicas UX 🍍
Um tutorial para você aprender a criar variantes no Figma.
E veja também como criar interações de uma variante para outra no protótipo.
🔗 Links comentados no vídeo 🔗
Tutorial de auto-layout do Figma
ua-cam.com/video/ITrS5VUqo08/v-deo.html
Playground Welcome to Variants do pessoal do Figma
www.figma.com/community/file/903303571898472063/Figma-Variants-Playground
One Figma component - 3,360 Variants
uxdesign.cc/one-variant-to-rule-them-all-92e685bae918
---
Quer mais vídeos como esse? Escreva nos comentários o que você gostaria de ver aqui.
Confira também outros conteúdos de UX, Figma e usabilidade no www.dicasux.com.br/ - conteúdo 100% gratuito para você expandir seu conhecimento em experiência do usuário.
Переглядів: 6 232

Відео

5 dicas de plugins realmente úteis para o Figma | Dicas UX 🍍 #drops
Переглядів 4663 роки тому
Cansei de listas infinitas de plugins do Figma que nem são testados de verdade. Confira os que uso no meu dia-a-dia como UX Designer. Veja agora o post completo e comente aqui o que faltou nessa lista! www.dicasux.com.br/figma/5-dicas-de-plugins-realmente-uteis-para-o-figma/ Confira também outros conteúdos de UX, Figma e usabilidade no www.dicasux.com.br/ - conteúdo 100% gratuito para você expa...
UX Writing - Lenka Rejfířová | #carreiraUX
Переглядів 6193 роки тому
O que faz um(a) UX Designer focada em UX Writing? Confira a entrevista com Lenka Rejfířová, onde ela conta como migrou de área, suas experiências como UX Writer e como foi sua trajetória. Veja também alguns conselhos e dicas de ferramentas de UX que ela utiliza no dia a dia. LinkedIn da Lenka: www.linkedin.com/in/lenka-ux-writer/ Atualização mar/21: Entre a gravação e a publicação deste vídeo, ...
UX Research - Andréa Minichelli | #carreiraUX
Переглядів 1813 роки тому
O que faz um(a) UX Designer focada em UX Research ou pesquisa de usuário? Confira a entrevista com Andréa Minichelli, onde ela conta como migrou de área, suas experiências como pesquisadora e como foi sua trajetória. Veja também alguns conselhos e dicas de ferramentas de UX que ela utiliza no dia a dia. LinkedIn da Andréa: www.linkedin.com/in/andreaminichelli/ Hotjar, ferramenta para monitorame...
5 atalhos do Figma para você ser mais produtivo | Dicas UX 🍍 #drops
Переглядів 1,5 тис.4 роки тому
Confira esses atalhos da ferramenta de UX Figma e economize tempo no seu dia a dia! Veja agora o post completo e comente aqui o que faltou nessa lista! www.dicasux.com.br/figma/5-atalhos-figma-para-ser-mais-produtivo/ Confira também outros conteúdos de UX, Figma e usabilidade no www.dicasux.com.br/ - conteúdo 100% gratuito para você expandir seu conhecimento em experiência do usuário.
Interfaces conversacionais e VUI - Patrícia Alcântara | #carreiraUX
Переглядів 1084 роки тому
O que faz um(a) UX Designer focada em interfaces conversacionais? Confira a entrevista com Patrícia Alcântara, onde ela conta como começou na carreira de UX, suas experiências na área e como foi sua trajetória. Veja também algumas dicas de ferramentas de UX que ela utiliza no dia a dia. LinkedIn da Paty: www.linkedin.com/in/patricia-alcantara/ Quer mais vídeos como esse? Escreva nos comentários...
O que toda pessoa de UX Design deveria saber | Dicas UX 🍍 #drops
Переглядів 1764 роки тому
Confira o post completo e comente aqui o que faltou nessa lista! www.dicasux.com.br/ux/o-que-todo-ux-designer-deve-saber/ Toda engenheira precisa saber matemática? Todo arquiteto precisa saber ambientação? Toda jogadora de futebol precisa saber chutar a bola? E o que o(a) profissional de UX Design precisa saber? Conhecer Design Thinking? Excel? Figma?
Figma tutorial: Auto Layout no Figma | Dicas UX 🍍
Переглядів 4,2 тис.4 роки тому
Um tutorial no Figma para te ajudar a fazer botões ou layout com mais velocidade e de forma mais fácil. Aprenda como ganhar velocidade no Figma usando o Auto Layout. Arquivo Figma feito no vídeo: www.figma.com/file/hKarDhulxBOcvp8S25s5lG/Dicas-UX-🍍-Auto-layout?node-id=0:1 Recomendo também o post sobre o Auto Layout da própria galera do Figma: www.figma.com/blog/announcing-auto-layout/ Quer mais...

КОМЕНТАРІ

  • @nobertonunes913
    @nobertonunes913 2 роки тому

    Muito Obrigado pela aula, me ajudou muito

  • @duddamartins561
    @duddamartins561 2 роки тому

    Nossa muito bom parabéns. Você tem algum curso do figma?

    • @DicasUX
      @DicasUX 2 роки тому

      Valeu Dudda! Meu nao tenho, mas indico da Alura. Por trabalhar lá e por saber que o conteúdo é muito bom!

  • @meuspequenosvideozinhos9243
    @meuspequenosvideozinhos9243 2 роки тому

    Muito bom o conteúdo, só ache muito rápido de mais

    • @DicasUX
      @DicasUX 2 роки тому

      Vou melhorar

  • @lobodigitalsuporte
    @lobodigitalsuporte 2 роки тому

    Dá pra deixar uma property da Variant como um select pra escolher algum icone? Por exemplo, tenho varios icones pra por nos botoes, queria selecionar pelo variant ao invés de criar cada combinação possivel.

    • @DicasUX
      @DicasUX 2 роки тому

      Sim! Descobri recentemente que dá sim.

  • @julianaribeiro3904
    @julianaribeiro3904 2 роки тому

    Amei sua explicação! Muito obrigada

  • @mateusdaconceicao3732
    @mateusdaconceicao3732 2 роки тому

    show!

  • @tiagoaguena3529
    @tiagoaguena3529 3 роки тому

    É possível criar alternância entre botões? Por exemplo uma escolha com 2 alternativas, 1 delas está com o radius button preenchido como padrão, no caso de eu selecionar a outra opção os 2 botões estarão ativos. Como faço para resolver esse problema e alternar em uma alternativa ou outra?

    • @DicasUX
      @DicasUX 2 роки тому

      Tiago é possivel sim, mas de cabeça e por texto é complicado explicar. Como faz tempo seu comentário acredito que até o próprio Figma está mais tranquilo para fazer isso!

  • @jocielidearaujodasilva3595
    @jocielidearaujodasilva3595 3 роки тому

    Gostei muito! Parabéns!!!

  • @slowpaulk
    @slowpaulk 3 роки тому

    No meu prototype, não aparece a opção "change to", o que eu faço?

    • @DicasUX
      @DicasUX 3 роки тому

      Precisa cadastrar como Beta. Tem um comentário aqui no vídeo que mostra como! Leva uns 3 dias para aprovarem e depois é só sucesso.

  • @rsvicero
    @rsvicero 3 роки тому

    Muito bom! Tem como deixar o frame com o auto layout responsivo?

    • @DicasUX
      @DicasUX 3 роки тому

      Tem um plugin que ajuda! Não lembro de cabeça o nome mas galera tava usando ele!

  • @renatasantos1079
    @renatasantos1079 3 роки тому

    me ajudou muito! obrigada pelas dicas :)

  • @emersonsuits
    @emersonsuits 3 роки тому

    Muito obrigado, Natan! Vídeo bastante útil e muito bem explicado, a sua didática é excelente! Por favor, não pare de produzir dicas, estarei por aqui acompanhando. Abraços =)

  • @Renato_bez
    @Renato_bez 3 роки тому

    Muito foda mano, parabéns!!! Mais um inscrito. Não pare, por favor :)

  • @jennifersousa9207
    @jennifersousa9207 3 роки тому

    No meu não funciona porque preciso ser beta :( mandei o pedido

    • @DicasUX
      @DicasUX 3 роки тому

      Em geral eles liberam rápido. Fica de olho que eventualmente eles te colocam como beta :)

  • @sopi1778
    @sopi1778 3 роки тому

    Me salvou muitíssimo, obrigada!!!

  • @victoreduardo1001
    @victoreduardo1001 3 роки тому

    curti muito a dica, sério mesmo obrigado

  • @icostta
    @icostta 3 роки тому

    Mais avançado do que preciso, mas já to inscrita pra voltar :D

    • @DicasUX
      @DicasUX 3 роки тому

      Valeu Iara!!! :))

  • @andrehahn3605
    @andrehahn3605 3 роки тому

    Parabéns conteúdo muito bem explicado sem enrolação ! ! !

  • @renatooliveira8989
    @renatooliveira8989 3 роки тому

    A partir do minuto 24 Dicas UX.

    • @DicasUX
      @DicasUX 3 роки тому

      Opa é o Hotjar, link pra cadastrar e ajudar a gente por lá é esse: www.hotjar.com/r/r568c7c

  • @renatooliveira8989
    @renatooliveira8989 3 роки тому

    Quais são as ferramentas que foram citadas. Poderia passar os links aqui?

    • @DicasUX
      @DicasUX 3 роки тому

      Oi Renato. Em qual minuto do vídeo exatamente? :)

  • @luhcalbuq
    @luhcalbuq 3 роки тому

    Finalmente alguém fazendo um tutorial, nada de speed XD Valew!

  • @tiagosilvafotos
    @tiagosilvafotos 3 роки тому

    Conteúdo top 👏👏👏

  • @uindercarvalho
    @uindercarvalho 3 роки тому

    Vídeo muito bem explicado. Obrigado pela ajuda!

    • @DicasUX
      @DicasUX 3 роки тому

      Eu que agradeço Uinder! Compartilha com a galera! :D

  • @sdexpressbrasil
    @sdexpressbrasil 3 роки тому

    A Paty bem eu😊 ...super pra cima, a entrevista saiu fora do controle, muito bom isso, ela deveria ter um canal🤣 o que acha amigo?

    • @DicasUX
      @DicasUX 3 роки тому

      Verdade 😅

  • @sdexpressbrasil
    @sdexpressbrasil 3 роки тому

    Parabéns

  • @sdexpressbrasil
    @sdexpressbrasil 3 роки тому

    Que legal Lenka Rejfířová , parabéns pela convidada.

  • @sdexpressbrasil
    @sdexpressbrasil 3 роки тому

    Muito obrigado pelo vídeo, ajudou bastante. Parabéns

    • @DicasUX
      @DicasUX 3 роки тому

      Que bom que ajudou! :)

  • @CristinaGuedes
    @CristinaGuedes 3 роки тому

    Muito bom ver alguém explicando variantes sem pressa, parabéns!!!

  • @137Pena
    @137Pena 3 роки тому

    Valeu pelas dicas Natan. Vou praticar!!!

    • @DicasUX
      @DicasUX 3 роки тому

      Pratica mesmo Fernando! Ferramenta é só um meio, mas a gente ficar bom nela ajuda no dia a dia. Abração! :)

  • @TiagoImme
    @TiagoImme 3 роки тому

    Natan, duas questões que surgiram aqui: 1 - fiz exatamente como você, fui seguindo os passos, mas quando tentei puxar a seta do primeiro componente pra segunda variável, ele não conectou na caixa, e sim apenas no texto - é normal? 2 - aqui pra mim não aparece a opção "Change to" na config. da prototype. Sabe o que pode estar acontecendo? obrigado!

    • @DicasUX
      @DicasUX 3 роки тому

      Fala Tiago. 1- não é normal. 2- acabei de ver aqui que a feature tá em beta ainda :) help.figma.com/hc/en-us/articles/360061175334-Create-interactive-components-with-variants abracao!

    • @TiagoImme
      @TiagoImme 3 роки тому

      @@DicasUX muito obrigado! mistério resolvido :D

    • @raphavidad
      @raphavidad 3 роки тому

      @@TiagoImme como voce resolveu isso? ta,bém queria usar a função, estou com o mesmo problema. conta pra gente aqui como fazer essa configuração pra que eu possa exeturar esaa animação de variantes também. #please!

    • @TiagoImme
      @TiagoImme 3 роки тому

      @@raphavidad Oi! Aqui na verdade não consegui resolver, apenas esclarecer pq eu não estava conseguindo :/ vimos que o que viabiliza isso é a opção "change to", no "click" (da seção 'interactions', na aba 'prototype'), mas essa opção é beta e só aparece para quem estava inscrito no programa beta do figma. Agora é esperar isso deixar de ser beta e habilitar pra todo mundo haha :D

    • @TiagoImme
      @TiagoImme 3 роки тому

      @Diego de Paula Silva fala Diego! Cara, eu tava nessa linha tbm mas pensei "vou me inscrever no beta, vai que me aceitam kkk" e aceitaram. Outra pessoa aqui do time tentou e tbm deu certo. Sugiro tentar ali pelo link da primeira resposta desse comentário. Aqui agora está funcionando e realmente é uma ótima função, está ajudando bastante nos protótipos :)

  • @raulmelo730
    @raulmelo730 3 роки тому

    Ainda quero saber porque você não acredita no pixel perfect :)

    • @DicasUX
      @DicasUX 3 роки тому

      Bom assunto para um vídeo 👀 Em resumo: 90% das vezes um protótipo é exatamente isso: *um protótipo* . Não é pra fazer margin toda cagada também, mas enxugar pixel não traz muito valor para a finalidade de prototipar e testar. Valeu pelo comentário! :)

  • @joyceromone
    @joyceromone 3 роки тому

    muito boa dica, vou testar depois

    • @DicasUX
      @DicasUX 3 роки тому

      Deu certo? :)

  • @MrGuiDamasceno
    @MrGuiDamasceno 3 роки тому

    Muito bom, estou começando e já gostei bastante do seu vídeo.

    • @DicasUX
      @DicasUX 3 роки тому

      Valeu Guilherme!! Semana que vem sobe mais uma entrevista com uma profissional da área!

  • @mamutept
    @mamutept 3 роки тому

    Cara obrigado pelo video bem facil e didatico, to migrando do Xd para o Figma e realmete videos como esse ajudam muito, ganhou um seguidor e vou la ver o resto. Abs

    • @DicasUX
      @DicasUX 3 роки тому

      Valeu meu caro! Farei mais vídeos estilo esse num futuro próximo! :)

  • @mxaraujo
    @mxaraujo 3 роки тому

    Boa classe, conteúdo organizado. Prático, rápido e interativo. Tom de voz adequado. Poderia apenas ter falado um pouco mais da ferramenta no início, ou indicar um link na descrição para um vídeo no qual faz isso. Desejo grande sucesso ao canal.

    • @DicasUX
      @DicasUX 3 роки тому

      Vou gravar um com o update que rolou :)

  • @kianemabel
    @kianemabel 4 роки тому

    quando comando shift+A no frame, as opções que aparecem no autolayout são diferente. não consigo ver essa opção "horizontal", por exemplo. =\

    • @DicasUX
      @DicasUX 4 роки тому

      O figma deu uma atualizada boa há umas semanas. Vou gravar um vídeo mostrando tudo. :)

  • @rapitee
    @rapitee 4 роки тому

    Como faço o atalho ctrl+[ para mandar objeto para o fundo nos teclados europeus?

    • @DicasUX
      @DicasUX 4 роки тому

      Ishi Rafael vou ficar te devendo essa. Aqui em casa é tudo o pt-br com cedilha, foi mal!

  • @cauesj
    @cauesj 4 роки тому

    Interessante esse área. Nunca tinha pensado naqueles "ramais" telefônicos como uma interface e também não havia vislumbrado a união da área de dados e inteligência artificial com a área de UX.

    • @DicasUX
      @DicasUX 4 роки тому

      É uma forma de interface também. Tudo impacta na UX, é formidável isso tudo!

  • @jadervieiraable
    @jadervieiraable 4 роки тому

    Muito bom Natan! Pelo que percebi aqui nos comentários, o vídeo ajudou tanto quem já é mais experiente, quanto quem está começando, como eu. Excelente didática!!

    • @DicasUX
      @DicasUX 4 роки тому

      Valeu, Jader! Ideia é fazer mais vídeos assim no futuro pra ajudar todo mundo. :)

    • @DicasUX
      @DicasUX 4 роки тому

      e não esquece de se inscrever no canal pra dar uma força pra gente! :D

  • @brunobezerranepomuceno
    @brunobezerranepomuceno 4 роки тому

    Essa dica de ocultar o ícone, salvou minha vida. Muito obrigado Natan, e continue o bom trabalho. 🖖🏽

    • @DicasUX
      @DicasUX 4 роки тому

      Valeu Bruno! Essa me salvou um tempo também!

    • @DicasUX
      @DicasUX 4 роки тому

      e não esquece de se inscrever no canal pra dar uma força pra gente! :D

  • @masclaroquetenho
    @masclaroquetenho 4 роки тому

    Muito bom, a dica de colocar os componentes dentro de frames nem imaginava que funcionava assim, parabéns!

    • @DicasUX
      @DicasUX 4 роки тому

      Há uns meses eu fazia uma bela gambiarra: colocava todos os icones em um componente, e deixava todos menos um escondidos 😁 Vi uma talk uma vez e assim como mostro no vídeo é mais eficiente. Valeu Saimon!

    • @DicasUX
      @DicasUX 4 роки тому

      e não esquece de se inscrever no canal pra dar uma força pra gente! :D

  • @kahue
    @kahue 4 роки тому

    ótimo vídeo

    • @DicasUX
      @DicasUX 4 роки тому

      Obrigado Kahuê! Próximas semanas sairá outro, ainda não fechei o tema!

    • @DicasUX
      @DicasUX 4 роки тому

      e não esquece de se inscrever no canal pra dar uma força pra gente! :D

  • @sparcosds
    @sparcosds 4 роки тому

    Aguardando mais vídeos de Figma ou um curso completo porque não 😅.

    • @DicasUX
      @DicasUX 4 роки тому

      Marcos Borges valeu Marcão! Tentar postar mais vídeos de Figma e de UX tbm.

  • @renatadutrams
    @renatadutrams 4 роки тому

    Muito bom! Continue postando vídeos assim! Gostaria de entender um pouco mais sobre componentes, frames, constrains... não sei se você irá falar sobre. Mas seria interessante!

    • @DicasUX
      @DicasUX 4 роки тому

      Farei um vídeo no futuro focado em componentes. Valeu Renata! :)

  • @felipeporto7006
    @felipeporto7006 4 роки тому

    Muito bacana, esses atalhos facilitam demais o workflow. Sua didática é excelente. Muito sucesso pro canal. Parabéns

    • @DicasUX
      @DicasUX 4 роки тому

      Brigadao Felipe!!! :)