Mirtilo
Defesa de conceito Maio, 2026
Portfolio · Dani Maldonado

Forma e
função,
juntas.

Resgatando o método Bauhaus original como sistema de navegação digital.

Cliente
Dani Maldonado
Documento
Defesa de conceito v1
Próxima etapa
Protótipo de média fidelidade
Plano de orientação colorido da Bauhaus em Dessau, por Hinnerk Scheper, 1926
Hinnerk Scheper, Farbiger Orientierungsplan des Bauhauses in Dessau, 1926. Referência principal deste projeto.
01 · ponto de partida

Quatro premissas, do workshop ao site.

Depois do workshop, identifiquei quatro premissas que precisam estruturar este site.

Premissa 01

Clareza

Vocês foram nas nossas conversas. Em nenhum momento houve dúvida, incerteza ou indecisão. Essa qualidade precisa transparecer no site, na navegação, na hierarquia e no copy.

premissa 02

Jornada

As palavras jornada, experiência e interação apareceram repetidamente na nossa conversa. Ficou claro que a experiência de percorrer o site precisa ser tão pensada quanto o que ele apresenta.

premissa 03

Repertório

Cada referência que vocês trouxeram tinha uma razão precisa para estar ali. Isso revelou um modo de pensar que admiro: entender como a unidade impacta o todo, e como o todo se constrói de unidades bem resolvidas.

Vocês também defenderam um portfolio direto, sem inflar o que não precisa. Isso me posicionou: não é sobre demonstrar habilidade técnica, é sobre demonstrar critério.

E, por fim, o repertório pessoal da Dani, ter morado em diferentes países, falar várias línguas, reconhecer referências da história da arte, precisa estar no site como um todo, não em uma frase.

premissa 04

Sensibilidade

Sensibilidade aparece na cultura de trabalho que vocês descreveram, no cuidado com cada novo desafio e no estilo de liderança. No site, ela se traduz em ritmo de leitura, escolha tipográfica, tempo das transições e atenção ao detalhe, coisas que o usuário sente sem precisar nomear.

Estava evitando Bauhaus porque a internet hoje está saturada de neo-bauhaus que pega a estética e perde a essência: forma e função operando juntas.
02 · direção conceitual

Por que Bauhaus.

Rabisquei vários caminhos diferentes, mas Bauhaus continuava ecoando na minha cabeça. Estava evitando essa direção justamente por isso. A internet hoje está saturada de "neo-bauhaus" que pega a estética (formas geométricas, cores primárias) e perde a essência: forma e função operando juntas.

Esse princípio, aliás, é mais antigo do que parece. Os egípcios já pintavam figuras com olho frontal porque queriam mostrar a essência da pessoa, não uma vista momentânea. Função determinando forma desde a antiguidade.

Foi quando decifi que o caminho era resgatar o Bauhaus original, não a estética apropriada, mas o método. Percebi que ele era o sweet spot entre as quatro premissas. Clareza, jornada bem desenhada, repertório e sensibilidade são exatamente os princípios da escola.

Orientierungsplan de Hinnerk Scheper
Referência principal Hinnerk Scheper, Farbiger Orientierungsplan des Bauhauses in Dessau, 1926. Acervo Bauhaus-Archiv Berlin.

O Orientierungsplan de Hinnerk Scheper.

Hinnerk Scheper foi o mestre da oficina de pintura mural da Bauhaus em Dessau. Em 1926, ele criou um plano de orientação colorido do edifício da escola: uma planta isométrica explodida onde cada oficina recebia uma cor identificadora, e essa cor era literalmente pintada nas paredes do prédio. As pessoas se orientavam pelo sistema cromático.

É um dos primeiros casos documentados de wayfinding na história do design.

A conexão é direta: usar o mesmo conceito, mas para orientar pessoas num site.

Home, a fundação.

protótipo de baixa fidelidade · v1
Esboço da página home do portfolio
esboço, home, maio 2026

Estrutura do edifício.

Base
Home. Ponto de origem. Tudo parte daqui.
1º andar
About me. Sala única, com a bio da Dani.
1º andar
Hire me. Sala única, formulário de contato. (Prefiro essa palavra a "Talk", mais direta, alinhada com a premissa de Clareza.)
2º andar
Work. No topo do edifício, pois são o conteúdo mais importante.
  • WK

    Work

    Andar superior, seis projetos

  • HR

    Hire me

    Sala única, lado oeste

  • AB

    About me

    Sala única, lado leste

  • HM

    Home

    Base do edifício, acesso a todos os andares

decisões pendentes, abertas para discussão

Sobre os seis projetos.

Estou propondo seis, com quatro em destaque e dois menores. No protótipo, temos 04 com o mesmo nível de destaque. Mas escrevendo aqui, pensei em termos 4 destacados e 2 menores. Queria a opinião de vocês.

Sobre a disposição dos projetos 4, 5 e 6.

Estou estudando se faz sentido eles aparecerem invertidos (apontando para baixo) como liberdade poética, ou se mantemos todos para cima. A decisão final depende de como isso se comporta na responsividade.

Sobre a transição entre andares.

A interação ao clicar em cada laje ainda está em aberto, pode ser um movimento de câmera subindo no edifício, ou uma transição explorando outros padrões visuais Bauhaus. Vamos resolver no protótipo de média fidelidade.

Página interna, Work.

referência, joost schmidt, 1923
Cartaz Staatliches Bauhaus Ausstellung 1923, por Joost Schmidt
Referência da página interna Joost Schmidt, Staatliches Bauhaus Ausstellung Weimar, 1923. A composição diagonal estrutura toda a página de projeto.

A diagonal de Joost Schmidt.

Para as páginas internas, quero usar como base o cartaz de Joost Schmidt para a Bauhaus Ausstellung de 1923 em Weimar. Aquela composição diagonal forte, com a tipografia atravessando o eixo central. A arquitetura dessa peça conversa diretamente com o tipo de conteúdo que vai entrar nas páginas internas.

Esboço da página interna de um projeto
esboço, página interna work, maio 2026

Anatomia da página de projeto.

Topo
Assinatura do projeto. Nome + logo da empresa ou logo do projeto.
Corpo
Conteúdo em diagonal. O conteúdo se desloca seguindo a orientação da peça original. Tomei a liberdade de incorporar imagens e vídeos dentro das formas geométricas, criando uma leitura onde texto e mídia se reforçam mutuamente, cada parágrafo conectado à imagem que o ilustra.
Canto inferior direito
Legenda de navegação. Igual ao mapa do Scheper, com atalhos para Home e outras páginas. Inclui interação opcional para "endireitar" a página e voltar a uma leitura mais tradicional.
Canto superior direito
Botão fechar. Retorna à Home.
Laterais
Navegação entre andares. Passar para outros projetos sem voltar à Home.