Luã Amaro
← Todos os casesItaú

EDITORIAL / ITAÚ / 2025

Feito.Itaú

Portal de conteúdo do Itaú que leva o leitor da matéria até um produto do banco, montado sobre o design system do próprio Itaú.

Ver o feito.itaú no ar ↗
CLIENTE
Itaú, pela Barões Digital Publishing
MEU PAPEL
UX e especificação de interface
ENTREGA
Home, categoria e matéria, biblioteca de módulos editoriais e handoff
TELAS
Desktop e mobile, em seis larguras
Home do feito.itaú

O desafio

O portal precisava levar o leitor de uma matéria até um produto do banco, e tudo tinha de ser montado com o design system do Itaú, que tem regras próprias de uso e aprovação. A liberdade estava na composição, e não na criação de componentes novos.

O que eu fiz

Compus Home, Categoria e Matéria com os componentes do sistema do banco e criei uma biblioteca de módulos que a redação encaixa sozinha: tabela, CTA em cartões, Fato × Mito, galeria e eventos. O handoff saiu com tokens, espaçamento, comportamento e acessibilidade especificados para cada elemento, junto dos times de CX e engenharia do Itaú.

A lógica do projeto

Como pensei

  1. 01

    Acessibilidade dentro do handoff

    A ordem de foco da página está numerada e cada componente tem a leitura definida para o leitor de tela, inclusive os dots do carrossel ("2 de 3"). O dev recebe o comportamento pronto.

  2. 02

    Módulos editoriais em pares

    Fato × Mito e 3 Verdades × 1 Mito foram desenhados em duas opções cada e dimensionados para matéria longa. A redação escolhe pelo tipo de texto, não pelo gosto.

  3. 03

    Dobra testada em três telas

    A mesma home foi conferida em 1280, 1440 e 1920 de largura para garantir que destaque e navegação ficam visíveis nos monitores mais comuns.

  4. 04

    Celular feito para ler e converter

    O header some ao rolar para liberar a leitura e o botão "Vem ser Itaú" fica fixo na base. Tudo com componentes do iDS, o design system do banco.

A página de categoria, com a curadoria de conteúdo por tema.
A página de categoria, com a curadoria de conteúdo por tema.
Dentro da matéria, os módulos editoriais levam o leitor até o produto.
Dentro da matéria, os módulos editoriais levam o leitor até o produto.
A listagem de matérias da categoria, montada com os cards do sistema do banco.
A listagem de matérias da categoria, montada com os cards do sistema do banco.

Telas

Mais telas do projeto

Home no celular, em coluna única.
Home no celular, em coluna única.
Matéria "Cálculo de férias" no celular.
Matéria "Cálculo de férias" no celular.
Módulo Fato × Mito, com o mito no topo.
Módulo Fato × Mito, com o mito no topo.
Galeria de fotos na largura do texto.
Galeria de fotos na largura do texto.
Abertura da matéria com "Leia também" na lateral.
Abertura da matéria com "Leia também" na lateral.
Experts e a seção "Não deixe seu dinheiro parado".
Experts e a seção "Não deixe seu dinheiro parado".
Handoff de acessibilidade com a ordem de foco numerada.
Handoff de acessibilidade com a ordem de foco numerada.

O feito.itaú está no ar

feito.itau.com.br

Ver o feito.itaú no ar ↗

No seu negócio

Conteúdo bem organizado responde dúvidas antes do atendimento e leva a pessoa até o serviço certo. E a sua equipe consegue publicar sem depender de designer a cada post.

Quer algo assim no seu negócio?

Com site ou sem site, receba um diagnóstico gratuito pelo WhatsApp em até 1 dia útil.

Quero um diagnóstico grátis