Lunch & Learn: Nachgebaut statt abonniert

Eine halbe Stunde, jeden Mittwoch, und nichts davon ist vorbereitet: Wer in der Woche etwas ausprobiert hat, zeigt es. Diesmal ging es auffällig oft um Software, die jemand einfach nachgebaut hat. Und um Kunden, die unerwartet selbst anfangen mitzubauen.

Inhalt

Micha: Photoshop ohne Abo
Stefan: Der Screen hängt jetzt in der Küche
Micha und Michi: Suche und Chatbot bei Schweizer Fleisch
Michi: Was 3200 Antworten freigeschaltet haben
Sandro: Jede Komponente bekommt ihre eigene URL
Yannick: Puck 0.23 im Starter
Tobi: Dokumentationen, die ein Agent schreiben kann
Stefan: Zwei kleine Tool-Funde
Fazit
Referenzen

Micha: Photoshop ohne Abo

Micha arbeitet seit über 30 Jahren mit Photoshop, früher in der Schachtel gekauft, heute im Abo, das jedes Jahr teurer wird. Auf der Suche nach Ersatz ist er auf GitHub fündig geworden: Jemand hat die Creative Cloud nachgebaut, nicht ein Programm davon, die ganze Reihe. In Rust, vibe-codiert, kostenlos. Die Entwickler schreiben, rund 90 Prozent der Photoshop-Funktionen seien drin.

Getestet hat Micha noch nichts. Das Interface sieht nicht aus wie Adobe, und nach 30 Jahren Gewohnheit ist genau das der Teil, der stimmen muss. Dazu kennt man die Entwickler nicht, es bleibt eine Binärdatei aus dem Netz. Stefan hatte den Illustrator-Ersatz schon heruntergeladen: Er startete, dann stürzte er ab. Die zweite offene Frage war die rechtliche. Der Code ist nicht kopiert, die Funktionen schon.

Sandro kennt den Effekt schon länger. Einem Freund, der keine 20 Franken im Monat für Lightroom zahlen wollte, hat er per Prompt in einer Viertelstunde eine rohe Web-Version gebaut. Nachbauen kostet fast nichts mehr. Was ein Produkt schützt, ist nicht mehr der Aufwand, es zu schreiben.

Stefan: Der Screen hängt jetzt in der Küche

Für das Dynamo hat Stefan ein Display gebaut, das im Haus zeigt, was gerade läuft. Digital Signage, gespeist aus dem digitalen Ökosystem des Kunden.

Spannend ist das Debug-Overlay. Damit lässt sich durch die Zeit scrollen, in die Vergangenheit und in die Zukunft, und mit einem Klick zurück ins Jetzt. Wer prüfen will, wie der Screen an einem vollen Abend aussieht, muss nicht auf den vollen Abend warten. Dazu gibt es einen CSV-Upload für Veranstaltungen, die nicht im CMS stehen. Das Overlay zeigt, welche CSV geladen ist und wie viele Zeilen daraus heute greifen, und verlinkt direkt auf das Upload-Formular.

Am Abend schaltet der Screen in den Dark Mode. Das ist angenehmer im Raum und schont das Display: Wenn sich die Darstellung die halbe Zeit invertiert, brennt sie sich nicht ein. Selbst die Icons kippen mit.

Der Screen hängt inzwischen auch bei uns in der Küche, mit dem Dynamo und dem Zentrum Paul Klee darauf. Am Morgen war dort kein Event zu sehen, am Nachmittag schon: Der Kunde hatte den CSV-Upload selbst ausprobiert. Beim Kaffeeholen sieht man, dass das eigene Produkt benutzt wird, ganz ohne Statistik.

Micha und Michi: Suche und Chatbot bei Schweizer Fleisch

Für Schweizer Fleisch entsteht gerade eine neue Website, und darin mehrere Wege zu einem Rezept. Die Suche ist eine Kombination aus Chatbot und klassischer Suche: Wer «Weihnachten» eintippt, bekommt zuerst einen Vorschlag, welche Rezepte zum Weihnachtsessen passen, und darunter die Treffer. Wer lieber klassisch sucht, sucht klassisch und landet direkt beim Rezept.

Auf der Rezeptseite selbst sitzt ein zweiter Chatbot, der Fragen zum Rezept beantwortet. Darin steckt mehr Detailarbeit, als man denkt. Stellt man die Frage weiter unten auf der Seite, springt die Ansicht an die richtige Stelle, damit die Antwort nicht irgendwo im Nichts erscheint.

Zwei Fehler sind beim Vorführen aufgefallen. So ist das bei einer Live-Demo im Standup, beide stehen jetzt auf der Liste.

Michi: Was 3200 Antworten freigeschaltet haben

Für denselben Kunden hat das Team eine Umfrage auf die Website gestellt. Ein paar Fragen, hart codiert, mit Freitextfeldern und einer Mobile-Ansicht. 3200 Personen haben begonnen, über 2000 die ganze Umfrage ausgefüllt. Über das Ergebnis haben Kunde und Team gestern mehr als eine Stunde gesprochen.

Wertvoll waren nicht die Checkboxen, sondern die Freitexte. Da stand, was Leute auf der Website vermissen: eine Merkliste, eine Einkaufsliste. Und ein Rezept-Generator, der aus dem, was im Kühlschrank liegt, einen Vorschlag macht.

Über genau so einen Generator haben wir mit dem Kunden schon länger gesprochen, ohne dass sich die Frage entscheiden liess: Will das jemand? Die Umfrage beantwortet sie, und zwar von aussen. Damit ist aus einer Idee ein konkretes Thema geworden. Technisch wäre der Generator schnell gebaut.

