Portfolio · Case study

Um estúdio.
Quatro linguagens.

Todo projeto Rapidola começa com uma pergunta: como esta marca deveria se sentir? As quatro páginas abaixo compartilham o mesmo estúdio, o mesmo cuidado, e absolutamente nenhum template. Este brandbook explica o pensamento por trás de cada uma.

Caso 01
Atelier Norte
CalmoEditorialAtemporalSofisticadoPremium
Ver site ao vivo

Atelier Norte

Arquitetura que atravessa décadas

Arquitetura japonesa minimalista encontra o luxo escandinavo. Espaço em branco massivo, tipografia serifada editorial e movimentação silenciosa. Sensação de galeria, a fotografia é a protagonista.

Sistema de cor
5 tokens
Warm White
#FAF9F6
Fundo
Stone
#E8E5DF
Seções alternadas
Charcoal
#1E1E1E
Texto & UI
Oak Accent
#B8956A
Detalhes
Concrete
#7A7A75
Muted
Tipografia
3 papéis
Display
Cormorant Garamond
400
Aa 01
Display Italic
Cormorant Italic
300 · Italic
atravessam
Body / UI
Inter
400
Corpo de texto e navegação.
Sistema de componentes
Padrões-chave
01
Split layouts

Grid 12-col com projetos alternando direção, direita/esquerda em zigzag editorial.

02
Parallax hero

Imagem em tela cheia com deslocamento vertical suave e leve zoom no scroll.

03
Massive typography

Serifas em 112px+ misturando roman e italic para hierarquia poética.

04
Thin line dividers

Linhas 1px em neutral-300 separam seções, sem cartões, sem sombras.

Caso 02
Clínica Vero
ConfiançaLuxo suaveBrightAcolhedorPremium
Ver site ao vivo

Clínica Vero

Saúde desenhada em torno de você

Apple encontra spa de bem-estar de luxo. Vidros foscos, gradientes flutuantes, cartões arredondados e ouro discreto. Tudo respira calma, o oposto de um hospital.

Sistema de cor
5 tokens
Warm White
#FBF8F3
Fundo
Soft Peach
#FFE4CC
Aurora 1
Champagne
#F5E6C8
Aurora 2
Gold
#C9A961
Accent
Ink
#171717
Texto
Tipografia
3 papéis
Display
Plus Jakarta Sans Light
300
Aa 02
Accent Italic
Fraunces Italic
300 · Italic
desenhada
Body / UI
Plus Jakarta Sans
400
Interface arredondada, calma.
Sistema de componentes
Padrões-chave
01
Glass navbar

Barra flutuante com blur, borda branca 60% e sombra dourada baixíssima.

02
Aurora background

3 orbes gigantes em blur 120px, com paleta pêssego/champagne fixados em -z-10.

03
Floating cards

Cartões com y animado em loop de 5-6s, backdrop-blur-xl e borda branca translúcida.

04
Rounded 24-40px

Todos os raios são generosos, botões-pílula, cartões 3xl, hero 40px.

Caso 03
Cafeteria 24
CozyTerrosoArtesanalOrgânicoModerno
Ver site ao vivo

Cafeteria 24

Cada xícara conta uma história

Copenhague em Castanhal. Cores terrosas, serifas editoriais em itálico e formas orgânicas. Padaria artesanal, quente, honesta, saborosa. Sem grid rígido: o menu respira como um livro.

Sistema de cor
5 tokens
Café
#3B2416
Seção escura
Cream
#F7F0E4
Fundo
Terracotta
#B8552E
Primary
Caramel
#E8B77A
Accent
Sand
#E8C79A
Seções alternadas
Tipografia
3 papéis
Display
Instrument Serif
400
Aa 03
Display Italic
Instrument Italic
400 · Italic
conta
Body / UI
Inter
400
Preço, descrição, hora de funcionamento.
Sistema de componentes
Padrões-chave
01
Menu dotted-leader

Cardápio no estilo livro: nome à esquerda, pontos, preço à direita.

02
Organic image masks

Raios assimétricos (100px/20px) criam formas orgânicas em fotos.

03
Warm dark section

O cardápio inverte para #3B2416, a experiência de estar dentro do café à noite.

04
Instagram grid

6 imagens quadradas com hover-scale sutil, a vida da casa.

Caso 04
Studio Paralelo
CinemáticoArtísticoPremiumEditorialOusado
Ver site ao vivo

Studio Paralelo

Histórias através da luz

Revista de moda de alta costura em formato de site. Preto absoluto, film grain, tipografia grotesca massiva, grid assimétrico e um marquee infinito. A imagem <em>é</em> o design.

Sistema de cor
5 tokens
Absolute Black
#000000
Fundo
Off White
#FFFFFF
Tipografia
Soft Gray
#A3A3A3
Metadata
Ink Gray
#171717
Cartões
Silver
#D4D4D4
Detalhes
Tipografia
3 papéis
Display
Space Grotesk Bold
700
Aa 04
Accent Italic
Fraunces Italic Light
300 · Italic
light.
UI Micro
Space Grotesk Uppercase
500
NAV. 11PX / 0.28EM
Sistema de componentes
Padrões-chave
01
Film grain overlay

SVG turbulence fixo em toda a tela com mix-blend-overlay. 8% de opacidade.

02
Asymmetric magazine grid

Grid 12-col com aspect-ratios variáveis, offsets verticais e cartões grandes/pequenos alternados.

03
Infinite marquee

Categorias em display 80-100px correm em loop de 40s, energia editorial.

04
Mix-blend nav

Barra em mix-blend-difference, a navegação inverte automaticamente sobre imagens.