Unified Merge V5.0

NOVURA
Brand & Design
Engine

Das vereinigte Designsystem: V4.2 Design Engine (Cursor/Native) fusioniert mit den VibeNow Brand Guidelines (Marketing/Web). Ein Dokument für alle Kontexte.

React Native + Web · Soft Matte Glass 2.0 · OLED-First · Zero-Creep

01 — Core Philosophy

Vier Säulen Merged

Drei Prinzipien aus der V4.2 Design Engine, ergänzt um die strategische Zero-Click-Doktrin.

Zero-Creep

Private Daten abstrahieren. Termine als unscharfe Farbbalken, nie als Kalender-Einträge. Permissions nur via Soft Prompts. V4.2

Zero-Delay

Absolute Performance. Keine Ladebalken. Flüssige Übergänge, flache DOM-Trees, App Shell Modell. V4.2

Microcopy

Modern, intelligent, extrem kurz. Labels wie "Sync?", "Yes", "Later" statt langer Erklärungen. V4.2

Zero-Click

Decision Fatigue eliminieren. Ein immersiver Feed basierend auf Tageszeit, GPS und Vibe-Profil. Erweiterung

02 — Die Farb-Matrix

OLED-First. Premium-Signale. V4.2

Das Farbkonzept lebt auf der tiefen Dunkelheit des OLED-Displays, durchbrochen von hochpräzisen, gedeckten Premium-Farben.

Base & Shells

Deep OLED Base

#0A0C10

Absoluter Grundwert

Dynamic Teal Gradient

#143b42 → #0A0C10

Atmosphäre Home/Discover

Primary & Accents

Premium Coral

#FF5A5F

Sektions-Header, Alerts

Novura Teal

#0F9D7F

Buttons, aktive States

Scarcity Orange

#FFA01E

Knappheits-Trigger

Winter-White

#F0F8FF

Echtzeit-Daten

AI Gradient

#9BDEE9 → #A67EE1

Nur KI-Elemente

Daily Flow Event-Farben V4.2

Sleep

rgba(160,155,145,0.5)

Work

rgba(100,150,255,0.5)

Private

rgba(15,157,127,0.5)

Meetup

rgba(255,160,30,0.5)

Sport

rgba(240,245,255,0.6)

Marketing Hero Gradient Nur Web

Hero Gradient

#A78BFA → #F472B6 → #F97316

Nie in der App!

03 — Vibe-Kategorien

Vier Stimmungen, vier Farbwelten Erweiterung

Chill

Yoga, Sunset Sessions, Meditation

chill · #6EE7B7

High Energy

Clubs, Raves, Sport Events

high_energy · #F97316

Focus

Workshops, Co-Working, Kunst

focus · #818CF8

Social

Dinner Parties, Meetups, Hikes

social · #F472B6

04 — Soft Matte Glass 2.0 V4.2

Multi-Layered Glass Architektur

Keine flachen Farben. Jede Komponente ist Teil eines Glas-Systems mit Alpha-Transparenzen statt Schatten.

Outer Container
0.02 – 0.03 Alpha

Inner Track
0.06 Alpha

Premium Kante
0.12 Border oben

05 — Typografie Merged

Dual-Track Typografie

Native App: SF Pro. Web/Marketing: Outfit, DM Sans, Space Mono.

Display / H1Secret Garden Session

Section HeaderDAILY FLOW

Heading / H2Dein nächstes Erlebnis

BodyEin kuratierter Abend für echte Verbindungen.

Mono / Tagsvibe_category: chill

Emoji-Verbot V4.2

Native Emojis im React Native Code verboten (Metro-Cache-Crashes). Nur Feather Icons.

06 — UI-Elemente Merged

Buttons, Pills & Tags

Vibe Pills

chill high_energy focus social

Spacing (8px Grid)

4

8

12

16

24

32

48

07 — Layout & Native Rules V4.2

Technische Pflichtregeln

Global Padding

24px horizontaler Rand. Alle Abstände sind Vielfache von 8.

Edge-Bleed

