FloripaJS – Design para não designers

Esse final de semana (14/04) participei do meetup do FloripaJS na Digitro.

Foi uma edição especial para comemorar 4 anos do encontro. Então… Parabéns FloripaJS!

Foi apresentado duas talks:

• Fast Talk: Design para não designers – Bruno Freitas
• React-Native animations – Jabur

Os dois talks foram muito produtivos e é sobre o primeiro (Design para não designers) que iremos falar, onde foi apresentado 15 ferramentas para ajudar os programadores com o “designer”. Vamos lá!

CORES
Colorlovers – Permite a criação e compartilhamento de paletas de cores, fundos e cores. Veja um fundo criado por mim de forma simples e rápida.

Colorlovers – O usuário digita uma cor específica e a ferramenta apresenta um conjunto de informações, tais como: Conversão, Esquemas, Alternativas, Visualizações com código html e css, Tons e matizes e simulador para quem tem problemas de visão.

Coolors – Um gerador de esquemas de cores para ajudar na criação.

TIPOGRAFIA
Google Fonts – Permite o download ou a importação para o código de vários tipos de fontes. Veja exemplo:

/*HTML*/
<link href="https://fonts.googleapis.com/css?family=Acme" rel="stylesheet"> 

/*CSS*/
font-family: 'Acme', sans-serif;

Typespiration – Apresenta toda semana combinações de fonte web inspiradoras e gratuitas com código HTML e CSS, Veja um exemplo:

WhatTheFont – Esse eu já utilizo a algum tempo para descobrir o nome de alguma fonte que eu não saiba. Basta fazer o uploud do arquivo e ele realiza a busca na sua base da dados.

Dafont – Permite baixar uma série de fontes gratuitas que estão categorizadas, muito bom!

IMAGENS
Pixabay e Unsplash – Os dois permitem o download de imagens com qualidade profissional de forma gratuita. Inclusive o segundo eu já tinha apresentado neste post.

Tinypng – Achei esse super bacana! Ele realiza a compactação de imagens (JPG E PNG) sem perder a qualidade para web.

Canva – Esse foi para mim foi a melhor ferramenta apresentada. O Canva auxilia na criação de vários tipos de imagens, tais como: Capa e Post para Facebook, Post para Instagram e muito mais! Veja a imagem para post que criei em 2 minutos!

Dribbble – Apresenta uma série criações para inspirar os “designers” ou os “programadores”.

ÍCONES
Iconmonstr, Fontawesome e Game-icons.net – Para quem é programador esses sites ajudam e muito disponibilizando uma série de ícones gratuitos!

E ai… Gostaram das ferramentas? Todo o crédito para o amigo Bruno Freitas que apresentou isto no talk.

Até a próxima pessoal, abraço. 😀