AVESSO
Loja virtual de moda streetwear: app de e-commerce em português, da vitrine ao pedido rastreado, com marca própria
- Meu papel
- Branding · UX Writing
- Ano
- 2026
AVESSOContexto
AVESSO é uma loja virtual de moda streetwear: um app de e-commerce com vitrine, busca e filtros, página de produto com avaliações, sacola, pagamento, pedidos com rastreio, conta e atendimento, em 48 telas.
A interface parte de um UI kit de e-commerce de terceiros, que veio em inglês e sem marca. O meu trabalho foi criar a marca AVESSO, adaptar o app inteiro para o Brasil e para a voz da marca e revisar as telas depois da tradução.
O desafio
O kit era genérico: textos em inglês, preços em rúpia paquistanesa, tamanhos S, M e L, endereços do Alasca, pagamento em dinheiro e nenhuma marca, só um símbolo de exemplo. Bonito, mas não parecia uma loja de verdade, e muito menos uma loja brasileira.
A meta era transformar esse ponto de partida numa loja com nome, assinatura e jeito de falar, que alguém em Belo Horizonte usaria sem estranhar nada.
O que veio do kit
A estrutura das 48 telas, os componentes, o grid, a paleta em preto e cinza, os ícones e as fotos de produto: vitrine, busca, filtros, produto, avaliações, sacola, pagamento, endereços, cartões, pedidos, rastreio, conta, notificações, dúvidas e atendimento.
O que é da AVESSO
O nome, o símbolo e a assinatura, a abertura do app, a tipografia Hanken Grotesk no lugar da original, todos os textos reescritos em português com a voz da marca e a adaptação para o Brasil: reais, P/M/G, Pix, endereços com bairro e UF e nomes brasileiros. Depois da tradução, revisei as telas e corrigi o que o texto maior quebrou, como chips sobrepostos, preço encostando no botão e título quebrando em duas linhas.
A marca
Avesso é o lado de dentro da roupa, o que normalmente não se mostra. O símbolo é a primeira letra virada do avesso: um A de cabeça para baixo, que também abre a assinatura. Preto e branco como o kit, para a roupa e as fotos serem a cor da loja.
A jornada no app
Do primeiro acesso ao pedido entregue, com os textos e os dados adaptados para o Brasil.
- 01 / 06
Boas-vindas e acesso
A abertura com a assinatura da AVESSO, o cadastro e o login com mensagens de erro e de sucesso em português, como "Digite um e-mail válido" e "Que bom te ver de novo".
- 02 / 06
Vitrine, busca e filtros
Categorias em português (Camisetas, Jeans, Tênis, Moletom), preços em reais com o desconto em vermelho, buscas recentes e filtros por menor e maior preço, faixa em reais e tamanho.
- 03 / 06
Produto, avaliações e salvos
A página do produto com tamanhos P, M e G, a descrição reescrita, as avaliações com nota em formato brasileiro (4,0) e os itens salvos no coração.
- 04 / 06
Sacola e pagamento
A sacola com subtotal, desconto e frete que fecham a conta, o pagamento com cartão, Pix e Apple Pay, cupom de desconto e a confirmação do pedido.
- 05 / 06
Pedidos e rastreio
Pedidos em andamento e concluídos com o status de cada um (Separando, Coletado, A caminho, Entregue), o rastreio no mapa com endereços de Belo Horizonte e a avaliação depois da entrega.
- 06 / 06
Conta e atendimento
Meus dados, endereços e formas de pagamento, a central de ajuda com WhatsApp, as dúvidas frequentes e o chat com o atendimento da AVESSO.
Estados vazios
Sacola vazia, busca sem resultado, nenhuma notificação e nada salvo: cada estado diz o que aconteceu e o próximo passo, no mesmo tom da marca.
Adaptação para o Brasil
Traduzir não bastava: os dados do app também precisavam ser daqui.
Sistema Visual
A paleta do kit foi mantida: preto e cinzas para a interface, verde só para sucesso e vermelho só para desconto e erro. A tipografia mudou para a Hanken Grotesk, uma grotesca de traço firme para a marca e para a interface.
Paleta
Preto AVESSO
#1A1A1A
Marca, títulos e ação principal
Branco
#FFFFFF
Fundo das telas
Cinza claro
#E6E6E6
Bordas e divisórias
Cinza médio
#808080
Textos de apoio
Verde
#0C9409
Sucesso e pedido concluído
Vermelho
#ED1010
Desconto e erro
Tipografia
Hanken Grotesk
400 / 500 / 600 / 800
Marca, títulos e interface
SF Pro
400 / 600
Barra de status e teclado do iOS
Créditos
A estrutura das telas, os componentes e as fotos de produto vêm do Ecommerce App UI Kit, um kit de terceiros. A marca AVESSO, os textos, a adaptação para o Brasil e a revisão das telas são meus.
Aprendizado
Um UI kit acelera a estrutura, mas não faz uma loja. O que faz o cliente confiar é o que está em volta da tela: um nome que ele lembra, um preço no formato que ele lê todo dia, o tamanho que ele veste e um texto que fala como gente. E toda tradução muda o tamanho das palavras, então a revisão tela por tela faz parte do trabalho.


