Você passou horas aprendendo e praticando, mas tudo o que levou foi... uma melhora decente nas suas habilidades.
Um absurdo! Seres humanos precisam encerrar ciclos. Por isso, fico feliz em anunciar: o GitByBit agora oferece certificados de conclusão para quem termina o curso principal e todas as práticas.
Antes de partir, ele também precisava encerrar um ciclo.
Seu certificado reluzente fica disponível no menu de práticas temáticas assim que você chega ao fim da última prática.
De lá, você cai em uma página onde pode baixar o certificado em PDF. Ele inclui seu nome, a data e uma URL fixa, para que qualquer pessoa possa acessar e verificar o certificado.
1.0 bem grande nessa coisa.Desde fevereiro de 2026, o GitByBit suporta todos os principais sistemas operacionais e está disponível em quatro sabores diferentes:
TL;DR: explico meu processo de criação do estilo gráfico e das ilustrações do GitByBit. Tem um vídeo em time-lapse no final.
Vira e mexe me perguntam qual modelo de IA eu uso para criar as ilustrações do GitByBit. Essas perguntas são um tanto irritantes divertidas, considerando que eu crio a maior parte da arte, se não toda, com minhas próprias mãos desajeitadas. Então resolvi escrever um pouco sobre meu processo e minhas ferramentas de ilustração.
Não sou artista profissional. Sou, e sempre fui, desenvolvedor de coração. E, como a maioria dos devs, eu achava que não sabia desenhar de jeito nenhum. Sinceramente, quando olho muitos dos meus rascunhos em papel, ainda não entendo como aquilo pode virar algo decente se você passar tempo suficiente desenvolvendo a ideia.
Acredito de verdade que habilidades básicas de desenho e design são SUPER úteis para quem desenvolve software ou sites, principalmente se você planeja criar projetos próprios. Elas permitem expressar suas ideias visualmente e fazer seus produtos se destacarem.
Eu diria que, para muita gente procurando emprego como dev nestes tempos estranhos, passar um mês ou dois aprendendo o básico de design é um investimento bem melhor do que se afundar em problemas intermináveis do LeetCode (mas não do que aprender mais Git, haha). É algo que pode fazer você se destacar da multidão e fazer as pessoas notarem você. É algo que você pode usar nos seus próprios projetos. É algo para o qual você pode migrar se um dia cansar de programar. E talvez, como aconteceu comigo, seja algo que você descobre que adora fazer.
Por que ilustrações?
Quando o seu trabalho é ensinar um ser humano, as ilustrações são suas melhores amigas.
- Uma imagem explica certas coisas melhor que uma página de texto.
- Uma metáfora visual esperta crava um conceito abstrato na sua memória como nada mais consegue.
- Uma tirinha dá um alívio mental quando você está atravessando um material difícil e chato.
O padrão de projeto Adapter.
O padrão de projeto Abstract Factory.
O code smell Large Class.
O logo
Procuro pensar no estilo gráfico geral de um projeto novo desde o primeiro dia. É importante definir o tom logo no começo, porque assim você chega ao final com um estilo e um conteúdo bem mais consistentes.
Quando comecei a trabalhar no GitByBit, sabia que precisava de um mascote adorável para o projeto. Eu amo mascotes pra caramba. Aliás, todo mundo ama. Muita gente me conhece só como o cara do site do guaxinim, por causa do Refactoring.Guru.
Mas eu não tinha a menor ideia de que tipo de mascote combinaria com este projeto em particular. Uma criatura sempre associada ao Git é o polvo. E, embora polvos sejam criaturas fascinantes, é bem difícil desenhar um polvo adorável. Tentei por um tempo, mas acabei abandonando a ideia.
O projeto tinha só algumas semanas, e, em paralelo, eu trabalhava no primeiro rascunho do conteúdo. O capítulo sobre git init tinha uma piadinha sobre um gato dormindo no teclado enquanto você estava longe.
Meu gato Steve vivia bagunçando meu trabalho quando era um filhotinho.
Foi aí que tive uma revelação: gatos são perfeitos! São fofos, são engraçados e são conhecidos pelo amor que têm aos teclados. Além disso, existe um estereótipo antigo de que programadores amam gatos, de que uma equipe de programadores é um rebanho de gatos, e por aí vai. Se o projeto inteiro ficasse conhecido como "git com gatos", seria simplesmente perfeito. Tudo se encaixou direitinho.
Foi assim que surgiu a primeira versão do logo do projeto.
Logo do GitByBit v1.0
Isso bastava para começar, mas eu ainda não tinha planos claros para o resto das ilustrações. Naquela altura, eu nem tinha certeza de que o projeto ia decolar. Então decidi focar primeiro no conteúdo principal e me preocupar com o resto depois.
O estilo visual
Outro avanço só aconteceu bem depois, com quase um ano de projeto, em dezembro de 2024. Àquela altura, a primeira versão do conteúdo estava quase pronta, então a criação dos gráficos já parecia atrasada. Eu ainda não tinha a menor ideia do estilo visual geral. Pior: depois de um ano trabalhando no conteúdo, eu estava criativamente esgotado, e a ideia dos gatos já parecia meio batida.
Mesmo assim, durante o recesso de Natal, testei algumas ideias brutas, que no fim renderam as ilustrações que hoje você vê no começo do curso — toda a história do eu estraguei meu projeto (que, aliás, é baseada em fatos reais).
Rascunhos das ilustrações do primeiro capítulo.
Depois de converter tudo para vetor e adicionar uma interatividade básica por cima, cheguei ao conjunto completo de ilustrações do primeiro capítulo, bem parecido com o que você vê no curso hoje.
As ilustrações finalizadas do primeiro capítulo.
Gatos por toda parte
Depois de terminar mais algumas ilustrações no mesmo estilo, tive um momento "é isso". O estilo é brincalhão, fofo e meio bobo, exatamente o que eu queria. Também combina perfeitamente com o tom geral do projeto. Mas não tinha gatos, o que era uma pena. Em algum momento, na base da frustração, rabisquei uma cabeça de gato em cima de uma das ilustrações prontas e descobri que era EXATAMENTE o visual que eu procurava desde o início.
É frustrante voltar atrás e mudar todas as ilustrações já finalizadas, mas isso faz parte de criar um resultado bom e consistente, e acho que no final ficou tudo incrível. As pessoas também parecem adorar.
É fácil se enganar achando que você fez um ótimo trabalho, mas o feedback dos usuários não mente.
O processo
Este é o time-lapse da criação da ilustração da Staging area: 5 horas de tempo real em 5 minutos.
Etapa 1: rascunhar
Eu rascunhava tudo com caneta e papel. Desenhar no iPad sempre me pareceu esquisito, até eu testar, meio por acaso, a película Paperlike. Aplicada na tela do iPad, ela deixa a superfície levemente áspera, e desenhar com a caneta passa a lembrar o papel, graças ao atrito extra. Sei que não soa lá muito convincente, mas, caramba, foi como desenhar em um aparelho completamente diferente. Hoje eu rascunho quase tudo no iPad, a menos que seja algo bem rápido.
Precisei fazer uma pausa de alguns dias no meio do caminho e, nesse intervalo, minha metáfora inicial de que desenvolver software é como montar LEGO, só que quase tudo é cocô 💩 evoluiu um pouco para conversar com as outras ilustrações já prontas (Git, git pull, git push).
Etapa 2: vetorizar
Com o rascunho pronto, levo tudo para o computador e começo a vetorizar no Affinity Designer. É aqui que tudo começa a ficar mais polido e colorido.
Etapa 3: adicionar o efeito parallax
Antes de exportar o arquivo vetorial para SVG, seleciono algumas camadas e dou nomes especiais a elas, que serão renderizados como nomes de classes CSS no SVG exportado. Mais tarde, consigo acessar essas camadas no código para adicionar um efeito parallax quando o usuário mexe o mouse pela tela.
* * *
Espero que essa espiadinha no meu processo de ilustração tenha sido divertida. Se você tiver alguma pergunta ou quiser compartilhar suas próprias experiências criando ilustrações, é só me escrever em alex@gitbybit.com.
Ainda vou anunciar isso direito no próximo post, mas o GitByBit saiu do acesso antecipado semana passada e (finalmente) virou um produto de verdade. O curso principal continua gratuito, mas as práticas temáticas agora fazem parte do complemento pago, o GitByBit PRO.
Se você quiser apoiar meu trabalho daqui para a frente, considere comprar uma cópia para você ou para alguém que você ama. A versão PRO é um pagamento único e tem um preço justo. Nas próximas semanas, dá até para aproveitar um belo desconto de Natal.