Case · 2025 Brand Identity · Website

thegrey.berlin

Brand Identity & Website für ein Berliner Teppich-Label

Leistungen
Konzept · Design · Code
Zeitraum
Eigenes Projekt · from Scratch
Rolle
Studio of one — Greyform
Stack
HTML · CSS · Vanilla JS · Cloudflare Pages
Launch
2025

Eine Marke, die so offen startet wie das Label selbst.

thegrey.berlin ist ein eigenes Side-Label — ein Berliner Manufaktur-Konzept für vollständig individuelle, handgefertigte Teppiche aus reiner neuseeländischer Wolle. Keine Kataloge, keine Standardgrößen, keine Vorlagen. Nur: deine Idee, unser Handwerk.

Die Aufgabe: eine Marke und einen digitalen Auftritt von null aufbauen, der genau das trägt. Kein Template. Keine generische Agentur-Ästhetik. Stattdessen eine Einladung — so offen wie das Label selbst.

01 — Marke & Tonalität

Das Leitmotiv entstand früh: „Regeln aus. Teppich an.” Kurz, direkt, einprägsam. Eine Anti-Regelrhetorik, die nicht laut klingt, sondern sicher. Berliner Haltung als Designprinzip — kantig, freigeistig, nie festgelegt auf eine Richtung.

thegrey.berlin Hero-Sektion mit Headline und Berliner Straßenfoto

Das GREY-Wortmarken-Logo mit den deformierten Buchstaben ist der visuelle Kern der Marke — unverwechselbar, ohne verspielt zu wirken. Gestaltet von Aleksandar Živković, Designer aus dem Ruhrgebiet, spezialisiert auf visuelle Identitäten und Typografie, Lehrbeauftragter für Schrift an der FH Dortmund. Die Typografie in Archivo: klar, technisch, mit Charakter. Das Berliner Schwarzweißfoto im Hero setzt den geografischen und emotionalen Anker.

02 — Feature-Architektur

Vier Kernaussagen — Alle Designs, 1300+ Farben, Flexible Formen, 100% Handgefertigt — stehen als ruhige Spaltenleiste über der Ansatz-Sektion. Keine Icons, keine Infografiken. Nur Zahlen und Worte, die für sich sprechen.

Feature-Spalten und Ansatz-Sektion mit handgezeichneter Teppich-Skizze

Die handgezeichnete Teppich-Skizze rechts — Pantone-Farbpalette, organische Formen, Maßangaben — macht den Prozess sofort sichtbar: das ist Handwerk, kein Konfigurator.

03 — Projekte & Galerie

Das Galerie-Grid zeigt ausgewählte Teppiche, Wunschprojekte und Designinspirationen. Drei Kategorien: Alle, Projektinspirationen, Wanna Does. Filter dezent gesetzt — wer sie nicht braucht, scrollt einfach weiter.

Galerie-Grid mit organischen Teppich-Fotos und Kategorie-Filter

Jedes Bild kann per Lightbox vergrößert werden. Bei Entwurfsserien zeigt ein Badge die Anzahl der Varianten — „3 Entwürfe”, „2 Entwürfe” — ohne den Grid zu überladen.

04 — Prozess als dunkler Kontrast

Der Prozess-Block kehrt das Helligkeitsverhältnis der Seite um: schwarzer Hintergrund, weiße Typo, klare Struktur. Drei Schritte — 01 Idea, 02 Craft, 03 Story — ohne Overhead, ohne Formular-Wirrwarr.

Prozess-Sektion mit dunklem Hintergrund und drei Schritten

Das Prinzip: Brief & Skizze genügen als Einstieg. Der Rest entsteht im Dialog. So wie das Label selbst arbeitet — offen am Anfang, konzeptionell am Ende.

05 — Mobile, von Anfang an

Die Site ist nicht „auch für Mobile geeignet”, sondern mobile-first gebaut und dann fürs Desktop skaliert. Burger-Navigation, responsives Grid, Lightbox auch auf kleinen Screens.

thegrey.berlin Mobile-Ansicht mit Galerie und Kategorie-Filter

Die typografische Hierarchie und die Galerie-Logik bleiben auf jedem Gerät erhalten — keine vereinfachte Mobile-Variante, sondern dieselbe Sprache in komprimiertem Format.

06 — Tempo durch Reduktion

Die Site läuft auf reinem HTML/CSS/JS, ohne Build-Pipeline, ohne Framework, ohne Tracking-Bibliotheken. Hosting auf Cloudflare Pages, globales CDN, automatisches Deployment aus GitHub. Bilingualer Auftritt (DE/EN) mit hreflang-Struktur und canonical Tags auf allen Hauptseiten.

Das spiegelt das Studio-Prinzip: moderne Werkzeuge im Hintergrund, ruhiges Ergebnis im Vordergrund.


Outcome

Vollständige Brand Identity und Website von null — Konzept, Design und Code in einem. Bilingualer Auftritt mit Galerie-Grid, Lightbox, Kategorie-Filter und drei-stufigem Prozess-Flow. Hosting auf Cloudflare Pages, Lighthouse-Score über 90 in allen Kategorien.