Front-end Básico

Edgard Kozlowski
& Tainá Simões

Próxima turma

25 Mai – 17 Jun

Remoto e ao-vivo

8 aulas, 20h

Front-end Básico

Edgard Kozlowski
& Tainá Simões

Como responsáveis pelas interfaces, designers devem zelar pela experiência do começo ao fim. Projetar interfaces tendo noção de programação, e por isso, de como os elementos se comportam em diversos cenários é essencial.

Código é a matéria prima de quem trabalha com design digital. Conhecer a matéria prima permite que você seja capaz de projetar uma interface sabendo suas reais limitações técnicas na hora de produção, tendo controle sobre interações e podendo compreender melhor as nuances do comportamento do design na tela. Projetar interfaces tendo a noção de como os elementos se comportam em diversos cenários te permite antecipar decisões estratégicas e técnicas.

Esse conhecimento te permite antecipar decisões e faz com que você e seu time de desenvolvimento falem a mesma língua. Usar as linguagens HTML, CSS e JS como ferramentas é um passo importante para a evolução de designers de interface. A ideia é ensinar o básico de HTML e CSS através de exemplos práticos em todas as aulas, para fazer com que os alunos sejam livres para programarem projetos pessoais, criarem protótipos funcionais e serem os melhores parceiro dos desenvolvedores no dia a dia.

Com a ideia de ser um curso de programação para designers, os alunos aprenderão programação front-end no nível básico de uma maneira descomplicada, orientado a design e interações.

Imagem com fotografia de Edgard.

Edgard Kozlowski é Senior
Designer na Work & Co.

“A primeira vez que tive contato com código, foi quando decidi criar um site no Blogspot para a agência que fazia estágio em Volta Redonda, minha cidade natal. Meu interesse no assunto passou a crescer gradativamente desde então: comecei a ler os livros do Maujor e a criar projetos pessoais que foram super importantes para o desenvolvimento da minha carreira, pois através deles consegui por em prática todo o meu aprendizado.

Em 2015 me mudei para o Rio de Janeiro, cidade onde tive a oportunidade de trabalhar em startups e estúdios design, atuando como designer e desenvolvedor front-end. Atualmente sou Designer na Work & Co, e por ter conhecimento de código, tive a oportunidade de desenvolver protótipos de alta fidelidade para validação de ideias e testes de usabilidade para empresas como Mailchimp, T-Mobile, Vistaprint, Descomplica e Itaú.”

Imagem com fotografia de Tainá.

Tainá Simões é designer, dev e sócia do estúdio Grama.

Sócia da Grama, estúdio focado em desenvolvimento criativo. Designer pela Escola de Belas Artes da UFRJ, trabalha com mídias digitais desde 2012. Foi professora no projeto Escola HTML na Mineira, Rio de Janeiro, onde aprendeu e ensinou sobre programação, arte e a cultura da gambiarra. Tem um interesse no uso de novas mídias e tecnologias para o desenvolvimento urbano e comunitário.

Próxima turma

25 Mai – 17 Jun

Remoto e ao-vivo

8 aulas, 20h

Estrutura do curso

HTML, a camada da informação.

Vamos começar falando sobre HTML, sua estrutura, semântica, organização e sintaxe. Você vai saber por que escrever HTML semântico é importante e como escrever HTML rápido, legível e com pouco código.

CSS, a camada de formatação.

Depois do HTML, chegou a hora de aprender sobre essa ferramenta que poucos designers conhecem. Aqui você vai conhecer como usar CSS como os melhores front-ends usam. Vai entender como sua sintaxe funciona, além de aprender as propriedades que são usadas em 80% do tempo pelos front-ends para construir layouts.

CSS: Propriedades de Estrutura.

É aqui que a coisa começa a ficar legal. Você vai aprender como estruturar da maneira correta qualquer websites. Vai aprender propriedades de posicionamento e estrutura e principalmente como utilizá-las de forma que seu código não tenha que ser reescrito várias vezes e já contemplando problemas de compatibilidade entre browsers.

Propriedades de animação e apoio.

Vamos aprender algumas propriedades que darão todo o charme nos seus projetos, usando transições e manipulação de elementos.

Responsive.

Nesse ponto vamos aprender quais os segredos de se fazer sites responsivos sem ter muito trabalho. Quais as propriedades e quais as melhores boas práticas para fazer sites mobile first, sem ter que fazer um monte de código extra.

Detalhes

Programação

Turma Edgard: Segundas e Quartas / Turma Tainá: Terças e Quintas

19h30 às 22h

Investimento

Até 6x de ou
à vista no cartão e transferência.

Turmas

25 Mai – 17 Jun

Tainá Simões

Perguntas frequentes

Preciso ter conhecimento de código para fazer o curso?

Não. A ideia é ensinar para designers que não sabem nada (ou muito pouco) sobre HTML, CSS ou JavaScript.

Qual a diferença desse curso para os que já existem?

Esse não é um curso de programação para quem quer se tornar programador em tempo integral. Os cursos existentes no mercado focam nessa premissa e por isso usam abordagens mais completas e aprofundadas. A ideia do curso de front-end do Código & Design é oferecer um conhecimento básico para designers, utilizando uma linguagem menos técnica e não procurando se aprofundar 100% nos "porquês" da programação, tendo como um dos focos a produção de código front-end que seja voltada para maximizar a qualidade visual e da entrega final.

O que é o suficiente de HTML e CSS?

O suficiente, nos critérios do curso, é aquilo que possibilita o designer a programar qualquer página e componentes visuais usando marcação de HTML e atributos de CSS que todo mundo usa o tempo inteiro, e um pouco de lógica de programação pra fazer interação com JavaScript, não sendo necessário fazer aprofundamentos extensos sobre a programação.

Já sei alguma coisa mas nunca pratiquei. O curso é pra mim?

O curso pode ser uma boa para voltar a praticar de forma intensiva. No entanto, é bom entender que estarão presentes na turma pessoas que nunca tiveram contato com desenvolvimento. O conhecimento será passado do zero até que todos estejam na mesma página.

Estou migrando de outras áreas para Design Digital. Esse curso é pra mim?

Sim. Para quem migra para Design Digital, é importante entender como produtos digitais são feitos: seja um site ou um app. Já que no final das contas seu design funcionará através de códigos, é interessante você aprender como são feitos os estilos, interações básicas, assim como requisições e tratamento de erros, para citar exemplos.

Não tenho conhecimentos em design. Esse curso é pra mim?

Depende. Se você é alguém que procura estar inserido profissionalmente na área de Design Digital nos próximos meses, pode ser uma boa, mas ainda é "arriscado". A didática é voltada para designers, e por isso eventualmente serão utilizados termos e referência à técnicas de design, assim como uso de softwares específicos que só quem está na área a pelo menos 1 ano já consegue entender e saber lidar.