Jekyll2026-04-28T14:22:47+00:00https://www.cmd-design.com/feed.xmlCMD-designThe most recent portfolio for a new year!CSS-Driven Solar System2025-11-12T15:00:06+00:002025-11-12T15:00:06+00:00https://www.cmd-design.com/posts/solar-systemA Little Universe Built with Pure Code

This project started as “let me animate a planet real quick” and quietly escalated into a full solar system with moons, shadows, and a procedurally generated asteroid belt. All of it built with HTML + SCSS, zero JavaScript, and a dangerous amount of enthusiasm.

This is exactly the kind of thing I love doing in my spare time: using code to build tiny worlds, experimenting with motion, and seeing how far you can push CSS before it starts sweating.

See the Pen Solar System - Revised with Moons and Asteroids by Chad Danford (@cmd1209) on CodePen. Fort the project if you like and send me a link of what you were able to come up with.

The simulation includes:
  • Planets orbiting in their correct relative positions
  • Moons (like the Moon and the four Galilean moons) following their planets
  • Dynamic shadows based on which side faces the sun
  • A fully generated asteroid belt that looks surprisingly “natural”
  • All orbits, sizes, and speeds adjustable through variables
Everything is parametric: change one value (like Earth’s orbital duration) and the whole system shifts in harmony. That’s the magic of SCSS loops, math, and a lot of trial and error.
The Hardest / Most Fun Part: The Asteroid Belt
CSS doesn’t give you real randomness, so creating 100+ asteroids that feel chaotic — different distances, different speeds, different starting positions — meant getting creative with SCSS’s pseudo-random numbers. The “aha!” moment was realizing that you can fake natural distribution by randomizing:
  • orbital radius
  • animation speed
  • starting offset
The result? A belt that feels alive instead of looking like a dotted line someone forgot to align. 
  /* Primary Palette */
//asteroids variables
$asteroid-number: 100
$asteroid-start: $au * 1.8
$asteroid-end: $au * 2.9

  @for $i from 1 through $asteroid-number 
  $randN: (random(10000) - 1) / 1000
  $asteroid-spread: random($asteroid-end - $asteroid-start) + $asteroid-start
  .orbit--asteroids:nth-of-type(#{$i})
    position: absolute
    top: 50%
    left: 50%
    border-radius: 50%
    transform-origin: center center
    width: #{$asteroid-spread * 2}
    height: #{$asteroid-spread * 2}
    margin-left: -#{$asteroid-spread}
    margin-top: -#{$asteroid-spread}
    animation: orbit (#{$ceres-year * (0.9 + random(20)/100)}) linear infinite
    animation-delay: -#{$randN * $earth-year}

.asteroid
  width: 2px
  height: 2px
  background-color: grey

]]>Chad Matthew DanfordCSS-Driven Solar System2025-11-12T15:00:06+00:002025-11-12T15:00:06+00:00https://www.cmd-design.com/de/posts/solar-systemEin kleines Universum, gebaut nur mit Code

Dieses Projekt begann mit dem Gedanken: „Ich animiere kurz mal einen Planeten“ und entwickelte sich still und leise zu einem kompletten Sonnensystem mit Monden, Schatten und einem prozedural erzeugten Asteroidengürtel. Gebaut nur mit HTML und SCSS, ganz ohne JavaScript, aber mit einer ziemlich großen Portion Enthusiasmus.

Genau solche Dinge mache ich gern in meiner Freizeit: mit Code kleine Welten bauen, mit Bewegung experimentieren und ausprobieren, wie weit man CSS treiben kann, bevor es ins Schwitzen kommt.

See the Pen Solar System - Revised with Moons and Asteroids by Chad Danford (@cmd1209) on CodePen. Fork das Projekt gern und schick mir einen Link, wenn du etwas Eigenes daraus gemacht hast.

Die Simulation enthält:
  • Planeten, die in ihren jeweiligen relativen Positionen kreisen
  • Monde wie unser Mond oder die vier galileischen Monde, die ihren Planeten folgen
  • Dynamische Schatten, je nachdem welche Seite zur Sonne zeigt
  • Einen vollständig generierten Asteroidengürtel, der überraschend natürlich wirkt
  • Orbits, Größen und Geschwindigkeiten, die komplett über Variablen steuerbar sind