Wischbare Elemente mit negativen Margins (marginHorizontal: -24) aus dem Raster brechen.

Magnetic Snap

snapToInterval + decelerationRate="fast" für pixelgenaues Einrasten.

Alpha-Masks

LinearGradient-Masken an ScrollView-Rändern mit pointerEvents="none".

Anti-Divitis

DOM flach halten. Keine unsichtbaren View-Wrapper. iPhone 16e testen.

Apple Touch 44x44

Alle klickbaren Flächen mindestens 44x44px. hitSlop oder padding nutzen.

08 — Zero-Click Feed Merged

Das Herzstück: One-Card-Feed

Dark Teal Gradient (V4.2), Vibe-Pills und Scarcity-Trigger, Novura Teal als CTA.

Willkommen in Berlin!

Regnerischer Nachmittag. Chill Vibe.

Nur noch 2 Plätze!

chill

Secret Garden
Sunset Session

Kreuzberg · 18:30 · Verified

HomeDiscoverRadarChatsProfil

09 — Tonalität & Bildsprache Merged

Wie ein smarter Insider

So klingt NOVURA

"Heute Abend passt ein Workshop perfekt zu dir."

So nicht

"Basierend auf Ihren Präferenzen empfehlen wir folgendes."

Scarcity

"Noch 2 Plätze — dein Spot wartet."

Scarcity

"LETZTE CHANCE!! NUR NOCH 2 PLÄTZE!!!"

Microcopy (V4.2)

"Sync?" · "Yes" · "Later" · "Let's go"

Verboten

"Möchten Sie Ihren Kalender jetzt synchronisieren?"

Sprachprinzipien

Du, nicht Sie

Immer "du" — auch im B2B.

Max 8 Wörter

Headlines kurz. Body max 2 Zeilen.

FOMO, aber leise

Keine Caps-Ketten.

EN-Mix

"Vibe", "Drop" bleiben englisch.

Bildsprache Erweiterung

Low Light, High Mood

Nacht-/Dämmerung. Warme Lichtquellen.

Cinematic Ratio

9:16 Feed, 16:9 Header. Tiefenunschärfe.

No Cheese

Keine Posen, keine Stock-Fotos.

10 — Design Tokens Merged

CSS Custom Properties

Copy-Paste-ready für Cursor, Figma und Dev-Team.

/* NOVURA Unified Design Tokens V5.0 */

/* Base (V4.2) */
--nv-oled-base:         #0A0C10;
--nv-teal-gradient:     #143b42;

/* Glass Surfaces */
--nv-surface-01:        rgba(255,255,255,0.02);
--nv-surface-02:        rgba(255,255,255,0.03);
--nv-surface-03:        rgba(255,255,255,0.06);

/* Borders */
--nv-border-soft:       rgba(255,255,255,0.05);
--nv-border-medium:     rgba(255,255,255,0.08);
--nv-border-hard:       rgba(255,255,255,0.12);

/* Brand Colors */
--nv-coral:             #FF5A5F;
--nv-teal:              #0F9D7F;
--nv-scarcity-orange:   #FFA01E;
--nv-winter-white:      #F0F8FF;

/* AI Gradient */
--nv-ai-gradient:       linear-gradient(90deg, #9BDEE9, #A67EE1);

/* Vibe Categories */
--vibe-chill:           #6EE7B7;
--vibe-energy:          #F97316;
--vibe-focus:           #818CF8;
--vibe-social:          #F472B6;

/* Fonts */
--font-native:          SF Pro (System);
--font-web-display:     'Outfit';
--font-web-body:        'DM Sans';
--font-mono:            'Space Mono';

/* Radii */
--radius-tech: 3px;  --radius-sm: 6px;
--radius-md: 12px;  --radius-lg: 16px;
--radius-card: 20px;  --radius-pill: 999px;

/* Spacing (8px Grid) */
--space-1: 4px;  --space-2: 8px;  --space-3: 12px;
--space-4: 16px; --space-6: 24px; --space-8: 32px;
--global-padding:       24px;
--touch-min:            44px;