Você, Uma plataforma completo para afiliados e anunciantes
Para quem anuncia, para quem divulga e para quem compra.
O projeto Você é uma plataforma de afiliados que conecta influenciadores digitais aos principais varejistas do Brasil.
Nela, afiliados podem criar suas próprias lojas online e vender produtos de grandes marcas parceiras, de forma simples e personalizada.
Recebi a missão de transformar essa ideia em realidade, projetando uma solução funcional que atendesse tanto afiliados quanto anunciantes.
✅ O que foi feito?
✔ UI Kit
✔ Design System
✔ Arquitetura da informação
✔ Fluxo avançado de telas
✔ Diagnóstico de Usabilidade
🥷 Equipe
✔ Product Manager (1)
✔ Product Owner (2)
✔ Devs (3)
✔ Product designer (me)
🛠️ Ferramentas
✔ Figma
✔ Quasar.js (framework)
✔ Google Meet
✔ Microsoft Clarity
✔ Jira
✔ IA (pesquisa)
Um projeto robusto e cheio de desafios
Com uma grande perspectiva de crescimento, o projeto Você envolveu diversas visões e muitos detalhes, deixei tudinho organizado, dentro de um fluxo coeso e bem estruturado.
Cada ambiente conta com perfis de usuário, quadros de notificações e suporte.
A plataforma foi pensada para atender 4 perfis principais de usuários:
👨🏼🦰 Afiliados
Influenciadores que criam e gerenciam suas lojas personalizadas.
🏢 Anunciantes
Grandes marcas e varejistas que oferecem produtos para divulgação.
🛠️ Admin (Equipe Interna da Você)
Time responsável pela gestão da plataforma, usuários e conteúdo.
🛍️ Clientes
Consumidores que acessam as lojas dos afiliados para realizar compras.
Mobile “First” 🤔
Embora o projeto tenha começado com foco na versão desktop, a demanda por acesso mobile cresceu rapidamente.
Inicialmente, a ideia era lançar também um aplicativo, mas após análise de custos e prazos, sugeri por uma versão web responsiva como MVP.
Uma pesquisa rápida apontou que a área de afiliados precisava ser adaptada para mobile. Além disso, com os dados que analisei através do Microsoft Clarity percebi que a maioria dos acessos às lojas afiliadas acontecia via dispositivos móveis, o que direcionou o time a priorizar o desenvolvimento dos templates das lojas pensando primeiro na experiência mobile.
Assim, o “mobile first” se tornou um caminho natural, impulsionado pelo comportamento real dos usuários.
Explorando mais um pouco
Sim, é bastante coisa! Trabalhei criando um fluxo completo, rico em microinterações, com telas para afiliados, anunciantes, admin e clientes, para desktop e mobile, Ufa!
Design Process
Empathize ❤️+🧭️
✔ Entrevista com stakeholders
✔ Entrevista técnica
✔ Benchmarking
✔ Moodboard
Define 💡
✔ Arquitetura da informação
✔ Wireframe
✔ Novo User flow
✔ Validação técnica
Prototype 🔧
✔ UI flow
✔ UI kit
✔ Design System
✔ Ilustração vetorial
Delivery 📦
✔ Coleta de insights
✔ Planejamento de lançamento
Se aprofundando para entregar a melhor experiência
Ao lado do Product Owner do projeto, absorvi todas as ideias iniciais, organizei os pontos, coloquei tudo em perspectiva.
O prazo era curto, mas também era um desafio emocionante. Nossa, projetar uma plataforma completa do zero.
Com o suporte do time técnico, validei possibilidades e defini um escopo de MVP para cada ambiente, tanto para afiliados quanto para anunciantes.
Na sequência, mergulhei no universo dos afiliados para entender seus comportamentos, necessidades e expectativas.
Observei plataformas como Hotmart e Monetize, e realizei testes criando lojas de afiliados em sites como Amazon, Magalu, Shopee, entre outros.
Para apoiar o direcionamento visual da plataforma, construí um moodboard elaborado, consolidando referências de estilo, cores, tipografia e linguagem de marca.
⬇️ Alinhamento de ideias e escopo
⬇️ Definição de MVP
⬇️ Pesquisa de mercado e benchmarks
⬇️ Criação do moodboard e direção visual
Principais personas
Área do afiliado
🧔🏽 Afiliado
Influenciadores digitais, blogueiros e criadores de conteúdo com grandes ou pequenos públicos, interessados em criar e gerenciar suas próprias lojas online de produtos.
💻 Recursos de rotina
Windows, Android, iOS, Meta Ads, Google Ads
📱 Mídias sociais:
Instagram, You Tube e Tiktok
⚙️ Modelo de atuação:
Remoto.
📚 Formação e interesses:
Marketing, Web design, Mídias sociais e áreas relacionadas
Área de Anunciantes
👩🏻🦰 Representante de empresa parceira
Profissional que representa empresas parceiras da plataforma. É responsável por gerenciar campanhas, acompanhar conversões, validar criativos e orientar os afiliados para garantir o bom desempenho das ações.
“Profissionais que conectam a marca aos afiliados, garantindo que tudo funcione como esperado.”
💻 Recursos de rotina
Windows, Android e iOS
📱 Mídias sociais:
Instagram e Linkedin
⚙️ Modelo de atuação:
Híbrido
📚 Formação e interesses:
Marketing, Adm e áreas relacionadas
Admin
👨🏻🦱 Gerente comercial da Você
Responsável pela gestão geral da plataforma, monitorando campanhas, acompanhando conversões, validando criativos e orientando afiliados e anunciantes para garantir a performance e o bom funcionamento do ecossistema.
“Profissional que conecta todas as pontas e garante a operação da plataforma.”
💻 Recursos de rotina
Windows, Android, iOS, Plataforma V3
📱 Mídias sociais:
Instagram e LinkedIn
⚙️ Modelo de atuação:
Híbrido
📚Formação e interesses:
Marketing e Administração de Empresas
Área da loja
👩🏽🦱 Clientes do afiliado
Seguidor que acompanha influenciadores e confia em suas recomendações de produtos ou serviços. A decisão de compra é fortemente baseada na confiança construída entre o influenciador e seu público.
“Seguidores que transformam confiança em conversão.”
💻 Recursos de rotina
Windows, Android e iOS
📱 Mídias sociais:
Instagram, YouTube e TikTok
⚙️ Modelo de atuação:
Remoto.
📚 Formação e interesses:
Público variado; sem formação específica definida
Design System
Com um fluxo tão extenso de telas no Figma, foi essencial construir um Design System para garantir padronização, consistência e otimização.
Comecei com uma biblioteca simples de componentes e estilos, que evoluiu para um Design System robusto, documentado no Figma e também no Storybook pelos desenvolvedores.
Baseado no framework Quasar.dev, defini:
✅ Estilos tipográficos
✅ Paleta de cores com foco em acessibilidade
✅ Iconografia personalizada
✅ Regras de espaçamento, grids e padrões de UI aplicados em toda a interface
Além disso, desenvolvi uma biblioteca rica de componentes reutilizáveis, com variações de botões, inputs, elementos de navegação, entre outros, todos organizados com Tokens e regras claras de uso e aplicação.
[Início] → Biblioteca simples de componentes
[Evolução] → Design System completo (Figma + Storybook)
[Base tecnológica] → Framework Quasar.dev
[Pilares do Design System] → Tipografia, Cores, Iconografia, Spacing e Grids, Componentes UI (Botões, Inputs, Navegação e mais).
Velocidade para o projeto
A criação e evolução do Design System foram fundamentais para otimizar o tempo de design e desenvolvimento da plataforma.
Toda a aplicação foi estruturada com três bibliotecas de componentes visuais distintos, adaptados para as necessidades específicas de cada ambiente:
✅ Área de afiliados e anunciantes
✅ Template das lojas online
✅ Construtor de templates (ferramenta de personalização das lojas)
Essa divisão inteligente permitiu mais agilidade nas entregas, além de garantir consistência visual e escalabilidade para o crescimento do produto.
Comunicação por e-mail
Também fiquei responsável por criar os modelos de e-mails enviados aos usuários das lojas online, tanto clientes finais quanto afiliados, e também aos usuários da plataforma. Cada e-mail foi pensado para comunicar com clareza em momentos importantes da jornada.
Mensagens para diferentes momentos
Desde o e-mail de boas-vindas até alertas sobre movimentações na plataforma, passando por mensagens relacionadas a compras na loja do afiliado, como pagamento, entrega ou atualização de status do pedido.
Todos os e-mails foram desenvolvidos em versões desktop e mobile, com base no correio eletrônico do Gmail (Google), o serviço de e-mail mais utilizado atualmente.
Considerações e agradecimento
Sou muito grato à Afilio por confiar em mim para assumir esse desafio, e o apoio da equipe. Levo comigo o aprendizado, as conquistas e o orgulho de ter ajudado a construir algo realmente incrível.
Obrigado por você chegar até aqui.😉