Alles ist parametrisch aufgebaut: Ändert man einen einzigen Wert, etwa die Umlaufdauer der Erde, verschiebt sich das gesamte System stimmig mit. Genau darin liegt der Reiz von SCSS-Loops, etwas Mathematik und ziemlich viel Ausprobieren.
Der schwierigste und zugleich schönste Teil: der Asteroidengürtel
CSS kennt keine echte Zufälligkeit. Um mehr als 100 Asteroiden glaubwürdig chaotisch wirken zu lassen, also mit unterschiedlichen Abständen, Geschwindigkeiten und Startpositionen, musste ich die pseudozufälligen Möglichkeiten von SCSS ziemlich kreativ nutzen. Der entscheidende Moment war die Erkenntnis, dass sich eine natürliche Verteilung überzeugend vortäuschen lässt, wenn man diese Werte variiert:
  • Orbitalradius
  • Animationsgeschwindigkeit
  • Startversatz
Das Ergebnis: ein Gürtel, der lebendig wirkt, statt wie eine gepunktete Linie, die einfach nicht sauber ausgerichtet wurde. 
  /* Primary Palette */
//asteroids variables
$asteroid-number: 100
$asteroid-start: $au * 1.8
$asteroid-end: $au * 2.9

  @for $i from 1 through $asteroid-number 
  $randN: (random(10000) - 1) / 1000
  $asteroid-spread: random($asteroid-end - $asteroid-start) + $asteroid-start
  .orbit--asteroids:nth-of-type(#{$i})
    position: absolute
    top: 50%
    left: 50%
    border-radius: 50%
    transform-origin: center center
    width: #{$asteroid-spread * 2}
    height: #{$asteroid-spread * 2}
    margin-left: -#{$asteroid-spread}
    margin-top: -#{$asteroid-spread}
    animation: orbit (#{$ceres-year * (0.9 + random(20)/100)}) linear infinite
    animation-delay: -#{$randN * $earth-year}

.asteroid
  width: 2px
  height: 2px
  background-color: grey

]]>Chad Matthew Danford2 Days in Miami2025-07-13T15:00:06+00:002025-07-13T15:00:06+00:00https://www.cmd-design.com/posts/miamiFor some reason I imagined setting down in Miami, after our flight from Frankfurt, and being immediatly blown away by the blue skies and water. But no, we arrived in the middle of some crazy summer storm, and the arrivals and uber pick up was being flooded at the time.

Grid Image Grid Image Grid Image Grid Image Grid Image

The following day, the weather had cleared and Miami was just as I had imagined—blue skies and bright sunlight. With only one full day to explore, we wandered through the vibrant streets of Little Havana, where the air was filled with the sounds of salsa music and the aroma of Cuban coffee. Colorful murals and lively domino games in Máximo Gómez Park made the neighborhood feel welcoming and full of energy. Even with limited time, we managed to sample some authentic Cuban food and soak in the unique atmosphere that makes Miami so memorable. I also took some shots of the historic Tower Theater, a striking landmark that stands as a testament to the neighborhood’s rich cultural heritage.

]]>Chad Matthew Danford2 Days in Miami2025-07-13T15:00:06+00:002025-07-13T15:00:06+00:00https://www.cmd-design.com/de/posts/miamiAus irgendeinem Grund hatte ich mir vorgestellt, nach dem Flug aus Frankfurt in Miami anzukommen und sofort von blauem Himmel und Wasser empfangen zu werden. Stattdessen landeten wir mitten in einem wilden Sommersturm, und sowohl der Ankunftsbereich als auch der Uber-Pick-up standen teilweise unter Wasser.

Grid Image Grid Image Grid Image Grid Image Grid Image

Am nächsten Tag hatte sich das Wetter beruhigt und Miami zeigte sich genauso, wie ich es mir vorgestellt hatte: blauer Himmel und grelles Sonnenlicht. Mit nur einem vollen Tag zum Erkunden liefen wir durch die lebendigen Straßen von Little Havana, wo Salsa aus offenen Türen klang und der Duft von kubanischem Kaffee in der Luft lag. Bunte Murals und die Domino-Runden im Máximo Gómez Park gaben dem Viertel eine offene, energiegeladene Stimmung. Trotz der kurzen Zeit schafften wir kubanisches Essen, viel Atmosphäre und ein paar Aufnahmen des historischen Tower Theater mitzunehmen, das bis heute ein starkes Zeichen für die kulturelle Geschichte des Viertels ist.

]]>Chad Matthew DanfordOKLCH Color Scheme2025-04-16T15:00:06+00:002025-04-16T15:00:06+00:00https://www.cmd-design.com/posts/CMD-colorsWhen I set out to define the color system for this project, I wanted something that would be both flexible and future-proof. Traditional hex or RGB values work fine for static palettes, but they become limiting when you need to adjust lightness, contrast, or accessibility on the fly. That’s why I chose to build the palette using the OKLCH color model. Unlike HSL or HEX, OKLCH is perceptually uniform — meaning that changes in lightness or chroma behave more consistently with how our eyes actually see color. This makes it much easier to fine-tune shades, generate accessible contrasts, and maintain harmony across the palette.

