FrontPUSH 3.0
O FrontPUSH é um curso online, ainda em produção, com o foco em front-end. Não é um curso apenas de codificação, conta com 3 minicursos: UI Design, codificação Front-End e Motion Design. O FrontPUSH é um curso online para desenvolver habilidades para projetar interfaces web, enquanto equilibra design, funcionalidade, acessibilidade e motion.
O UI Design é a arte de organizar informações (elementos visuais) de forma simples, intuitiva e agradável, antecipando as necessidades do usuário. No curso FrontPUSH será explorada a ferramenta de prototipagem Figma. Front-End, a deduzir pelo nome, "front" vem que parte frontal, aquela que tem contato direto com o usuário. É o estudo e desenvolvimento da estrutura visual das interfaces web. É a arte de dar vida e funcionalidade ao UI design projetado. Motion Design consiste em dar movimento aos elementos criados de forma inteligente. Adicionar microinteratividade e respostas visuais, estimula e melhora a experiência do usuário.
Conteúdo Vantagens Detalhes
- 01 - O que é UX/UI Design?
- 02 - Como aprender UI?
- 03 - Ferramentas de prototipagem
- 04 - Patterns
- 05 - Princípios do Design
- 01 - Elementos da interface Intro
- 02 - Espaçamento e Linhas
- 03 - Espaçamento & Linhas: Prática
- 04 - Formas
- 05 - Imagens & Ilustrações pt.1
- 06 - Imagens & Ilustrações pt.2
- 07 - Imagens & Ilustrações: Prática 1
- 08 - Imagens & Ilustrações: Prática 2
- 09 - Imagens & Ilustrações: Prática 3
- 10 - Ícones
- 11 - Ícones: Prática
- 12 - Botões & Links pt.1
- 13 - Botões & Links pt.2
- 14 - Botões & Links: Prática
- 15 - Elementos da composição
- 01 - Teoria das cores pt.1
- 02 - Representação em códigos
- 03 - Propriedades das cores
- 04 - Harmonia das cores
- 05 - Paleta de cores
- 06 - Variação de cores
- 07 - Criando uma paleta de cores
- 08 - Aplicando a paleta de cores
- 01 - Introdução tipografia
- 02 - Escala & Tamanho
- 03 - Altura de Linha & Largura de texto
- 04 - Alinhamento & Espaçamento de texto
- 05 - Negrito, Tracking, Kerning & Maiúsculas
- 06 - Tipografia & Cores
- 07 - Classificações Tipográficas
- 08 - Escolhendo e combinando tipografias
- 01 - Introdução Interfaces Web
- 02 - Usabilidade
- 03 - Acessibilidade
- 04 - O que é um bom design?
- 05 - Wireframes pt.1
- 06 - Wireframes pt.2
- 07 - Wireframes pt.3
- 08 - Wireframes: prática 1
- 09 - Wireframes: prática 2
- 10 - Grids pt.1
- 11 - Grids pt.2
- 12 - Grids Prática 1
- 13 - Grids Prática 2
- 14 - StyleGuide
- 15 - StyleGuide Prática 1
- 16 - StyleGuide Prática 2
- 01 - Básico CSS
- 02 - Classes & IDs
- 03 - Box Model
- 04 - Principais propriedades CSS
- 05 - Seletores & Pseudo-elements CSS
- 06 - Position CSS
- 01 - Intro Flexbox CSS
- 02 - Display Flex
- 03 - Flex-direction & Flex-wrap
- 04 - Justify-content & Align-items
- 05 - Align-content
- 06 - Flex-grow
- 07 - Flex-basis
- 08 - Flex-shrink & Flex
- 09 - Order & Align-self
- 10 - Flexbox: Prática 1
- 11 - Flexbox: Prática 2
- #Mentoria: Prática com CSS Grid
- 01 - Introdução SASS
- 02 - Instalação SASS
- 03 - Propriedade @import
- 04 - Variáveis
- 05 - Propriedade Nesting
- 06 - Propriedades @mixin & @content
- 07 - Propriedades @if & @else
- 08 - Estruturas de repetição @for, @while e @each
- 09 - Funções @functions
- 10 - Grid system com SASS
- 01 - Introdução
- 02 - Instalação Git, Node, Yarn, VSCode
- 03 - Variáveis & Operadores
- 04 - Estruturas Condicionais
- 05 - Functions & Arrow functions
- 06 - Objetos
- 07 - Array & Loops
- 08 - Array & Interações
- 09 - DOM pt.1
- 10 - DOM pt.2
- 11 - DOM pt.3
- 12 - JS Prática: Accordion List
- 13 - JS Prática: Modal
- 14 - JSON
- 15 - JS Assíncrono
- 16 - API & HTTP
- 17 - AJAX
- 18 - Promises
- 19 - Axios
- 20 - Modules JS
- 21 - Desestruturação
- 22 - JS Prática: To do list
- 01 - Intro
- 02 - O que preciso saber de JS?
- 03 - Conceitos Gerais
- 04 - Ambiente de Desenvolvimento
- 05 - SPA: Métodos
- 06 - SPA: Componentes
- 07 - JSX & Webpack/Babel
- 08 - Create React App & Projeto
- 09 - CSS & Componentes
- 10 - Estilizando Menu
- 11 - Estilizando os Posts
- 12 - Props Componentes
- 13 - JSON Server & API
- 14 - Testando API c/ Thunder Client
- 15 - React Hooks UseState & onClick
- 16 - Instalando Axios
- 17 - Listando os Posts c/ API
- 18 - React Hook useEffect
- 19 - Criando Rotas
- 20 - Continuando...
- 21 - useState()
- 22 - useEffect()
- 23 - useCallback()
- 24 - Renderização condicional
- 25 - Context API
- 01 - Introdução ao Motion Design
- 02 - Como usar o motion?
- 03 - Princípios Motion
- 04 - Bibliotecas JS vs. CSS puro
- 01 - Propriedade transform pt.1
- 02 - Propriedade transform pt.2
- 03 - Propriedade animation pt.1
- 04 - Propriedade animation pt.2
- 05 - Propriedade animation: Prática
- 01 - Intro Propriedades SVG's
- 02 - Como usar os SVG's
- 03 - Estrutura dos SVG's
- 01 - Intro Animações
- 02 - Stroke: Xbox
- 03 - SVG Morphing: Spotify
- 04 - Transform-origin & rotate
- 05 - Opacity & translate
- 01 - Introdução GSAP
- 02 - Método set()
- 03 - Método to()
- 04 - Método From() & Ease
- 05 - Método FromTo()
- 06 - Método Stagger()
- 07 - Loop's
- 08 - Funções, eventos & Callbacks
- 09 - Delay
- 10 - Timeline
- 11 - ScroollTrigger: Introdução
- 12 - ScrollTrigger: Start & End
- 13 - ScrollTrigger: ToogleActions
- 14 - ScrollTrigger: Scrub
- 15 - ScrollTrigger: Pin
- 01 - Introdução
- 02 - IP & DNS
- 03 - Website vs. WebApp
- 04 - Hostgator
- Download Arquivo Figma
- 01 - Introdução Nubank
- 02 - UI Design: Pesquisa & Referências
- 03 - UI Design: Wireframes & StyleGuide
- 04 - UI Design: Wireframes & Composição
- 05 - UI Design: Wireframes & Responsividade
- 06 - UI Design: Mockups
- 07 - UI Design: UI Final
- 08 - UI Design: Prototipagem
- 09 - Codificação: Estrutura Inicial
- 10 - Codificação: Tipografia com SASS
- 11 - Codificação: Layout & Media Query
- 12 - Codificação: Tipografia Responsiva
- 13 - Codificação: Menu Estrutura HTML
- 14 - Codificação: Menu pt.1
- 15 - Codificação: Menu pt.2
- 16 - Codificação: Biblioteca SVGInject & Spacing
- 17 - Section Hero pt.1
- 18 - Section Hero pt.2
- 19 - Section People
- 20 - Section Best
- 21 - Section Slider
- 22 - Section Digital Account
- 23 - Section Card
- 24 - Section App Nubank
- 25 - Section Invite
- 26 - Footer
- 27 - Espaçamentos & Código
- 28 - Animações ao Scroll
- 29 - Animações & Performance
- 30 - Conclusão
- 01 - Introdução ao Blog.
- 02 - Metodologia
- 03 - Noções de BD
- 04 - UI Design: Referências
- 05 - UI Design: Hiearquia visual
- 06 - UI Design: Grids & Acessibilidade
- 07 - UI Design: Paleta de cores
- 08 - UI Design: StyleGuide
- 09 - UI Design: Wireframes
- 10 - UI Design: Final
- 11 - Código CSS: Intro
- 12 - Código CSS: Biblioteca SASS
- 13 - Código CSS: Menu
- 14 - Código CSS: Hero
- 15 - Código CSS: Main Posts
- 16 - Código CSS: Cards
- 17 - Código CSS: Profile & Forms
- 18 - Código CSS: Final
- 19 - React.js: Intro
- 20 - React.js: Criando pages.js
- 21 - React.js: Home
- 22 - React.js: API Home
- 23 - React.js: Rotas RRDv6
- 24 - React.js: Conteúdo pages.js
- 25 - React.js: Listando os posts
- 26 - React.js: Final Home & commit
- 27 - React.js: Pesquisa
- 01 - UI Design
- 02 - Codificação
- 03 - Motion Design
- 01 - Mentoria ID Visual
- #Mentoria: UI Design
- 01 - Portfólio e UI Design
- 02 - Código: HTML, CSS & JS
- 03 - Motion Design: GSAP
Sou técnico em informática e graduado em Engenharia Eletrônica com ênfase em Software e Telecomunicações pela UnB (Universidade de Brasília). Atuo como UI Motion Designer e Desenvolvedor Front-End e compartilho conteúdo no Instagram @nasseryousef__.
Capacitações:
Capacitação Profissional em Informática; Lógica e Linguagem de Programação; TI - Técnico em Informática (ETC - 2012); Especialização em Desenvolvimento de Interfaces Web (HTML5, CSS3, Javascript ES6+, Bibliotecas JQuery); Conhecedor em bibliotecas de animações web (GSAP, Anime.js, Barba.js); Especialização em WebDesign Gráfico (Adobe Photoshop, Adobe Fireworks, CorelDRAW); Programação (PHP, Java, C, Javascript ES6+); Desenvolvedor web React.js e seu ambiente; Conhecedor de Banco de Dados SQL e MySQL; Noções de Animação Gráfica (Adobe After Effects, Adobe Flash); Conhecedor de LatéX, desenvolvimento de modelos de relatórios, artigos, revistas, dissertações na Engenharia Elétrica e Observatório Sismológico SIS/UnB; Noções de aplicativos WEB (JOOMLA, WordPress); Engenheiro Eletrônico com ênfase em Software e Telecomunicações - UnB; UI Designer & Brand Designer (Figma).
Avaliações
Perguntas Frequentes
Todas as avaliações mostradas aqui foram feitas por pessoas reais que compraram e deram sua opinião sobre o curso. Quando alguém compra um curso através da Hotmart, a pessoa recebe um convite para avaliar o conteúdo dele. A nota nesta página é o resultado da média das avaliações feitas por estes compradores, que vai de 1 a 5 estrelas.
A nota média de FrontPUSH 3.0 é de 4.8 estrelas. Depois de cada compra na Hotmart, você tem a oportunidade de avaliar a qualidade do curso e o seu nível de satisfação. Com a opinião dos compradores, nosso sistema calcula a nota média e colhemos os comentários que vão ajudar outras pessoas no momento da decisão de compra.
Primeiro, você precisa criar seu cadastro grátis, clicando aqui. Lá dentro, você tem acesso a mais de 15 formatos pra transformar o que você sabe em um produto digital. Além disso, vai poder acessar também o Hotmart Academy.
O Prazo de Garantia é o período que você tem para pedir o reembolso integral do valor pago pela sua compra, caso o produto não seja satisfatório. Assim que solicitado, seu reembolso é processado automaticamente pela Hotmart em até 5 dias. Para pagamentos com boleto bancário, você precisa preencher uma conta bancária para receber o dinheiro. Passados os 5 dias, o valor poderá ser identificado em sua conta em até 7 dias úteis. Já o estorno da fatura do cartão de crédito varia de acordo com o meio de pagamento e pode ocorrer na fatura atual ou na seguinte.
Alguns cursos online oferecem um certificado digital de conclusão. Alunos podem emitir esse certificado ao final do curso ou entrando em contato com o Autor ou Autora. Esses certificados podem ser compartilhados em redes sociais como o LinkedIn e inseridos em informações curriculares.
Os produtos na Hotmart têm diferenciais que mudam de acordo com o tipo de produto e a disponibilidade. Por exemplo, produtos do tipo "Cursos online" podem ou não oferecer certificado digital de conclusão. Caso o certificado esteja disponível, alunos podem emiti-lo dentro do curso ou entrando em contato com o(a) Autor(a). Os certificados podem ser compartilhados em redes sociais como o LinkedIn e inseridos em informações curriculares. A garantia também é um diferencial dos nossos produtos e pode variar de 7, 15 ou 30 dias, de acordo com o oferecido pelo Autor(a). Para ver os diferenciais disponíveis neste produto, basta checar a seção Diferenciais.
Você receberá o acesso a FrontPUSH 3.0 por email. Pode ser um curso online, um ebook, uma série de videoaulas, um serviço, evento, etc. O conteúdo será acessado ou baixado através de um computador, celular, tablet ou outro dispositivo digital. Você também pode acessar o produto comprado nesta página:
Para comprar este curso, clique no botão “Comprar”. Lembre-se de que nem todos os cursos estarão sempre disponíveis para compra. É possível que o Autor ou Autora esteja preparando uma nova turma ainda sem inscrições abertas.
Para ser Afiliado(a), recomendamos que leia os guias que disponibilizamos em todos os canais da Hotmart. Além disso, uma boa maneira de se informar um pouco mais é acessando nosso blog. O produto desta página está disponível apenas para compra, para ver os produtos de afiliação, vá até o Mercado de Afiliação.
Temos um canal exclusivo para receber denúncias em produtos que não estão de acordo com as regras da plataforma Hotmart. Se você vir informações inadequadas, denuncie aqui
Acesse nossa Central de Atendimento, onde explicamos, em detalhes, todas as dúvidas que você possa ter antes, durante ou depois de comprar um produto digital na Hotmart.
