FREUNDSCHAFTSPROJEKT · NIE VERÖFFENTLICHT
Ein Entwickler-Portfolio als Turm aus Porzellan.
Ein befreundeter Full-Stack-Entwickler brauchte eine Oberfläche für die Website, die er seit fünf Jahren selbst pflegt. Daraus wurde ein Architekturmodell im Browser, in dem jedes Stockwerk eines seiner Systeme zeigt, und zwar im Betrieb. Online ging es nie. Hier steht, warum.
Der Kunde bleibt ungenannt. Die Demo zeigt eine erfundene Person, Lior Adan. Name, Foto und Projekte sind ausgedacht, der Turm ist echt.
Öffnet die Demo in voller Größe: wilddigitalmoments.com/demos/turmbau/
Ausgangslage
Ein befreundeter Full-Stack-Entwickler betreibt seit rund fünf Jahren seine eigene Portfolio-Seite. Technisch ist sie solide: Next.js, ein selbst gebautes CMS mit Admin-Bereich, Tests. Und er sagt offen, dass Gestaltung nicht seine Stärke ist.
Man sah es der Seite an. Nur Text, kein Foto, Projekte, in die man nicht hineinklicken konnte, ein leerer Blog. Sie sah aus wie fast jede Entwickler-Seite.
Das Angebot war einfach: Ich baue die Oberfläche ohne Rechnung, er empfiehlt das Studio weiter, und auf der Seite steht ein sichtbarer Vermerk, wer sie gebaut hat.
Die Idee
„Full-Stack“, wörtlich genommen: ein Stapel. Ein Turm aus Porzellan steht wie ein Architekturmodell auf dem Tisch, und jedes Stockwerk ist eines seiner Systeme, in Betrieb. Kleine orange Datenpakete laufen durch jede Mechanik: eine Anmeldeschleuse, getrennte Tresore für Mandanten, eine Warteschlange mit Wiederholversuchen, eine KI-Konsole, die Fehler offen meldet.
Die Seite erklärt nicht, was der Entwickler kann. Sie zeigt es arbeiten.
Was im Turm steckt
STOCKWERKE
Jedes Projekt ein Stockwerk, jedes mit eigener Glasur. Die Mechanik läuft, statt beschrieben zu werden.
RÄUME
Die ganze Website wohnt im Turm. Die Kuppel ist „Über mich“, ein Archivraum der Lebenslauf, die Lobby der Kontakt.
FIGUREN
Für jede Technologie eine kleine Porzellanfigur: ein Elefant für PostgreSQL, ein Atom für React, ein Bleisatz-Letter für TypeScript. Zeigt man im Text auf das Stichwort, leuchtet die Figur im Modell auf.
ETIKETTEN
Schwebende Anmerkungen zeigen auf die Teile. Sie sagen, was eine Technik in diesem Projekt tut, und nicht, wie der Gegenstand aussieht.
DREHEN
Scrollen dreht den Turm. Mit Maus oder Finger lässt er sich auch von Hand drehen.
DER ARCHITEKT
Das Foto des Entwicklers steht als kleiner Aufsteller auf dem Tisch neben seinem Modell, wie ein Architekt bei der Präsentation.
Wie gebaut
Die erste Runde waren drei Entwürfe, als echte Seiten gebaut. Mein Urteil: alle drei generisch. Der Fehler lag im Auftrag, nicht in der Ausführung. Alle drei hielten sich an die Reihenfolge der alten Seite, also war es ein Gerüst in drei Farben. Die Texte waren wörtlich übernommen, statt die Überschriften aus den Fakten neu zu schreiben. Und nichts daran wirkte, als hätte ein Mensch entschieden. Seitdem gilt im Studio: Entwürfe müssen sich im Aufbau unterscheiden, nicht in der Farbe.
Die zweite Runde war der Turm. In drei Tagen kamen rund 30 Rückmeldungen, fast alle vom Handy: Farben, Räume, Figuren, Etiketten.
Auf dem Telefon erscheint sofort ein Standbild, das 3D-Modell blendet sich darüber ein, sobald es bereit ist. Die Vorschau erreichte in Lighthouse 100 am Desktop und 99 am Telefon, ohne einen Fehler in der Konsole und ohne eine Anfrage an fremde Server.
Dann gab er Zugriff auf seinen Code. Die Gestaltung wurde in seiner echten Next.js-Anwendung nachgebaut: Texte aus seinem CMS, sein Admin-Bereich unangetastet. 334 Unit-Tests und 25 End-to-End-Tests liefen grün, darunter ein neuer, der das 3D-Modell startet. Danach eine unabhängige Code-Prüfung und eine Korrekturrunde. Der Stand lag fertig bereit. Übertragen wurde nichts, denn so stand es im Vertrag: erst nach der Unterschrift.
Die Wendung
Beim Vertrag fragte er an genau einer Stelle nach: beim Vermerk. Wann gilt er, was passiert bei einer späteren Neugestaltung, wann darf er weg? Eine berechtigte Frage, die Klausel war zu vage. Noch am selben Abend kamen klare Regeln dazu: Der Vermerk gehört zur gelieferten Gestaltung, fällt bei einer Neugestaltung kostenlos weg und bleibt mindestens zwölf Monate.
Kurz nach Mitternacht am dritten Tag kam seine Antwort. Sinngemäß:
Er sehe, wie viel Arbeit darin steckt, und schätze das sehr. Aber diese Seite pflege er seit fünf, sechs Jahren, sie sei sein Baby, er arbeite alle paar Wochen daran. Er wolle sie nicht unter einen Vertrag mit jemand anderem stellen und baue lieber selbst weiter.
Das ist eine legitime Entscheidung, und er hat sie fair getroffen. Er hat sich bedankt, er empfiehlt das Studio weiterhin, und er hat erlaubt, die Arbeit mit erfundenen Angaben zu zeigen. Der Zugriff auf seinen Code endete, und alles Persönliche war innerhalb einer Stunde offline.
Was man daraus lernen kann
WAS SCHON DRINSTECKT
Fünf Jahre Abende machen aus einem Projekt ein Stück Identität. Die Oberfläche abzugeben fühlt sich dann an, als gäbe man das ganze Projekt ab. Das ist menschlich, und es passiert jedem, der lange an etwas baut.
DER EIGENTLICHE PREIS
Er liegt nicht in der Seite, die er ausgeschlagen hat. Er liegt in den nächsten Jahren an Wochenenden, die in den Teil fließen, den er selbst als seine schwächste Stelle nennt, statt in Backend und Systeme, wo er stark ist.
FÜR ENTWICKLER
Den eigenen Code behalten, die schwache Stelle einkaufen. Wer die Oberfläche abgibt, gibt nicht das Projekt ab.
FÜR STUDIOS
Umfang, Vermerk und Ausstieg am ersten Tag regeln. Auch unter Freunden, und gerade dann, wenn keine Rechnung geschrieben wird. Die neue Regel zum Vermerk steht seitdem in jedem Vertrag des Studios.
Ergebnis
Beim Kunden ging nichts online. Geblieben sind drei Dinge: eine öffentliche Demo mit einer erfundenen Person, ein wiederverwendbarer Baukasten, mit dem die nächste 3D-Seite dort beginnt, wo diese aufgehört hat, und eine bessere Vertragsklausel.
- Dauer
- 3 Tage
- Rückmeldungen
- rund 30, fast alle vom Handy
- Lighthouse, Vorschau
- 100 Desktop · 99 Telefon
- Anfragen an fremde Server
- 0
- Tests nach dem Umbau
- 334 Unit · 25 End-to-End, alle grün
- Übergabe
- keine, der Kunde baut selbst weiter
WEITERE FALLSTUDIEN
Ihr Code bleibt Ihrer.
Sie haben ein System, das funktioniert, und eine Oberfläche, die es nicht zeigt? Schicken Sie mir den Link. Umfang, Vermerk und Ausstieg klären wir, bevor ich anfange.