/* Primary Palette */
--primary-color: oklch(40% 0.15 272);
--color-primary-0: oklch(from var(--primary-color) 90% c h);
--color-primary-10: oklch(from var(--primary-color) 80% c h);
--color-primary-20: oklch(from var(--primary-color) 70% c h);
--color-primary-30: oklch(from var(--primary-color) 60% c h);
--color-primary-40: oklch(from var(--primary-color) 50% c h);
--color-primary-50: var(--primary-color);
--color-primary-60: oklch(from var(--primary-color) 30% c h);
--color-primary-70: oklch(from var(--primary-color) 20% c h);
--color-primary-80: oklch(from var(--primary-color) 10% c h);
--color-primary-90: oklch(from var(--primary-color) 5% c h);
--color-primary-100: oklch(from var(--primary-color) 0% c h);

The foundation of the palette is the primary color range, which I created by varying the lightness value from 0 to 100 while keeping chroma and hue constant. This gave me a smooth spectrum of tints and shades derived from one anchor hue. From there, I added a secondary color, an alert color for states and notifications, and a more playful accent color (teal). Each range follows the same principle — start with a base and build out a scale by adjusting lightness in OKLCH.

To make the palette practical for development, I translated every step into CSS custom properties. Each color in the scale gets a variable name (e.g. –color-primary-30, –color-accent-70) that corresponds to its lightness step. On top of that, I created utility classes (e.g. .bg-primary-30, .text-accent-70) to apply the colors directly in markup. This approach keeps design tokens consistent, makes it easy to swap or extend colors later, and reduces guesswork when working with the palette in real-world layouts.

/* Secondary Palette */
--secondary-color: oklch(30% 0.13 10.92);
--color-secondary-0: oklch(from var(--secondary-color) 95% c h);
--color-secondary-10: oklch(from var(--secondary-color) 85% c h);
--color-secondary-20: oklch(from var(--secondary-color) 73% c h);
--color-secondary-30: oklch(from var(--secondary-color) 55% c h);
--color-secondary-40: oklch(from var(--secondary-color) 40% c h);
--color-secondary-50: var(--secondary-color);
--color-secondary-60: oklch(from var(--secondary-color) 25% c h);
--color-secondary-70: oklch(from var(--secondary-color) 20% c h);
--color-secondary-80: oklch(from var(--secondary-color) 17% c h);
--color-secondary-90: oklch(from var(--secondary-color) 12% c h);
--color-secondary-100: oklch(from var(--secondary-color) 8% c h);
/* Teal Palette */
--teal-color: oklch(65% 0.1099 198);
--color-teal-0: oklch(from var(--teal-color) 99% c h);
--color-teal-10: oklch(from var(--teal-color) 90% c h);
--color-teal-20: oklch(from var(--teal-color) 85% c h);
--color-teal-30: oklch(from var(--teal-color) 75% c h);
--color-teal-40: oklch(from var(--teal-color) 70% c h);
--color-teal-50: var(--teal-color);
--color-teal-60: oklch(from var(--teal-color) 58% c h);
--color-teal-70: oklch(from var(--teal-color) 45% c h);
--color-teal-80: oklch(from var(--teal-color) 32% c h);
--color-teal-90: oklch(from var(--teal-color) 24% c h);
--color-teal-100: oklch(from var(--teal-color) 18% c h);
/* alert Palette */
--alert-color: oklch(80% 0.1659 119.42);
--color-alert-0: oklch(from var(--alert-color) 99% c h);
--color-alert-10: oklch(from var(--alert-color) 93% c h);
--color-alert-20: oklch(from var(--alert-color) 91% c h);
--color-alert-30: oklch(from var(--alert-color) 87% c h);
--color-alert-40: oklch(from var(--alert-color) 83% c h);
--color-alert-50: var(--alert-color);
--color-alert-60: oklch(from var(--alert-color) 76% c h);
--color-alert-70: oklch(from var(--alert-color) 60% c h);
--color-alert-80: oklch(from var(--alert-color) 50% c h);
--color-alert-90: oklch(from var(--alert-color) 40% c h);
--color-alert-100: oklch(from var(--alert-color) 20% c h);
]]>Chad Matthew DanfordOKLCH Color Scheme2025-04-16T15:00:06+00:002025-04-16T15:00:06+00:00https://www.cmd-design.com/de/posts/CMD-colorsAls ich das Farbsystem für dieses Projekt definiert habe, wollte ich etwas entwickeln, das flexibel und zugleich zukunftssicher ist. Klassische Hex- oder RGB-Werte funktionieren für statische Paletten gut, stoßen aber schnell an Grenzen, wenn Helligkeit, Kontrast oder Barrierefreiheit fein abgestimmt werden sollen. Deshalb habe ich die Palette auf Basis des OKLCH-Farbmodells aufgebaut. Im Unterschied zu HSL oder HEX ist OKLCH wahrnehmungsorientiert, Veränderungen bei Helligkeit und Chroma verhalten sich also deutlich näher an dem, wie wir Farbe tatsächlich sehen. Dadurch lassen sich Abstufungen, Kontraste und Harmonien wesentlich präziser steuern.

