umdenken.jetzt · Gestaltungsraster
Ein Raster, das trägt.
Dieselben Mechanismen wie das Referenzsystem, gefüllt mit Sabines Blaugrün. Für Frauen, für Beziehungen, für Familien. Karten, Schatten, Korn und Hover sind hier echt, nicht beschrieben. Was du siehst, ist der Bau.
00 Grundsatz
Sechs Regeln, die überall gelten.
Wer nur eine Seite baut, hält sich an diese sechs. Der Rest ist Ausführung.
01 Farben
Sabines Blaugrün.
Kein Grün, kein greller Türkis. Ein ausgewogenes Blaugrün, das kühl auf dem warmen Papier sitzt. Es ist Marke, Schrift und Aktion. Weiß gehört den Karten, Papier dem Grund.
#F2F0EDGrund der Seite#FCFDFCKarten#D2E8E5Flächen, Marker#B7DBD7Pillen, Hover-Marker#0F7B7BMarke, Schrift, Aktion#0A5555Hover, Titel auf Karten#20221FÜberschriften#5F635CFließtext#93A09Eruhige Fläche hinter Bildernrgba(15,123,123,.16)Ränder, Trennlinien02 Typografie
Drei Schriften, klare Rollen.
Cormorant für die Ruhe und ein kursives Akzentwort pro Überschrift. Figtree trägt den Text. IBM Plex Mono ist die Stimme der kleinen Etiketten. Umbrüche sind gesetzt, keine einzelnen Wörter am Zeilenende, kein Systemblau auf iOS.
03 Material
Schatten, Radien, Korn.
Tiefe entsteht nicht durch Farbe, sondern durch Schatten in der Markenfarbe. Zwei Stufen, mehr braucht es nicht.
Werte: UI-Karten 22px, Pillen und Knöpfe 99px, Porträts und Fotos gerade bei 8px. Schatten immer blaugrün getönt, nie grau.
04 Knöpfe
Zwei Stufen, ein Ziel.
Der volle Knopf für die eine Handlung, die zählt. Der leere für alles daneben. Fahr mit der Maus drüber, dann läuft der Glanz einmal durch.
05 Die Einladung
Ein Mensch, drei Gesichter.
Der Besucher wählt nicht aus einem Menü, er wählt ein Gesicht. Fahr über eine Karte, dann hebt sie sich und das Bild zieht sacht heran. Drei gleich hohe Karten, alles auf einer Ebene.
Was brauchst du gerade?
Die Zuhörerin
Wenn du erst erzählen musst, ohne dass jemand gleich eine Lösung dazwischenwirft.
Die Familientrainerin
Wenn du einen Satz brauchst, den du heute Abend direkt ausprobieren kannst.
Die Mentorin
Wenn du klare Ansagen willst und jemanden, der dich nicht schont.
Der Satz unter den Karten: Sabine ist oft ausgebucht. Klara nie. Fünf Wörter, ohne Verknappungs-Masche.
06 Marker und Pillen
Kleine Etiketten.
Pillen tragen Themen und Antworten. Minze für Sabines Methoden, Papier mit Linie für anklickbare Vorschläge.
07 Das Gespräch
Klara spricht.
Kein schwarzes Chatfenster, kein Kreis unten rechts. Das Gespräch lebt in der Seite. Minze für Klara, Blaugrün für den Menschen.
Klara ist Sabines KI-Assistentin · kein Notfalldienst
Pflicht: Die KI-Kennzeichnung steht beim ersten Kontakt, nicht im Footer. Der Name selbst trägt sie.
08 Die Bremse
Der einzige Abschnitt ohne Gestaltung.
Wenn es akut wird, verschwindet das Design aus dem Bild. Kein Akzent, kein Glühen, kein Schatten, kein Rot, kein Blaulicht. Botschaft: hier wird gerade nichts verkauft.
Wenn es gerade zu viel ist.
Klara ist kein Notdienst und kein Ersatz für einen Menschen. Wenn du dich in einer akuten Krise fühlst oder Gedanken hast, dir etwas anzutun, wende dich bitte sofort an Menschen, die rund um die Uhr erreichbar sind.
Telefonseelsorge: 0800 111 0 111 und 0800 111 0 222. In Gefahr: 112.
Du kannst Sabine hier direkt erreichen: [Kontaktweg].
Bewusst in Systemschrift und neutralem Grau gehalten. So sieht die Bremse aus. Sie wird nie geschmückt und nie hinter eine Bezahlschranke gelegt.
09 Verbote und Ton
Was nie auftaucht.
In Bild und Sprache. Diese Dinge machen aus einer eigenen Marke eine Vorlage von der Stange.
Zum Ton: Eine gesunde Spiritualität darf mitschwingen, aber leise. Nie so, dass man als Esoterik abgestempelt wird. Kein Räucherwerk, keine Sprüche, das Maß hält Sabine.
10 Die drei Gesichter
Ein Mensch, gleiches Licht, drei Zustände.
Geliefert. Gleicher Ausschnitt, gleiches Licht, drei Anmutungen, als gerade Rechtecke, nicht rund. Der Besucher wählt das Gesicht, das er heute braucht. Das war das große fehlende Stück, jetzt steht es.
