Atualização Techguide: Inserção estrutura TechGuide UI design / atual… (

#265)

Co-authored-by: Fabrício Carraro <fabriciocarraro@gmail.com>

_data/cards/pt_BR/UI-fundamentals.yaml

@@ -0,0 +1,22 @@
+name: Fundamentos de UI
+logo:
+short-description:
+key-objectives:
+ - O ponto de partida ideal para começarmos a desbravar a área de User Interface Design é entendendo perfeitamente o que ela é, como é representada, como outros profissionais a enxergam, e claro, sua relevância para a construção de um produto. 
+contents:
+ - type: ARTICLE
+ title: "Desenhando Experiências Inesquecíveis: 10 Princípios de UI Design"
+ link: https://medium.com/@rafavulcano/desenhando-experi%C3%AAncias-inesquec%C3%ADveis-10-princ%C3%ADpios-de-ui-design-de9dc1f1cc18
+ - type: SITE
+ title: "Colour Contrast Checker"
+ link: https://colourcontrast.cc/
+ - type: SITE
+ title: "Modular Scale"
+ link: https://www.modularscale.com/
+alura-contents:
+ - type: ARTICLE
+ title: "UI Design: o que é, UX vs UI e um Guia da profissão de UI Designer"
+ link: https://www.alura.com.br/artigos/ui-design
+ - type: COURSE
+ title: "UI Design: mergulhando nas interfaces digitais"
+ link: https://www.alura.com.br/curso-online-ui-design-mergulhando-interfaces-digitais

_data/cards/pt_BR/advancing-the-UI.yaml

@@ -0,0 +1,25 @@
+name: Avançando na UI
+logo:
+short-description:
+key-objectives:
+ - Dê início em processos de UI, idealizando a construção de um produto, entendendo os fundamentos e estruturas. 
+contents:
+ - type: SITE
+ title: "Material Design"
+ link: https://m2.material.io/
+ - type: SITE
+ title: "Dribbble"
+ link: https://dribbble.com/
+ - type: ARTICLE
+ title: "Os diferentes tipos e funções dos Protótipos"
+ link: https://brasil.uxdesign.cc/os-diferentes-tipos-e-fun%C3%A7%C3%B5es-dos-prot%C3%B3tipos-54981e35b5a4
+alura-contents:
+ - type: ARTICLE
+ title: "Regra 60-30-10 em UI Design"
+ link: https://www.alura.com.br/artigos/regra-60-30-10-ui-design
+ - type: PODCAST
+ title: "Prototipação"
+ link: https://www.layerspontotech.com.br/2022/05/23/prototipacao-layers-ponto-tech-81/
+ - type: PODCAST
+ title: "UI Design: criando o design de um protótipo"
+ link: https://cursos.alura.com.br/course/ui-design-criando-design-prototipo

_data/cards/pt_BR/artificial-intelligence.yaml

@@ -0,0 +1,35 @@
+name: Inteligência artificial
+logo:
+short-description:
+key-objectives:
+ - Uma interface é como o corpo humano: por fora, temos o visual, mas por dentro, temos diversos organismos que executam funções diferentes, mas que unidos, compoem a estrutura dos nossos corpos. Assim, com a nossa estrutura do produto construída, diversos insights já levantados, e muitos processos executados, podemos começar a construção do que chamamos de "protótipo em alta fidelidade", que se trata do produto final com o qual seu cliente e as pessoas usuárias irão interagir.
+ - Conheça os UI Patterns, que se tratam de comportamentos ideais para todo tipo de cenário, um conteúdo extremamente importante para qualquer um que queira criar produtos digitais. 
+contents:
+ - type: ARTICLE
+ title: "Design Handoff: como construir a comunicação entre designer e desenvolvedor?"
+ link: https://medium.com/sidi-design/design-handoff-como-construir-a-comunica%C3%A7%C3%A3o-entre-designer-e-desenvolvedor-a523bdd3b7bb
+ - type: ARTICLE
+ title: "Testando a Usabilidade de Novos Componentes de um Design System"
+ link: https://medium.com/@alexcerqueirabr/testando-a-usabilidade-de-novos-componentes-de-um-design-system-94611cbfc108
+ - type: YOUTUBE
+ title: "Plugin do Figma para Hand-off: Redlines | Dicas de Figma"
+ link: https://www.youtube.com/watch?v=GDC0l-f1OaY&ab_channel=ChiefofDesign
+alura-contents:
+ - type: ARTICLE
+ title: "Como testar a sua interface digital"
+ link: https://www.alura.com.br/artigos/como-testar-sua-interface-digital
+ - type: PODCAST
+ title: "O teste de usabilidade"
+ link: https://www.layerspontotech.com.br/2022/11/07/o-teste-de-usabilidade-layers-ponto-tech-105/
+ - type: SITE
+ title: "APÊNDICE - TESTES DE USABILIDADE"
+ link: https://www.alura.com.br/apostila-ux-usabilidade-mobile-web/usabilidade
+ - type: COURSE
+ title: "UI Design: construindo o produto final"
+ link: https://cursos.alura.com.br/course/ui-design-construindo-produto-final
+ - type: COURSE
+ title: "UI Design: melhorando a experiência de um app com UI Patterns"
+ link: https://cursos.alura.com.br/course/ui-design-experiencia-app-ui-patterns
+ - type: COURSE
+ title: "UI Design: teste de usabilidade"
+ link: https://cursos.alura.com.br/course/ui-design-teste-usabilidade

_data/cards/pt_BR/design-strategy-and-UX.yaml

@@ -0,0 +1,25 @@
+name: Design, estratégia e UX
+logo:
+short-description:
+key-objectives:
+ - A pessoa usuária é muito importante para a UX, porém existe um outro ponto que também tem grande peso: o negócio, pois um produto precisa ser bom e financeiramente agradável para todos os lados. A UX possui processos e ferramentas com focos em unir os interesses das empresas, as dores e necessidades das pessoas usuárias, e considera a capacidade da equipe de desenvolvimento sem gerar esgotamento. 
+contents:
+ - type: ARTICLE
+ title: "Design Estratégico: Como ele pode alavancar resultados do seu negócio"
+ link: https://brasil.uxdesign.cc/design-estrat%C3%A9gico-o-que-%C3%A9-e-como-ele-pode-alavancar-os-resultados-do-seu-neg%C3%B3cio-27c198dcf26b
+ - type: ARTICLE
+ title: "UX Strategy, o design estratégico que seu produto precisa"
+ link: https://medium.com/obj-experience-chapter/ux-strategy-5b2caf9b9d13
+ - type: ARTICLE
+ title: "O poder do Design no planejamento estratégico de produto"
+ link: https://brasil.uxdesign.cc/o-poder-do-design-no-planejamento-estrategico-de-produto-96470f21ea6d
+alura-contents:
+ - type: ARTICLE
+ title: "UX Design e sua relação com a área de negócios"
+ link: https://www.alura.com.br/artigos/ux-design-relacao-area-de-negocios
+ - type: COURSE
+ title: "UX Design: concepção do produto pós-pesquisa"
+ link: https://cursos.alura.com.br/course/ux-design-concepcao-produto-pos-pesquisa
+ - type: COURSE
+ title: "UX Design: elaborando projetos estratégicos"
+ link: https://cursos.alura.com.br/course/ux-design-elaborando-projetos-estrategicos

_data/cards/pt_BR/design-systems.yaml

@@ -4,6 +4,11 @@ short-description:
 key-objectives:
  - Um Design Systems (sistema de design) é uma coleção de componentes reutilizáveis, guiados por padrões claros, que podem ser colocados juntos para construir aplicações.
  - Criar e manter bibliotecas que serão consumidas e usadas como padrão para a construção de um projeto
+ - Design tokens 
+ - Estilos fundamentais 
+ - Construção de componentes 
+ - Microinterações 
+ - Documentação 
 aditional-objectives:
 contents:
  - type: ARTICLE
@@ -43,3 +48,6 @@ alura-contents:
  - type: COURSE
  title: "Formação Design System"
  link: https://www.alura.com.br/formacao-design-system
+ - type: CHALLENGE
+ title: "Experimente o que é ser um(a) profissional de Ux"
+ link: https://www.alura.com.br/challenges/ux-4

_data/cards/pt_BR/design-tools-part-ii.yaml

@@ -0,0 +1,32 @@
+name: Ferramentas de design (Figma e Sketch) parte II
+logo:
+short-description:
+key-objectives:
+ - Apesar de as ferramentas fundamentais serem praticamente autosuficientes para criar produtos digitais completos, o Figma possui recursos que permitem melhorar nossas interfaces, e até mesmo automatizar diversos processos para construir produtos em diversos dispositivos diferentes.
+ - Estando em sintonia com o Sketch, entendendo suas funções básicas e comportamentos, é hora de evoluir na construção do design de interface, embarcando cada vez mais em metodologias, técnicas e padrões de construção, que tornam melhor a usabilidade do produto, convertendo em experiências positivas. 
+contents:
+ - type: ARTICLE
+ title: "Using auto layout"
+ link: https://help.figma.com/hc/en-us/articles/5731482952599-Using-auto-layout
+ - type: ARTICLE
+ title: "Masks"
+ link: https://help.figma.com/hc/en-us/articles/360040450253-Masks
+ - type: ARTICLE
+ title: "Potencialize seus Projetos no Figma: Conheça os 10 plugins que transformam o fluxo de trabalho!"
+ link: https://medium.com/@rafavulcano/potencialize-seus-projetos-no-figma-conhe%C3%A7a-os-10-plugins-que-transformam-o-fluxo-de-trabalho-ba3eb2548587
+alura-contents:
+ - type: ARTICLE
+ title: "Componentes no Figma"
+ link: https://www.alura.com.br/artigos/componentes-figma
+ - type: ARTICLE
+ title: "Auto layout no Figma"
+ link: https://www.alura.com.br/artigos/auto-layout-figma
+ - type: COURSE
+ title: "Figma: componentes, auto layout e máscaras"
+ link: https://cursos.alura.com.br/course/figma-componentes-auto-layout-mascaras
+ - type: COURSE
+ title: "Sketch: incrementando e melhorando a UI"
+ link: https://cursos.alura.com.br/course/sketch-incrementando-melhorando-ui
+ - type: COURSE
+ title: "UI Design: melhorando a experiência de um app com UI Patterns"
+ link: https://cursos.alura.com.br/course/ui-design-experiencia-app-ui-patterns

_data/cards/pt_BR/design-tools-part-iii.yaml

@@ -0,0 +1,31 @@
+name: Ferramentas de design (Figma e Sketch) parte III
+logo:
+short-description:
+key-objectives:
+ - Sabemos que a interface que criamos no Figma não é o produto verdadeiro, já que se trata apenas de um protótipo que projetamos, e que mais para frente virá a se tornar desenvolvido, mas até lá, é precisamos criar uma forma de apresentar o produto para os clientes e usuários, com finalidade de validar tudo o que fizemos até então.
+ - Entenda o que é o Dark Mode
+ - Aprenda a construir interfaces em Dark Mode
+ - Aprenda a criar uma biblioteca no Sketch
+ - Saiba utilizar ferramentas específicas do Sketch
+ - Realize a construção de gráficos para dashboards
+ - Entenda o que são interfaces flutuantes 
+contents:
+ - type: ARTICLE
+ title: "Campos digitáveis no figma: protótipo interativo em alta fidelidade"
+ link: https://medium.com/@mariaelizabeth.melo/campos-digit%C3%A1veis-no-figma-prot%C3%B3tipo-interativo-em-alta-fidelidade-0891769726fb
+ - type: ARTICLE
+ title: "Dicas para fazer animações usando Smart Animate do Figma"
+ link: https://brasil.uxdesign.cc/dicas-para-fazer-anima%C3%A7%C3%B5es-usando-smart-animate-do-figma-5e92963aff2f
+ - type: ARTICLE
+ title: "Os 7 princípios do design e como aplicá-los ao criar o seu site"
+ link: https://pt.wix.com/blog/2018/08/7-principios-design-sites/
+alura-contents:
+ - type: ARTICLE
+ title: "Prototipagem com condicionais no Figma"
+ link: https://www.alura.com.br/artigos/prototipagem-condicionais-figma
+ - type: COURSE
+ title: "Figma: prototipagem interativa e animações"
+ link: https://cursos.alura.com.br/course/figma-prototipagem-interativa-animacoes
+ - type: COURSE
+ title: "Sketch: aprimore sua interface com dark mode"
+ link: https://cursos.alura.com.br/course/sketch-aprimore-interface-dark-mode

_data/cards/pt_BR/design-tools.yaml

@@ -0,0 +1,31 @@
+name: Ferramentas de design (Figma e Sketch)
+logo:
+short-description:
+key-objectives:
+ - O Figma é uma das ferramentas de design mais inovadoras e colaborativas disponíveis. Essa plataforma é a mais utilizada no mundo, por empresas, designers e desenvolvedores, e que vem revolucionando a forma como times de produtos trabalham juntos. O Sketch é um app similar ao Figma, que roda tanto na web quando no iOS. 
+contents:
+ - type: ARTICLE
+ title: "Quem pode utilizar o Figma"
+ link: https://mppagano.medium.com/quem-pode-utilizar-o-figma-e8525b84c1ad
+ - type: ARTICLE
+ title: "O Figma e a próxima geração de ferramentas de Design"
+ link: https://brasil.uxdesign.cc/o-figma-e-a-pr%C3%B3xima-gera%C3%A7%C3%A3o-de-ferramentas-de-design-ab1682d2a2dd
+ - type: ARTICLE
+ title: "Como A Comunidade Figma Está Transformando O Cenário De Design No Brasil"
+ link: https://awari.com.br/como-a-comunidade-figma-esta-transformando-o-cenario-de-design-no-brasil/?utm_source=blog&utm_campaign=projeto+blog&utm_medium=Como%20A%20Comunidade%20Figma%20Est%C3%A1%20Transformando%20O%20Cen%C3%A1rio%20De%20Design%20No%20Brasil
+alura-contents:
+ - type: ARTICLE
+ title: "Figma: o que é a ferramenta, Design e uso"
+ link: https://www.alura.com.br/artigos/figma
+ - type: PODCAST
+ title: "O Figma"
+ link: https://www.layerspontotech.com.br/2023/03/13/edicao-de-trailers-layers-ponto-tech-122/
+ - type: COURSE
+ title: "Figma: conhecendo a ferramenta"
+ link: https://www.alura.com.br/curso-online-figma-conhecendo-ferramenta
+ - type: ARTICLE
+ title: "Variáveis no Figma"
+ link: https://www.alura.com.br/artigos/variaveis-figma
+ - type: COURSE
+ title: "Sketch: design visual de um website"
+ link: https://www.alura.com.br/curso-online-sketch-design-visual-website

_data/cards/pt_BR/first-contact-with-UX.yaml

@@ -0,0 +1,31 @@
+name: Princípios do design visual
+logo:
+short-description:
+key-objectives:
+ - Vamos mergulhar em dois conhecimentos essenciais para qualquer designer visual: cores e tipografias. Conheça as propriedades fundamentais destes elementos quanto aprender como manipulá-las em seus projetos. 
+contents:
+ - type: ARTICLE
+ title: "A Arte do Design Visual: Transformando Conceitos em Experiência Visual"
+ link: https://medium.com/@munichkelly/a-arte-do-design-visual-transformando-conceitos-em-experi%C3%AAncia-visual-517f7f8ce204
+ - type: ARTICLE
+ title: "Tipografia: Guia Sobre Tipos – Escolhendo a fonte certa [parte 01]"
+ link: https://chiefofdesign.com.br/tipografia/
+ - type: ARTICLE
+ title: "Teoria das Cores – Guia sobre teoria e harmonia das cores no Design"
+ link: https://chiefofdesign.com.br/teoria-das-cores/
+ - type: YOUTUBE
+ title: "Design Digital ou Design Gráfico: entenda a Real diferença na prática"
+ link: https://www.youtube.com/watch?v=gIZoayWp6i8&ab_channel=ChiefofDesign
+alura-contents:
+ - type: ARTICLE
+ title: "20 dicas de design visual para iniciantes"
+ link: https://www.alura.com.br/artigos/design-visual-para-iniciantes
+ - type: COURSE
+ title: "Cores no design: teoria e prática"
+ link: https://cursos.alura.com.br/course/cores-design-teoria-pratica
+ - type: COURSE
+ title: "Tipografia: conceitos e prática"
+ link: https://cursos.alura.com.br/course/tipografia-conceitos-pratica
+ - type: COURSE
+ title: "Grids: como organizar o conteúdo visual"
+ link: https://cursos.alura.com.br/course/grids-organizar-conteudo-visual

_data/cards/pt_BR/in-depth-UI.yaml

@@ -0,0 +1,35 @@
+name: UI em profundidade
+logo:
+short-description:
+key-objectives:
+ - Uma interface é como o corpo humano: por fora, temos o visual, mas por dentro, temos diversos organismos que executam funções diferentes, mas que unidos, compoem a estrutura dos nossos corpos. Assim, com a nossa estrutura do produto construída, diversos insights já levantados, e muitos processos executados, podemos começar a construção do que chamamos de "protótipo em alta fidelidade", que se trata do produto final com o qual seu cliente e as pessoas usuárias irão interagir.
+ - Conheça os UI Patterns, que se tratam de comportamentos ideais para todo tipo de cenário, um conteúdo extremamente importante para qualquer um que queira criar produtos digitais. 
+contents:
+ - type: ARTICLE
+ title: "Design Handoff: como construir a comunicação entre designer e desenvolvedor?"
+ link: https://medium.com/sidi-design/design-handoff-como-construir-a-comunica%C3%A7%C3%A3o-entre-designer-e-desenvolvedor-a523bdd3b7bb
+ - type: ARTICLE
+ title: "Testando a Usabilidade de Novos Componentes de um Design System"
+ link: https://medium.com/@alexcerqueirabr/testando-a-usabilidade-de-novos-componentes-de-um-design-system-94611cbfc108
+ - type: YOUTUBE
+ title: "Plugin do Figma para Hand-off: Redlines | Dicas de Figma"
+ link: https://www.youtube.com/watch?v=GDC0l-f1OaY&ab_channel=ChiefofDesign
+alura-contents:
+ - type: ARTICLE
+ title: "Como testar a sua interface digital"
+ link: https://www.alura.com.br/artigos/como-testar-sua-interface-digital
+ - type: PODCAST
+ title: "O teste de usabilidade"
+ link: https://www.layerspontotech.com.br/2022/11/07/o-teste-de-usabilidade-layers-ponto-tech-105/
+ - type: SITE
+ title: "APÊNDICE - TESTES DE USABILIDADE"
+ link: https://www.alura.com.br/apostila-ux-usabilidade-mobile-web/usabilidade
+ - type: COURSE
+ title: "UI Design: construindo o produto final"
+ link: https://cursos.alura.com.br/course/ui-design-construindo-produto-final
+ - type: COURSE
+ title: "UI Design: melhorando a experiência de um app com UI Patterns"
+ link: https://cursos.alura.com.br/course/ui-design-experiencia-app-ui-patterns
+ - type: COURSE
+ title: "UI Design: teste de usabilidade"
+ link: https://cursos.alura.com.br/course/ui-design-teste-usabilidade

_data/cards/pt_BR/ux-research.yaml

@@ -0,0 +1,34 @@
+name: UX Research
+logo:
+short-description:
+key-objectives:
+ - Para criar produtos e serviços que sejam úteis e tragam uma boa experiência para as pessoas usuárias, precisamos entender as suas dores e necessidades. Para realizar esse trabalho temos diversas técnicas de pesquisa que vão desde ouvir o que o usuário pensa sobre, até entender o comportamento que ele tem usando um produto digital ou serviço. Chamamos essa vertente de UX Research, que fica dentro do guarda chuva de disciplinas de UX Design.
+ - Aprender as metodologias de pesquisa mais utilizadas na rotina de quem trabalha como UX Researcher. 
+ - Conhecer técnicas qualitativas como a entrevista com usuários, pesquisa etnográfica e testes de usabilidade. 
+ - Avaliar comportamento e interações mapeando jornadas e documentar estratégias conhecendo o mercado e seus concorrentes com a pesquisa. 
+contents:
+ - type: ARTICLE
+ title: "A importância das pesquisas na rotina do UX Designer"
+ link: https://medium.com/orangejuicefc/a-import%C3%A2ncia-das-pesquisas-na-rotina-do-ux-designer-22427a292001
+ - type: ARTICLE
+ title: "UX Baseado em Fatos: Pesquisa Qualitativa, Quantitativa ou Quali-Quanti?"
+ link: https://brasil.uxdesign.cc/ux-baseado-em-fatos-pesquisa-qualitativa-quantitativa-ou-quali-quanti-a4efe8eb0074
+ - type: ARTICLE
+ title: "UX Research: por onde começar uma pesquisa?"
+ link: https://brasil.uxdesign.cc/ux-research-por-onde-come%C3%A7ar-uma-pesquisa-edace3ce44b9
+alura-contents:
+ - type: ARTICLE
+ title: "UX Research: o que é, o que faz e um Guia para iniciar nessa carreira"
+ link: https://www.alura.com.br/artigos/ux-research
+ - type: COURSE
+ title: "UX Research: metodologias e imersão em pesquisa"
+ link: https://cursos.alura.com.br/course/ux-research-metodologias-imersao-pesquisa
+ - type: COURSE
+ title: "UX Research: entrevistando pessoas usuárias"
+ link: https://cursos.alura.com.br/course/ux-research-entrevistando-usuarias
+ - type: COURSE
+ title: "UX Research: mapeando a experiência da pessoa usuária"
+ link: https://cursos.alura.com.br/course/ux-research-mapeando-experiencia-usuaria
+ - type: COURSE
+ title: "UX Research: construindo o Benchmarking estratégico"
+ link: https://cursos.alura.com.br/course/ux-research-benchmarking-estrategico