Die erste Funktion aus der Umfrage ist trotzdem eine andere. Gefragt wurde auch, wo man Fleisch direkt kaufen kann. Die Daten zu den Hofläden liegen bei Schweizer Bauern, eine Anfrage beim Webmaster hat ergeben: Es gibt eine offene API. Daraus wird eine Karte.

Die Lehre daraus hat Michi selbst gezogen: Fragen hilft. Das sollten wir öfter machen, statt intern zu diskutieren, was Nutzerinnen und Nutzer wohl wollen.

Sandro: Jede Komponente bekommt ihre eigene URL

Styleguides für Kampagnen-Sites baut NETNODE regelmässig. Sandro hatte dabei immer dasselbe Problem: Sektionen können ihren Hintergrund wechseln, und dann müssen die Komponenten darin ihre Farben invertieren. Ob das überall sauber passiert, liess sich nie richtig prüfen. Eine Änderung in der Storybook-Konfiguration, und irgendwo war etwas kaputt, das vorher funktioniert hat.

Seine Idee: Der Styleguide liest die Storybook-Konfiguration und gibt jeder Komponente eine eigene URL. Damit kann Playwright die Komponente einzeln aufrufen, ein Attribut umschalten, etwa den Hintergrund, und nachsehen, ob die Invertierung stimmt. Bewusst als eigenständige Lösung, nicht in Storybook eingebaut, damit man nicht daran festhängt.

Der Stand ist früh: ein Script, das einen Fall prüft. Yannick hat den nächsten Schritt eingeworfen, Visual Regression Testing, also Screenshots vor und nach einer Änderung vergleichen und sich die Unterschiede zeigen lassen. Nützlich wäre das im Projektalltag sofort: Neue Kampagne, neue Farben, einmal durchlaufen lassen und sehen, welche Komponenten nicht mitkommen.

Yannick: Puck 0.23 im Starter

Puck ist der visuelle Editor in unserem Frontend-Starter. Yannick hat die Version 0.23 mitgebracht. Erschienen ist sie schon im August, neu war sie den meisten trotzdem.

Drei Dinge daraus. Beim Einfügen per Drag verschieben sich die umliegenden Komponenten erst beim Loslassen, nicht schon beim Darüberfahren. Das alte Verhalten bleibt wählbar. Dazu kommt eine Outline-Ansicht, bei uns gibt es eine eigene, die man künftig darauf aufsetzen könnte. Und es gibt eine API, um die Editor-Oberfläche zu übersetzen. Mit der neuen Version im Starter ist das jetzt möglich.

Tobi: Dokumentationen, die ein Agent schreiben kann

In my.netnode.ch sind die Dokumentationen umgebaut. Es gibt zwei Arten: Bookmarks und Dokumentationen. Ein Bookmark ist eine Dokumentation mit einem Titel und einem Link und wird auch so angezeigt. Längere Dokumentationen bekommen ein Inhaltsverzeichnis.

Dazu eine CLI, mit der ein Agent Dokumentationen schreibt. Die erste ist genau so entstanden, aus einem konkreten Helpdesk-Ticket heraus.

Der Editor in den Dokumentationen kann jetzt Bilder. Entweder eines aus den Anhängen wählen oder direkt hochladen, dann landet es gleichzeitig im Text und im Anhang. Die Grösse lässt sich einstellen, und die Formatleiste bleibt oben stehen, man muss bei einem langen Text nicht nach oben scrollen. Eine Kante gibt es: Wer ein Bild aus dem Text löscht, muss es im Anhang selbst entfernen.

Vimeo- und Miro-Links werden zu Einbettungen. Das Video läuft direkt in der Dokumentation, das Miro-Board lässt sich darin bedienen, sofern es offen geteilt ist. Offen ist der Rollout: Kommentare und Roadmap-Items hängen noch am alten Editor.

Stefan: Zwei kleine Tool-Funde

Stefan nutzt für verschiedene Aufgaben verschiedene Browser, Chrome für die Web-Entwicklung, Safari für alles andere. Velja löst das: Das Tool gibt sich als Browser aus, wird zum Standardbrowser gemacht, und dann entscheiden Regeln, welche URL wo aufgeht. Localhost in Chrome, der Rest in Safari. Merkliche Verzögerung gibt es keine.

Der zweite Fund heisst Window Glue und klebt Fenster zusammen. Bewegt man eines, kommt das andere mit. Mit leichtem Nachziehen, und nicht jeder Fall sitzt, etwa beim Grössenverändern. Als Alternative zu einem vollen Tiling-Manager ist die Idee clever.

Fazit

Zwei Dinge sind an dieser Runde hängen geblieben, und sie haben nichts miteinander zu tun.

Das erste: Eine komplette Software-Suite nachzubauen, ist zu einem Wochenendprojekt geworden. Ob die Klone etwas taugen, weiss noch niemand, einer ist beim ersten Start abgestürzt. Aber die Frage, was ein Produkt schützt, stellt sich jetzt anders.

Das zweite: Die interessanteste Erkenntnis der Woche kam nicht aus einem Modell, sondern aus einem Freitextfeld. 3200 Leute haben aufgeschrieben, was sie auf einer Website vermissen, und damit eine Produktfrage beantwortet, die vorher Meinungssache war. Dazu ein Kunde, der am eigenen Screen die neue Funktion ausprobiert, bevor wir ihn danach fragen. Beides sind Rückmeldungen, die man nicht herbeiplanen kann.

Referenzen

Lassen Sie uns darüber sprechen

Vieles von dem, was hier steht, hat klein angefangen: eine Frage aus einem Projekt und ein Nachmittag zum Ausprobieren. Wenn Sie so eine Frage mit sich herumtragen, schauen wir sie gerne mit Ihnen an, bevor daraus ein Projekt wird. Das erste Gespräch ist immer kostenlos.

Schreiben Sie uns