/* Primary Palette */
--primary-color: oklch(40% 0.15 272);
--color-primary-0: oklch(from var(--primary-color) 90% c h);
--color-primary-10: oklch(from var(--primary-color) 80% c h);
--color-primary-20: oklch(from var(--primary-color) 70% c h);
--color-primary-30: oklch(from var(--primary-color) 60% c h);
--color-primary-40: oklch(from var(--primary-color) 50% c h);
--color-primary-50: var(--primary-color);
--color-primary-60: oklch(from var(--primary-color) 30% c h);
--color-primary-70: oklch(from var(--primary-color) 20% c h);
--color-primary-80: oklch(from var(--primary-color) 10% c h);
--color-primary-90: oklch(from var(--primary-color) 5% c h);
--color-primary-100: oklch(from var(--primary-color) 0% c h);

Die Grundlage der Palette bildet eine Primärfarbskala, bei der ich den Helligkeitswert von 0 bis 100 variiert habe, während Chroma und Hue konstant bleiben. So entstand aus einem Ausgangston ein gleichmäßiges Spektrum aus Tints und Shades. Darauf aufbauend kamen eine Sekundärfarbe, eine Alert-Farbe für Zustände und Hinweise sowie ein spielerischerer Akzentton in Teal hinzu. Alle Skalen folgen demselben Prinzip: von einer Basisfarbe ausgehend Abstufungen über die Helligkeit in OKLCH aufbauen.

Damit die Palette auch in der Entwicklung praktisch nutzbar ist, habe ich jede Stufe in CSS Custom Properties übersetzt. Jede Farbe erhält einen Variablennamen wie --color-primary-30 oder --color-accent-70, der direkt ihrer Helligkeitsstufe entspricht. Ergänzend dazu habe ich Utility-Klassen wie .bg-primary-30 oder .text-accent-70 angelegt, damit sich die Farben direkt im Markup verwenden lassen. So bleiben die Design-Tokens konsistent, Farben lassen sich später leichter austauschen oder erweitern und die Arbeit mit der Palette in realen Layouts wird deutlich klarer.

