Portfolio Case Study · AI Campaign · David Sutherland

WTRMLN

Eine fiktive Premium-Beverage-Marke wird zur interaktiven Markenwelt: Logo, Produkt, Shop-Mockup, Social Campaign, Motion-Ideen, Polaroid-Galerie und Prozessdokumentation in einem schnellen, SEO- und GEO-ready Multi-Page-Projekt.

11Pages + Legal
4Motion Videos
1Consistency Lock

Tilt-Interaction · Lightbox · Black Label Lock · Ruby Sparkling Juice

ICE COLD. SUN READY.BOLD. JUICY. UNSTOPPABLE.TASTE SUMMER. STAY REAL.NATURAL. JUICY. ICONIC.REAL FRUIT. REAL REFRESHMENT.JUICY AFTER DARK.ICE COLD. SUN READY.BOLD. JUICY. UNSTOPPABLE.TASTE SUMMER. STAY REAL.NATURAL. JUICY. ICONIC.REAL FRUIT. REAL REFRESHMENT.JUICY AFTER DARK.
Case Architecture

Aus einem Motiv wird ein System.

Der Case zeigt nicht nur schöne KI-Bilder. Er zeigt, wie aus dem Motiv Wassermelone eine komplette Marken- und Kampagnenlogik entsteht: Name, Logo, Flasche, schwarzes Label, Social Visuals, Motion Prep, Fehleranalyse und Website-Experience.

01

Logo Identity

Die Wortmarke WTRMLN nutzt Fruchtfleisch, Schale, Seeds und einen ikonischen Melonenpunkt als visuelle Sprache.

02

Product Lock

Klare Glasflasche, roter Sparkling Juice, silberner Verschluss, Kondenswasser und schwarzes Label sind die feste Produktgrammatik.

03

Motion Layer

Die Kampagne wurde so entwickelt, dass Splash, Pour, Eis, Kondenswasser und Label später in Kling oder anderen Video-Tools animierbar sind.

04

Learning Proof

Fehler, Varianten, Kontextverlust und Korrekturen werden nicht versteckt, sondern als professioneller KI-Workflow dokumentiert.

Projektkern aus der Dokumentation

Aus einer Wassermelonen-Idee wurde eine markenfähige Kampagne.

Der Ausgangspunkt war bewusst einfach: Wassermelone als starkes, sofort verständliches Motiv. Die eigentliche Aufgabe war aber nicht, Obst schön zu zeigen, sondern aus diesem Motiv eine vollständige visuelle Markenwelt zu entwickeln.

Der Case dokumentiert, wie aus einer ersten Logo-Idee ein System entstand: WTRMLN als Name, eine organische Wortmarke, ein klarer Claim, ein wiedererkennbares Produkt, eine Social-Media-Kampagne, Motion-Vorbereitung und eine Website als digitale Case-Study. Entscheidend war die Verdichtung: Nicht jede schöne Variante wurde übernommen, sondern nur das, was zur finalen Produktlogik passte.

Damit erfüllt die Website zwei Funktionen gleichzeitig: Sie wirkt wie eine Salespage für ein fiktives Premium-Getränk und bleibt zugleich eine prüfungsrelevante Dokumentation über Toolwahl, Iteration, Fehler, Kuration und Learnings.

Der zentrale Konflikt

Die größte Herausforderung war nicht die Bildqualität, sondern die Konsistenz. Mehrfach wurden falsche Flaschen, weiße Labels oder generische Saftvarianten erzeugt. Dadurch wurde sichtbar, dass KI-Gestaltung ohne klare Regeln schnell driftet.

Finale Regel: klare Glasflasche, roter Sparkling Watermelon Juice, silberner Metallverschluss, schwarzes breites Label, WTRMLN-Logo, Claim „Natural. Juicy. Iconic.“ und sichtbares Kondenswasser.

Consistency Lock lesen
Scroll Theatre · Split Gallery

Campaign Polaroids.

Diese Sektion ist bewusst lang gebaut: Beim Scrollen löst sich der Bildstapel sichtbar auf. Aus einem kompakten Markenmoment entstehen fünf Kampagnenwelten — Studio, Pour, After Dark, Pool und Nature. Die Karten bleiben vollständig sichtbar, springen nicht und öffnen per Klick die Lightbox.

Scroll slowly · stack splits apart · click image · follow internal links

From Nature To Now — WTRMLN-Flasche in natürlicher Outdoor-Szene mit Wassermelonen, Holz, Minze und Claim. From Nature

Natur, Holz, Frucht und Flasche als Brücke zwischen Ursprung und modernem Produkt.

