Design systems para sites com Figma
A course by Filip FelbarDesigner digital
A course by Filip Felbar, Designer digital
Aprenda a criar sistemas de design para sites visualmente atraentes usando Figma e maximize seu fluxo de trabalho.
Tendo trabalhado em vários campos criativos, o Designer Digital Filip Felbar sabe como a falta de estrutura pode causar problemas. Seu processo é dedicado a estruturar e tornar as coisas mais fáceis e acessíveis. É aí que entram os sistemas de design. Um sistema de design é uma biblioteca coletiva que reúne todos os elementos necessários para que uma equipe planeje, realize e desenvolva um produto de forma eficiente e alinhada com sua marca. Ele pode apresentar tudo, desde diretrizes de estilo até informações de codificação.
Neste curso online, Filip compartilha com você o que são sistemas de design e sua abordagem para desenvolvê-los e reciclá-los. Aprenda também a navegar pelas ferramentas da Figma de forma eficaz para criar sistemas de design digital para sites. Explore componentes globais e layout automático para acelerar seu processo!
O que você aprenderá neste curso online?
22 aulas & 23 downloads
Introdução aos sistemas de design
6 minutos, 58 segundos
Como os sistemas de design podem ajudá-lo a acelerar seu fluxo de trabalho
8 minutos, 0 segundos
Introdução ao projeto e abordagem
6 minutos, 36 segundos
Configurando o arquivo Figma e iniciando as primeiras explorações 1
18 minutos, 40 segundos
Configurando o arquivo Figma e iniciando as primeiras explorações 2
16 minutos, 19 segundos
Expandindo o sistema de explorações e design 1
19 minutos, 36 segundos
O que está incluído neste curso?
Comece conhecendo seu professor, Filip Felbar. Ele compartilha sua jornada no design digital e suas inspirações.
Em seguida, conheça os sistemas de design com os quais você trabalhará e os benefícios que eles oferecem. Filip apresenta alguns exemplos rápidos de como componentes e estilos globais podem ser atualizados com eficiência antes de examinar o projeto que você abordará neste curso.
Em seguida, comece a preparar seu conteúdo com o Figma. Faça uma lista de verificação de itens a serem incluídos e configure os elementos iniciais e globais. Explore as direções de design e mergulhe no Auto Layout, atualizando componentes e estilos à medida que avança.
Depois, refine seu sistema com uma página montada, crie uma nova com a versão completa e escreva as diretrizes para usá-la.
Como bônus, Filip compartilha seu processo de criação de elementos de marca adicionais para mídias sociais.
Ao final do curso, você será capaz de pensar de forma estruturada que ajudará a dar vida a seus projetos criativos e a acelerar seu fluxo de trabalho.
Recommended software & tools for this course
What is this course's project?
Aprenda a criar um design de site visualmente atraente e um sistema de design organizado com a documentação apropriada.
Projetos de alunos do curso
Who is this online course for?
Qualquer pessoa que queira aprender mais sobre sistemas de design e web design.
Requirements and materials
Figma ou uma ferramenta semelhante.
A experiência anterior com a Figma beneficiará os alunos.
Avaliações
- há 29 dias
Es un curso apto para principiantes, ayuda a potenciar tus conocimientos en figma
- há 1 mês
Muy buen curso, bien explicado paso a paso, vale la pena!
- framantebPLUShá 4 meses
muy malo realmente
- há 4 meses
Comenzó bien, muy inspirador. Pero finalmente resulta tedioso... una gran parte es acompañar al tutor en su propio proceso y resulta un poco narcotizante. Y de lo que me gustaría haber escuchado, como la organización de variables, foundations o variantes mobile, no hay contenido.
- há 6 meses
Me falto más información pero si lo básico te lo da, si vas empezando está muy bien
Conteúdo
- U1
Introdução
- Apresentação
- Influências
- U2
Sistemas de projeto
- Introdução aos sistemas de design
- Como os sistemas de design podem ajudá-lo a acelerar seu fluxo de trabalho
- Introdução ao projeto e abordagem
- U3
O processo de design da web e do sistema
- Configurando o arquivo Figma e iniciando as primeiras explorações 1
- Configurando o arquivo Figma e iniciando as primeiras explorações 2
- Expandindo o sistema de explorações e design 1
- Expandindo o sistema de explorações e design 2
- Organizando as páginas do design system 1
- Organizando as páginas do design system 2
- Explorando variantes ao criar componentes
- U4
Refinando o site e o sistema de design
- Refinando o sistema de design com uma página montada 1
- Refinando o sistema de design com uma página montada 2
- Refinando o sistema de design com uma página montada 3
- Configurando novas páginas com o sistema de design completo 1
- Configurando novas páginas com o sistema de design completo 2
- Configurando novas páginas com o sistema de design completo 3
- Como abordar a criação de documentação para o design system
- U5
Fechando e indo além da web
- Limpando e usando um layout automático
- Utilizando o design em outros elementos da marca
- Pensamentos finais
- PF
Projeto final
- Design systems para sites com Figma
O que esperar de um curso da Domestika
Aprenda no seu ritmo
Aproveite para aprender desde casa, sem um horário fixo e no seu ritmo. É você quem define sua disponibilidade.
Aprenda com os melhores profissionais
Aprenda métodos e técnicas fundamentais com os melhores profissionais do setor criativo.
Conheça os maiores especialistas
Cada professor compartilha seus conhecimentos com entusiasmo e explicações claras, oferecendo uma perspectiva profissional em cada aula.
Certificates
PLUSIf you're a Plus member, get a certificado personalizado signed by your teacher for every course. Share it on your portfolio, social media, or wherever you like.
Sente-se na primeira fila
Com vídeos da melhor qualidade, você não perderá nenhum detalhe! Graças ao acesso ilimitado, você pode assistir às aulas todas as vezes que precisar para aperfeiçoar sua técnica.
Compartilhe conhecimentos e ideias
Pergunte, peça opiniões e ofereça soluções. Compartilhe sua experiência de aprendizagem com outros alunos da comunidade tão criativos como você.
Conecte-se a uma comunidade criativa global
Esta comunidade acolhe milhões de pessoas do mundo todo, curiosas e apaixonadas por descobrir e expressar sua criatividade.
Assista a cursos produzidos de maneira profissional
A Domestika seleciona cuidadosamente seus professores e produz cada curso internamente para garantir uma experiência de aprendizagem online excelente.
Perguntas frequentes
Um sistema de design é um conjunto de componentes reutilizáveis, diretrizes e padrões que facilitam o web design, garantem a consistência da marca e tornam a colaboração mais simples. Usar um sistema de design economiza tempo, evita tarefas repetitivas e melhora a escalabilidade dos projetos digitais.
Este curso é voltado para designers de nível intermediário que já entendem os princípios básicos do web design e ferramentas como o Figma. Não é necessário ter experiência avançada, mas conhecer conceitos de design digital ou front-end ajuda bastante.
Você precisará ter acesso ao Figma, pois o curso mostra como criar sistemas de design e organizar o fluxo de trabalho nessa plataforma. Ter familiaridade com o Notion para organização de projetos é recomendado, mas não é preciso saber programar nem usar softwares avançados.
Você vai aprender estratégias para estruturar projetos de design, criar checklists de conteúdo, gerenciar ativos e usar ferramentas colaborativas para manter o fluxo de trabalho eficiente e organizado em projetos web escaláveis.
O curso ensina a criar, nomear e gerenciar componentes reutilizáveis, aplicar estilos globais e documentar processos no Figma para garantir consistência e eficiência em todos os projetos.
Sim, o curso aborda técnicas de documentação, processos padronizados e fluxos de trabalho baseados em componentes que facilitam a colaboração e ajudam as equipes a manter a qualidade e a consistência do design.
Você vai adquirir habilidades práticas para organizar e aplicar tipografia, configurar grades de layout e estabelecer hierarquias tipográficas para criar interfaces web visualmente estruturadas e acessíveis.