/* Secondary Palette */
--secondary-color: oklch(30% 0.13 10.92);
--color-secondary-0: oklch(from var(--secondary-color) 95% c h);
--color-secondary-10: oklch(from var(--secondary-color) 85% c h);
--color-secondary-20: oklch(from var(--secondary-color) 73% c h);
--color-secondary-30: oklch(from var(--secondary-color) 55% c h);
--color-secondary-40: oklch(from var(--secondary-color) 40% c h);
--color-secondary-50: var(--secondary-color);
--color-secondary-60: oklch(from var(--secondary-color) 25% c h);
--color-secondary-70: oklch(from var(--secondary-color) 20% c h);
--color-secondary-80: oklch(from var(--secondary-color) 17% c h);
--color-secondary-90: oklch(from var(--secondary-color) 12% c h);
--color-secondary-100: oklch(from var(--secondary-color) 8% c h);
/* Teal Palette */
--teal-color: oklch(65% 0.1099 198);
--color-teal-0: oklch(from var(--teal-color) 99% c h);
--color-teal-10: oklch(from var(--teal-color) 90% c h);
--color-teal-20: oklch(from var(--teal-color) 85% c h);
--color-teal-30: oklch(from var(--teal-color) 75% c h);
--color-teal-40: oklch(from var(--teal-color) 70% c h);
--color-teal-50: var(--teal-color);
--color-teal-60: oklch(from var(--teal-color) 58% c h);
--color-teal-70: oklch(from var(--teal-color) 45% c h);
--color-teal-80: oklch(from var(--teal-color) 32% c h);
--color-teal-90: oklch(from var(--teal-color) 24% c h);
--color-teal-100: oklch(from var(--teal-color) 18% c h);
/* alert Palette */
--alert-color: oklch(80% 0.1659 119.42);
--color-alert-0: oklch(from var(--alert-color) 99% c h);
--color-alert-10: oklch(from var(--alert-color) 93% c h);
--color-alert-20: oklch(from var(--alert-color) 91% c h);
--color-alert-30: oklch(from var(--alert-color) 87% c h);
--color-alert-40: oklch(from var(--alert-color) 83% c h);
--color-alert-50: var(--alert-color);
--color-alert-60: oklch(from var(--alert-color) 76% c h);
--color-alert-70: oklch(from var(--alert-color) 60% c h);
--color-alert-80: oklch(from var(--alert-color) 50% c h);
--color-alert-90: oklch(from var(--alert-color) 40% c h);
--color-alert-100: oklch(from var(--alert-color) 20% c h);
]]>Chad Matthew DanfordCalumet HQ2024-10-01T15:00:06+00:002024-10-01T15:00:06+00:00https://www.cmd-design.com/posts/calumet_hqAlmost a year before Calumet’s Hamburg headquarters move-in date (Fall 2024), I was asked to collaborate directly with management on shaping the new space. My role was to design the look and feel of the HQ — making sure the physical environment reflected the company’s identity and supported how teams actually work day to day.

  • Gallery Image
  • Gallery Image
  • Gallery Image

I also introduced large-format inspirational photography to cover non-glass walls, giving the office a strong visual character and connecting the environment to the creative spirit of the company. Beyond graphics, I supported management in choosing furniture and decorations, ensuring consistency with the design direction. To cap it off, I organized a company-wide photography call: employees contributed images that were framed and displayed in the “Meet and Mingle” room — a space dedicated to community and collaboration.

The project began with concept development: I created proposals that balanced functionality with brand expression. These early ideas set the tone for everything that followed, from material choices and colors to how common areas and workspaces could express Calumet’s values.

One of the most important results was a room-naming concept. Using results from a company-wide survey, I created names for every meeting space and designed a visual system that combined the Calumet logo with each name. Since most rooms had glass walls, these designs were produced as large vinyl stickers — a simple but effective way to bring identity and clarity into the space.

The result was a headquarters that doesn’t just function as an office, but embodies Calumet’s culture: professional, creative, and inclusive, with employees directly contributing to the look and feel of the space.

]]>Chad Matthew DanfordCalumet HQ2024-10-01T15:00:06+00:002024-10-01T15:00:06+00:00https://www.cmd-design.com/de/posts/calumet_hqFast ein Jahr vor dem Einzug in Calumets neues Hamburger Headquarter im Herbst 2024 wurde ich gebeten, direkt mit dem Management an der Gestaltung der neuen Räume zu arbeiten. Meine Aufgabe war es, Look and Feel des HQ zu entwickeln und dafür zu sorgen, dass die physische Umgebung die Identität des Unternehmens widerspiegelt und den Arbeitsalltag der Teams sinnvoll unterstützt.

  • Gallery Image
  • Gallery Image
  • Gallery Image

Zusätzlich brachte ich großformatige inspirierende Fotografie an geschlossene Wände, um dem Büro eine starke visuelle Identität zu geben und die Räume mit dem kreativen Geist des Unternehmens zu verbinden. Über die Grafik hinaus unterstützte ich das Management bei der Auswahl von Möbeln und Dekoration, damit alles gestalterisch zusammenpasst. Zum Abschluss organisierte ich einen internen Fotografie-Call: Mitarbeiter reichten Bilder ein, die gerahmt im „Meet and Mingle“-Raum ausgestellt wurden, einem Ort für Begegnung und Zusammenarbeit.