Lifestyle öffnen
Pour Shot — WTRMLN wird in ein Glas mit Eis und Minze gegossen; roter Sparkling Juice in Bewegung. Pour Shot

Der Moment, in dem das Produkt trinkbar wird: Glas, Eis, Fizz und roter Juice.

Motion öffnen
After Dark — WTRMLN-Flasche und Drinkglas auf Rooftop mit Stadt-Bokeh und Abendlicht. After Dark

Premium-Abendmoment: Rooftop, Glas, Bokeh, dunkler Tisch und klare Produktpräsenz.

After Dark öffnen
Poolside — WTRMLN-Flasche am Pool mit Sommerlicht, Wassermelone und Claim Ice Cold Sun Ready. Poolside

Sommerliche Nutzungssituation: Social Context, Pool, Sonne, Eis und Produkt im Vordergrund.

Pool Visuals öffnen
Splash Motion — Wassermelonenscheibe mit Wasser, Eiswürfeln und eingefrorener High-Speed-Dynamik. Splash Motion

Motion-Food-Energie: Wassermelone, Wasser, Eis, Tropfen und der Claim als Kampagnencode.

Splash öffnen
WTRMLN Sparkling Watermelon Juice Clean Product Cut auf weißem Hintergrund
Shop Mockup

Sparkling Watermelon Juice.

Der Shop ist ein fiktiver Produktmoment für die Case Study. Er verbindet Produktbild, Markenclaim, Sales Text, Cart Demo und klare Information ohne echten Checkout.

€3,90

Mockup-Preis · 330 ml · Premium Visualisierung

  • Premium-Look für Landingpage, Portfolio und Pitch.
  • Add-to-Cart-Demo mit lokalem Cart Counter.
  • Direkte Verbindung von Produktbild, Claim und CTA.
Shop öffnen
Motion Preview

Bilder, die schon Bewegung denken.

Die Videos stehen dort, wo sie logisch hingehören: Reveal für Produktidentität, Splash für Kampagnendynamik, Pour für Sensorik und Label Motion für Consistency.

Motion MP4
Product RevealDie finale Flasche wird wie ein echtes Premium-Produkt inszeniert: roter Juice, schwarze Label-Fläche, klare Glasreflexionen.
Motion MP4
Ultra SplashWassermelone, Wasser, Eis und Speed erzeugen die Energie der Kampagne. Der Clip übersetzt die Splash Shots in Bewegung.
Motion MP4
Pour RitualAus statischer Produktvisualisierung wird ein trinkbarer Moment: roter Sparkling Juice, Glas, Eis und fließende Bewegung.
Motion MP4
Label Lock MotionClean Motion ohne störende Text-Layovers. Der Fokus liegt auf dem Produktcode: schwarzes Label, roter Inhalt, klare Flasche.
Final Case

Portfolio, Salespage und Dokumentation in einem.

Diese Version ist heller, strukturierter und robuster: Multi-Page, interne Links, Alt-Texte, Lightbox, Hover Glow, Microzoom, Motion Cards, rechtliche Demo-Seiten, Sitemap, robots.txt, llms.txt und JSON-LD.

Prüfungsrelevante Dokumentation

Mehr als eine schöne Oberfläche.

Diese Website ist bewusst als Abgabe- und Portfolioformat aufgebaut: Sie zeigt Ergebnis, Prozess, Toolchain, Fehler, Learnings und mögliche Motion-Schritte in einer navigierbaren Struktur.

H1/H2/H3-Struktur

Jede Unterseite ist semantisch gegliedert, damit der Case nicht nur visuell stark ist, sondern auch als dokumentiertes Medienprojekt gelesen werden kann.

Prozess öffnen

Interne Verlinkung

Visuals, Shop, Logo, Motion und Learnings sind miteinander verbunden. Dadurch entsteht kein loser One-Pager, sondern eine kleine Case-Study-Site.

Sitemap öffnen

SEO & GEO Ready

Meta-Daten, strukturierte Seiten, Alt-Texte, Sitemap, robots.txt und llms.txt bereiten die Website für klassische Suche und KI-lesbare Zusammenfassungen vor.

Mehrwert lesen

Motion als nächster Schritt

Die Video- und Motion-Bereiche zeigen, wie die statische Bildkampagne in animierte Social Assets und Produkt-Clips übersetzt werden kann.

Motion Lab

PDF-Dokumentation

Für Prüfung, Portfolio und vertiefte Nachlese ist die ausführliche WTRMLN-Projektdokumentation als PDF eingebunden. Sie enthält Ziel, Zielgruppe, Toolchain, Prompt-Auszüge, Animation-Prompts, Fehleranalyse, Learnings und den finalen Consistency Lock.

Dokumentation herunterladen