Workshop

Design para Devs

Nível
40 aulas
3h10

Seu Instrutor

Roberto Cestari

Codante.io

Aulas

  1. Introdução
  2. 1.

    Apresentação

    01:22
  3. 2.

    Sobre o workshop

    03:48
  4. 3.

    Conteúdo do workshop

    01:39
  5. 4.

    Web Designer e Web Developer

    11:42
  6. Cores
  7. 5.

    Evolução do Design da Web

    16:13
  8. 6.

    Sistema de Cores

    09:01
  9. 7.

    Relação entre cores

    05:58
  10. 8.

    Criando Tints, Shades e Tones

    04:23
  11. 9.

    Sombras e Color Context

    03:23
  12. 10.

    Cores e CSS: 256 cores vs RGB

    05:31
  13. 11.

    Named Colors

    01:51
  14. 12.

    RGB e RGBA

    02:54
  15. 13.

    Sintaxe Hexadecimal

    03:35
  16. 14.

    HSL

    05:15
  17. 15.

    Prática - Criando um arco-íris com HSL

    12:38
  18. 16.

    Prática - Criando tonalidades com HSL

    01:46
  19. 17.

    Problema do HSL - Contraste

    05:26
  20. 18.

    LCH

    06:57
  21. 19.

    Prática - Paleta com LCH

    05:59
  22. 20.

    Outros tópicos de cores

    03:05
  23. 21.

    Criando uma paleta de cores

    02:45
  24. 22.

    Ferramentas de cores

    02:39
  25. 23.

    Cores e acessibilidade

    02:09
  26. Tipografia
  27. 24.

    Introdução à Tipografia

    02:54
  28. 25.

    Nomenclatura - Serifa e monospace

    01:49
  29. 26.

    Nomenclatura - Leading, tracking e kerning

    04:48
  30. 27.

    Escolhendo fontes

    06:59
  31. 28.

    Tipografia - Extensões Existentes

    03:10
  32. 29.

    Como identificar a fonte certa

    02:00
  33. 30.

    Fontes Variáveis

    07:11
  34. 31.

    Prática - Google Fonts com fonte não variável

    09:01
  35. 32.

    Prática - Google Fonts com fonte variável

    08:27
  36. Imagens
  37. 33.

    Imagens - Formatos existentes

    06:31
  38. 34.

    Diferentes tamanhos de imagens

    03:57
  39. 35.

    Diferentes formas de utilizar imagens no html

    01:48
  40. 36.

    Ferramentas para otimizar imagens

    01:43
  41. 37.

    Onde encontrar boas imagens

    00:58
  42. 38.

    Imagens como background

    00:59
  43. Outros Tópicos
  44. 39.

    Figma básico

    06:24
  45. 40.

    Finalização

    01:37