Das Projekt begann mit der Konzeptentwicklung. Ich erarbeitete Vorschläge, die Funktionalität und Markenausdruck miteinander ausbalancierten. Diese frühen Ideen gaben den Ton für alles Weitere vor, von Materialentscheidungen und Farben bis zur Frage, wie Gemeinschaftsbereiche und Arbeitsplätze Calumets Werte sichtbar machen können.

Eines der wichtigsten Ergebnisse war ein Raumbenennungs-Konzept. Auf Basis einer unternehmensweiten Umfrage entwickelte ich Namen für alle Besprechungsräume und ein visuelles System, das den Calumet-Schriftzug mit den jeweiligen Namen verband. Da viele Räume Glaswände haben, wurden diese Entwürfe als große Vinyl-Folien umgesetzt, eine einfache, aber wirkungsvolle Lösung, um Identität und Orientierung in die Räume zu bringen.

Das Ergebnis war ein Headquarter, das nicht nur als Büro funktioniert, sondern Calumets Kultur verkörpert: professionell, kreativ und offen, mit einem Look and Feel, zu dem die Mitarbeiter selbst beigetragen haben.

]]>Chad Matthew DanfordCalumet Email Newsletter2024-03-15T15:00:06+00:002024-03-15T15:00:06+00:00https://www.cmd-design.com/posts/calumet_nlThe story of the newsletter started back when I was still a senior developer/designer on the web team. I’d periodically give the content team design advice — little things that could make layouts cleaner, create easy wins, and elevate the overall look. These small interventions built trust and opened the door to a closer collaboration with the head of content.

When I became Head of Art Direction, I felt a responsibility to keep pushing my design philosophy into every channel. The newsletter was one of the first areas I championed. I made a point of mentioning it regularly to stakeholders, showing small improvements whenever I could, and keeping the idea alive until the right moment to focus on it came.

  • Gallery Image
  • Gallery Image
  • Gallery Image
  • Gallery Image

That persistence paid off. Soon, I was sitting in on direct talks with the content lead and the developers at Emarsys, who were building the newsletter modules. With design, content, and development working in sync, we moved from ad hoc tweaks to building reusable modules that looked good, worked reliably, and represented the brand consistently.

The result was a newsletter system that felt cohesive and professional — less like a series of one-off sends, more like a branded experience. Production became smoother for the content team, developers had clearer design direction, and stakeholders saw a tangible step forward in how design could add value.

]]>Chad Matthew DanfordCalumet Email Newsletter2024-03-15T15:00:06+00:002024-03-15T15:00:06+00:00https://www.cmd-design.com/de/posts/calumet_nlDie Geschichte des Newsletters begann, als ich noch als Senior Developer/Designer im Webteam arbeitete. Ich gab dem Content-Team immer wieder kleine Designhinweise, Anpassungen, die Layouts klarer machten, schnelle Verbesserungen brachten und den gesamten Auftritt aufwerteten. Diese kleinen Eingriffe schufen Vertrauen und führten zu einer engeren Zusammenarbeit mit der Content-Leitung.

Als ich Head of Art Direction wurde, war für mich klar, dass sich mein Designverständnis in allen Kanälen wiederfinden sollte. Der Newsletter war einer der ersten Bereiche, die ich gezielt vorantrieb. Ich brachte das Thema immer wieder bei Stakeholdern ein, zeigte kleine Verbesserungen, sobald sich die Gelegenheit bot, und hielt die Idee so lange präsent, bis der richtige Moment für einen echten Fokus gekommen war.

  • Gallery Image
  • Gallery Image
  • Gallery Image
  • Gallery Image

Diese Beharrlichkeit zahlte sich aus. Bald saß ich direkt mit der Content-Leitung und den Entwicklern bei Emarsys am Tisch, die die Newsletter-Module umsetzten. Weil Design, Content und Entwicklung abgestimmt zusammenarbeiteten, wurden aus einzelnen Ad-hoc-Verbesserungen wiederverwendbare Module, die gut aussahen, zuverlässig funktionierten und die Marke konsistent transportierten.

Das Ergebnis war ein Newsletter-System, das sich geschlossen und professionell anfühlte, weniger wie einzelne Aussendungen, mehr wie ein durchgängiges Markenerlebnis. Die Produktion wurde für das Content-Team deutlich einfacher, die Entwickler hatten klarere gestalterische Leitplanken und Stakeholder sahen konkret, welchen Mehrwert Design liefern kann.

]]>Chad Matthew Danford