Vitrine de Movimento // Design System
Alma da Marca
Pitch
V2.0
Menu
Navegação Completa
45 Páginas // V2.0
×
MENU
Brandbook
00
Diretrizes
→
02
Alma da Marca
→
03
Fundamentos da Marca
→
04
Logo
→
05
Ícones
→
06
Moodboard
→
07
Fundamentos DS
→
08
Tipografia
→
09
Tokens de Cor
→
10
Espaçamento
→
11
Superfícies e Texturas
→
12
Tokens Semânticos
→
13
Exportar Tokens
→
14
Efeitos
→
15
Padrões
→
Sistema de Design
16
Motion
→
17
Ilustrações
→
18
VFX
→
19
Templates
→
20
SEO
→
21
Botões
→
22
Formulários
→
23
Feedback
→
24
Estados
→
25
Tabelas
→
26
Listas
→
27
Gráficos
→
28
Cards
→
29
Componentes
→
30
Navegação
→
Vitrine
31
Seções
→
32
Seções LP
→
33
Diagrama de Fluxo
→
34
Avançado
→
35
Editorial
→
36
Mockups
→
37
Vestuário
→
38
Roupas
→
39
Jaquetas
→
40
Tênis
→
41
Avatares
→
42
Slides
→
43
Brownfield
→
44
Visão do Pitch
→
Vitrine de
Movimento
Explorações de Animação do Logo Maggium — Clique em Qualquer Célula para Repetir
Sistema de Animações
8 Animações
2026
01 // Animações CSS Keyframe
Aceleradas por GPU
M
A
G
G
I
U
M
Pulso de Orquestração
Revelação Completa — 3.5s — Hero / Splash
Ponto semente + stagger por letra + linhas de velocidade neon + anel brilhante pulsante.
MAGGIUM
Linhas de Velocidade
Ênfase — Inspirado no Pin 1 — 2s
Logo bege desliza enquanto linhas de velocidade cobre se desenham com stagger.
Órbita de Partículas
Loop — Inspirado no Pin 2 — Agentes
M central com spring + 4 partículas orbitais flutuantes.
M
A
G
G
I
U
M
Dissolução do Logo
Transição — 3s — Saída / Fade
Texto MAGGIUM começa sólido, letras individuais piscam e se dissolvem até desaparecer.
Quadrado Morfôtico
Loop — Mutação de Forma — Ciclo de 3.5s
Quadrado transforma-se entre formas: quadrado para arredondado para círculo e volta. Loop contínuo.
MAGGIUM
Revelação Glitch
Dramático — 2s — Tech / Hacker
Scanlines + ruído + skew + hue-rotate com estabilização suave. Estética terminal.
M
A
G
G
I
U
M
Letras Escalonadas
Elegante — 1.5s — Navbar / Rodapé
Cada letra sobe com spring + rotateX 3D. Sublinhado cobre fecha. Limpo e reutilizável.
MAGGIUM
Revelação da Marca
Premium — 3s — Hero da Landing Page
Cortinas pretas abrem do centro, revelando MAGGIUM com escala + brilho + linhas decorativas.
