Nessa aula, apresentei o projeto que vamos desenvolver juntos ao longo do curso. O foco é construir um sistema de design no Figma, mostrando cada etapa, desde a montagem dos componentes até a estruturação completa do projeto. O projeto em questão é um produto de inteligência artificial, como um chatbot, algo muito presente e que estará ainda mais em voga no ano de 2025. Pontos importantes que destaquei para vocês: - Organização no Figma:Mostrei como organizar os componentes e telas no Figma, utilizando as funcionalidades mais recentes . - Template do Design System:Vou fornecer um template para que possamos estruturar os componentes e a documentação de forma correta. - Componentes Slot:Expliquei o conceito de slot component, que permite substituir componentes em uma biblioteca de forma eficiente. - Tomadas de Decisão:Enfatizei a importância de compartilhar as tomadas de decisão durante as nossas aulas, agregando valor ao seu aprendizado. - Responsividade e Escalabilidade:Discuti a importância de criar um design system responsivo e escalável, pensando em diferentes dispositivos e tamanhos de tela. - Variáveis e Modo:Apresentei como vamos trabalhar com as variáveis no Figma, incluindo a escala e os modos claro e escuro. - Componentes Otimizados:Ressaltei que não precisamos de dezenas de componentes com o mesmo propósito, mas sim de componentes reutilizáveis e enxutos. - Prototipagem:Mostrei como os componentes podem ser interativos no protótipo, facilitando a visualização do comportamento do design. - Ícones e Ilustrações:Comentei sobre a biblioteca de ícones Streamline, que será utilizada no curso, e como vamos organizar ícones e ilustrações. - Componentes Fundamentais:Por fim, dei uma visão geral dos componentes fundamentais que compõem o design system, como botões, avatares, inputs e outros. Nas próximas aulas, vamos aprofundar em cada um desses tópicos, construindo passo a passo o nosso Design System e aplicando as melhores práticas do mercado.
Data de lançamento
20/04/2025
Duração
Legendas
Português [PT-BR]
Tags
design, Figma, chatbot, responsividade, prototipagem
Title Example
Message Example