/
unsladen-wo-kreativitaet-und-code-sich-die-hand-geben

Unsladen – wo Kreativität und Code sich die Hand geben
28. Okt. 2025
5min Reading time
Daniel
Der Unsladen zeigt, dass moderne Webentwicklung Emotion transportieren kann. Next.js sorgt für Performance und Struktur, Sanity für Freiheit und Wandelbarkeit. So entsteht ein digitales Zuhause, das mitwächst, lebt und bleibt. Technologie wird menschlich, wenn sie Charakter zulässt – und genau das ist ihre Stärke.












Table of Contents
Mein erstes Projekt – mitten rein in Augsburgs kreative Seele
Wie man den Charakter eines Ortes ins Web überträgt
Technisches Fundament – Next.js als Herzstück
Sanity CMS – flexible Inhaltsverwaltung ohne Umwege
Warum ein Custom CMS mehr Freiraum schafft
Design, das Geschichten erzählt
Mein Beitrag – Feinarbeit trifft Neugier
Wenn Design und Technik sich ergänzen
Fazit – Handgemacht, digital, echt
Verwendete Technologien
Mein erstes Projekt – mitten rein in Augsburgs kreative Seele
Als ich im Juni mein Praktikum bei Yuupless begann, stand gleich ein Herzensprojekt auf meiner To-do-Liste: der Unsladen – ein kleiner, handgemachter Kreativ-Ort im Herzen der Augsburger Altstadt. Ein Raum, in dem sich Künstler:innen, Freund:innen und kreative Köpfe treffen, austauschen oder einfach gemeinsam Zeit verbringen können.
Und gleichzeitig eine Plattform, auf der Kunst, Kaffee, Kreativität und neue Ideen digital zusammenfinden. Offen für alle, herzlich willkommen – genau dieses Gefühl sollte sich auch online widerspiegeln.
Wie man den Charakter eines Ortes ins Web überträgt
Die Aufgabe war, den besonderen Charme des physischen Unsladens – handgemacht, offen, entspannt – in die digitale Welt zu übersetzen. Eine Website, die sich warm und menschlich anfühlt, obwohl sie auf modernster Webtechnologie basiert.
Ich wollte, dass man beim Aufrufen der Seite spürt, woher sie kommt: aus der Altstadt, aus einer Community, aus echten Begegnungen. Der Look: ein bisschen retro, ein bisschen verspielt, aber klar strukturiert. Ein Design, das „Komm rein“ sagt, noch bevor man etwas klickt.

Technisches Fundament – Next.js als Herzstück
Unter der Oberfläche läuft der Unsladen mit Next.js, einem modernen Framework für Webentwicklung, das sich durch Performance, Stabilität und Struktur auszeichnet. Next.js sorgt dafür, dass Inhalte schnell geladen, Routen intelligent verwaltet und Komponenten wiederverwendbar bleiben – ideal für Projekte, die langfristig wachsen sollen.
Die Architektur ermöglicht serverseitiges Rendering, was sowohl die Geschwindigkeit als auch die SEO-Performance verbessert. Kurz gesagt: Die Seite bleibt leicht, schnell und aufgeräumt – ganz im Stil des Unsladens selbst.
Sanity CMS – flexible Inhaltsverwaltung ohne Umwege
Das zweite Herzstück des Projekts ist das Sanity CMS – ein Headless Content Management System, das Inhalte unabhängig vom Design verwaltet. Für den Unsladen bedeutet das: Künstler:innen können ihre Produkte, Profile und Veranstaltungen direkt über das Sanity Studio einpflegen. Die Inhalte werden dort als strukturierte Datensätze gespeichert und per Sanity API an die Website übergeben.
Diese Schnittstelle funktioniert reaktiv und effizient: Sobald Inhalte im Studio geändert werden, aktualisieren sie sich automatisch auf der Website. Das CMS ist also nicht statisch, sondern Teil eines lebendigen Systems – ideal für Projekte, bei denen sich Inhalte regelmäßig ändern.
Warum ein Custom CMS mehr Freiraum schafft
Ein individuelles Custom CMS wie Sanity bietet genau das, was ein Projekt wie der Unsladen braucht: Freiheit. Keine starren Templates, keine Abhängigkeiten, keine Einheitslösung.
- Maximale Flexibilität: Inhalte, Strukturen und Workflows lassen sich vollständig an die Projektidee anpassen.
- Headless-Architektur: Die Inhalte sind über die Sanity API abrufbar – sie können also nicht nur auf der Website, sondern auch in anderen Plattformen, Apps oder interaktiven Displays verwendet werden.
- Skalierbarkeit & Performance: Durch die klare Trennung von Frontend (Next.js) und Backend (Sanity CMS) bleibt das System schlank, effizient und zukunftssicher.
So entsteht eine Plattform, die mitwachsen kann – technisch, gestalterisch und inhaltlich.
Design, das Geschichten erzählt
Ich wollte, dass das Design denselben Charakter hat wie der Unsladen selbst: verspielt, freundlich, handgemacht. Deshalb habe ich einen Grain-Filter verwendet, um der Seite eine analoge Tiefe zu geben, und mit Rough.js unregelmäßige, fast gezeichnete Ränder geschaffen.
Kleine Animationen – das Logo mit Tada-Effekt, wackelnde Überschriften, leichte Bewegungen beim Scrollen – bringen Lebendigkeit ins Layout, ohne aufdringlich zu wirken. Das Ziel: eine Seite, die Emotion transportiert, aber technisch präzise bleibt.
Mein Beitrag – Feinarbeit trifft Neugier
Als ich das Projekt übernahm, war die Grundstruktur bereits da. Ich durfte die Seite technisch weiterentwickeln: das Styling überarbeiten, ein Filtersystem für Produkte bauen, die Sanity-Schemata erweitern und die /link-Seite aufbauen.
Dabei habe ich gelernt, dass gute Webentwicklung aus vielen kleinen Entscheidungen besteht – manche sichtbar, viele unsichtbar. Es geht nicht nur darum, was auf dem Bildschirm passiert, sondern auch darum, wie flexibel das System dahinter gedacht ist.
Wenn Design und Technik sich ergänzen
Was ich an diesem Projekt besonders spannend fand, war die Harmonie zwischen Gestaltung und Struktur. Jede Designidee musste technisch umsetzbar sein – und jede technische Entscheidung hatte Einfluss auf das Nutzererlebnis.
Dieses Zusammenspiel hat mir gezeigt, dass moderne Webentwicklung wie eine gute Komposition funktioniert: sauber aufgebaut, aber offen für Improvisation. Der Unsladen ist am Ende nicht nur eine Website geworden, sondern ein Beispiel dafür, wie sich Technik, Design und Persönlichkeit gegenseitig stärken können.
Fazit – Handgemacht, digital, echt
Der Unsladen zeigt, dass Webentwicklung nicht kühl oder distanziert sein muss. Mit Next.js als technischem Fundament und Sanity CMS als flexiblem Content-System entsteht eine Plattform, die genauso lebendig ist wie der Ort, den sie repräsentiert.
Für mich war das Projekt mehr als ein Einstieg in moderne Frameworks – es war ein Blick darauf, wie digitaler Raum menschlich wirken kann. Und vielleicht ist das die schönste Erkenntnis: Wenn man Technologie mit Charakter baut, entsteht etwas, das bleibt.
Verwendete Technologien
Next.js – Framework für modulare Webentwicklung Sanity CMS – Headless CMS mit flexibler Inhaltsstruktur Tailwind CSS – modulares Styling-System Rough.js – handgezeichnete Ränder & Texturen Vercel – Hosting- & Analytics-Plattform

