Compilado de projetos produzidos principalmente para DP Content e EuConquisto.com.
Alguns dos projetos que participei na empresa DP Content foram pequenos jogos educativos, geralmente recebia o conteúdo em texto, e ficava responsável pela produção visual. Eles tinham uma estrutura muito parecida, uma tela inicial, em seguida cinco perguntas, e uma atividade final. Ao finalizar as telas, exportava elas em png, depois eram montados em html pela equipe de implementação, e por fim incluídas em one pages de cursos online, dentro de iframes como complemento do conteúdo. A seguir mostro algumas telas de dois jogos que produzi, fiz um protótipo no Figma para mostrar um pouco como funcionavam.
Jogos Educativos
Jogo • Disciplina de física
Esse jogo segue a estrutura que expliquei acima, mas especificando um pouco mais, depois de escolher uma das alternativas e clicar em confirmar, aparecera um pop up de feedback com uma explicação sobre a resposta, isso acontece em todas as questões. Ao finalizar as cinco questões, o aluno terá acesso a uma atividade mais dinâmica, a desse jogo por exemplo é um desafio simples com três opções de respostas.
Tela inicial.
Outras telas do jogo.
Ilustrações jogo de Física
Nesse jogo resolvi fazer para capa uma ilustração em vetor, dessa maneira conseguiria deixar a arte de início mais fiel ao conteúdo bruto. Busquei trazer cores que remetessem ao mar, piscina, sol… usei alguns elementos prontos que encontrei no Freepik, como o anel e a escada.
Paleta de cores
Imagens originais do Freepik.
No material bruto do jogo tinha uma referência para a segunda ilustração, seguindo essa referência fiz o copo, já as esferas usei prontas, ajustei a cor e alguns detalhes para ficar mais harmônico.
Protótipo
A seguir um breve protótipo do Figma, é apenas uma parte do material para melhor entendimento.
Clique nos botões para interagir.
Paleta de cores
Ilustração Freepik.
Ilustração do conteúdo original
Jogo • Disciplina de Gramática
Esse é um jogo educativo sobre morfologia, ele tem a mesma estrutura do anterior, cinco perguntas, e uma atividade interativa no final. Nesse caso a atividade final é um arraste e solte, o aluno precisa arrastar os cards com nomes dos estudiosos para as regras correspondentes, em seguida será possível clicar nos cards e ver mais informações sobre os estudiosos que foram citados no jogo.
Tela inicial.
Outras telas do jogo.
Como não tinha algo tão especifico como no jogo de Física foi possível usar apenas uma imagem de capa, encontrei essa imagem no Adobe Stock, editei para ajustar a cor de acordo com a paleta escolhida do jogo e montei a capa inicial. As ilustrações também foram do Adobe Stock, ajustei apenas as cores para manter a consistência.
Protótipo
A seguir um breve protótipo do Figma, é apenas uma parte do material para melhor entendimento.
Clique nos botões para interagir.
Ilustrações
Essa sessão dediquei a algumas ilustrações que fiz e adaptei para projetos. Buscava sempre trabalhar com imagens por ser mais rápido, porém, alguns projetos exigiam algo mais especifico, isso acabava necessitando de algo mais trabalhado ou uma produção do zero. A seguir mostro mais detalhes.
Ilustração • jogo Ipiranga
Ainda sobre jogos, participei de um projeto para Ipiranga, nesse projeto fiz o cenário. Ipiranga tem alguns produtos específicos, a ideia aqui era produzir um jogo de estilo jogo de tabuleiro, seria uma rua, onde teriam alguns postos de Ipiranga, cada posto com um produto especifico. O jogador teria como objetivo abastecer e a cada posto que chegasse abriria um pop up com uma explicação sobre o produto e uma atividade dinâmica sobre, passando essa etapa ele poderia ir para o próximo posto até chegar no desafio final do jogo. O desafio final era um jogo da memória sobre os produtos com mais informações sobre eles.
Para essa ilustração, pensei em usar a perspectiva isométrica por ser bem mais fácil de encontrar elementos prontos que possam compor o material, nesse caso os postos retirei do Shutter Stock, o ícone de abastecimento também, o restante produzi usando algumas referências do próprio Shutter e Pinterest.
Tela inicial, cenário tabuleiro.
Imagens do processo.
Ilustrações • Estácio
Participei por um bom tempo na produção de cursos para Estácio, fazia a diagramação e também adaptava algumas ilustrações dos cursos, dificilmente precisava fazer alguma ilustração do zero, geralmente fazia muitas adaptações usando ilustrações prontas do Shutter Stock. A seguir alguns exemplos de adaptações.
Adaptada para Estácio, solicitada pela DP Content.
Ilustração Shutter Stock.
Adaptada para Estácio, solicitada pela DP Content.
Ilustração Shutter Stock.
Adaptada para Estácio, solicitada pela DP Content.
Ilustração Shutter Stock.
Ilustrações • EuConquisto.com
Sendo bem honesta, eu não gostei da escolha de ilustrações, por serem bem comuns na internet. Elas estão em todos os lugares possíveis, principalmente a desse ilustrador ou agência. Nunca consegui achar muitas informações sobre ele além das que tem no Shutter, se chama SurfsUp. Conversei sobre isso, mas a escolha final foi essa mesmo, então busquei modificar o máximo possível para não ficarem tão iguais as que já estão em vários sites e blogs na internet. Uma outra questão é que sempre que possível tento trazer mais diversidade para as ilustrações, já que talvez por serem antigas essa questão não era tão discutida. O resultado você pode conferir a seguir.
Adaptado para ECC.
Ilustração Shutter Stock.
Adaptado para ECC.
Ilustração Shutter Stock.
A seguir uma ilustração que adaptei aplicada a um formulário.
Adaptado para ECC.
Infográficos
A seguir alguns infográficos de projetos, transformar conteúdos em infográficos é algo que fazia com frequência, eles deixam o conteúdo muito mais fácil para o aluno entender. Sempre que possível fazia infográficos também interativos, assim o aluno não apenas recebia a informação passivamente, mas poderia interagir com o material.
Infográfico do curso Jobs To Be Done para ECC.
. . .
. . .
Infográfico do curso Google Workspace para Google, solicitada pela DP Content.
Infográfico do curso de Comunicação para Estácio, solicitada pela DP Content.
Artes Gerais
Para essa sessão selecionei algumas artes que gostei muito de ter produzido para cursos, jogos e apps.
Arte para aplicativo de eventos, produzido para o Banco Votorantim, solicitado por EuConquisto.com.
Telas produzidas no Figma e Photoshop, fazem parte de um aplicativo de eventos para o Banco Votorantim. Era um aplicativo em que o cliente poderia conseguir alguns "BV Coins" participando de eventos.
Banner do curso de Vendas para Vendas Play, solicitada pela DP Content.
Imagem para um carrossel do curso de Vendas para Vendas Play, solicitada pela DP Content.
Ilustração Shutterstock, adaptada para EuConquisto.com, 2023.
E-mail marketing
Esse e-mail foi produzido para empresa Empírica Digital, para informar os jogadores de War da atualização de preços dos planos e sistema de rankings. Inicialmente o responsável queria que fosse feito com Loren Ipsum, sugeri fazer com um texto genérico gerado pelo Chat GPT, gerei o conteúdo, adaptei alguns trechos e depois produzi esse e-mail. As imagens também são inteligência artificial, porém são prontas do Freepik, não gerei elas.
