Jetpack.com neu – ein Monat später

Im April begannen wir, Jetpack.com neu aufzubauen. Schon nach wenigen Tagen gab es – dank KI-Programmierwerkzeugen, die fast die gesamte Programmierarbeit übernahmen – ein funktionierendes Theme und eine Staging-Website.

Das ging schneller, als ich erwartet hatte. Also wuchs das Projekt weiter.

Am 27. August ging Jetpack.com neu online. Seitdem ist etwas mehr als ein Monat vergangen, und ich möchte zeigen, was sich geändert hat, wie wir die Website aufgebaut haben und was wir jetzt damit machen können.

Wir sind bewusst mit Funktionsgleichheit gestartet

Das Ziel für den Starttag war kein dramatischer Neuentwurf. Es ging darum, alles beizubehalten, was für Besucher bereits funktionierte, und die Grundlage darunter zu ersetzen … während wir gleichzeitig einige Designverbesserungen direkt einbauten.

Mein Kollege Robert übernahm den schwierigen Teil – Backend und Infrastruktur –, während ich mich auf Frontend und Design konzentrierte (mein Spezialgebiet).

Die Startseite und die Preisseite haben sich gegenüber dem ursprünglichen Design am stärksten verändert. Früher befand sich die Preisübersicht in einer separaten App, sodass ein Klick auf „Preise“ die Website verließ. Das war eine umständliche Nutzererfahrung; jetzt ist sie wie jede andere Seite auf Jetpack.com. Die meisten Produktseiten behielten ihre Inhalte und wurden in das neue Design übernommen.

Die ersten Zahlen zeigen, dass sich der Wechsel nicht negativ auf die Conversion-Raten ausgewirkt hat – tatsächlich sehen wir sogar einen leichten Anstieg. Das Ziel war die Ausgangsbasis, also ist alles darüber hinaus das Sahnehäubchen.

Es ist ein Block-Theme von WordPress

Die neue Website ist ein Block-Theme auf WordPress.com. Jede Seite wird aus Blöcken und Mustern aufgebaut, und die interaktiven Bereiche sind individuelle Blöcke, die in TypeScript mit der Interactivity API geschrieben wurden.

Es gibt weder einen Page Builder noch ein Headless-Frontend. Es ist WordPress.

Auch die Inhalte liegen in Git

Das ist der Teil, der meiner Meinung nach für Builder, die mit WordPress arbeiten, am interessantesten sein dürfte.

Jeder Beitrag, jede Seite und jeder Supportleitfaden auf Jetpack.com liegt ebenfalls als einfaches Block-Markup in einem Git-Repository. Das sind fast 1.000 Blogbeiträge, etwa 350 Supportleitfäden und 77 Seiten, die alle neben dem Theme versioniert werden.

Es gibt drei Wege, wie eine Änderung auf die Website gelangt:

Niemand muss sich für eine Seite entscheiden. Unsere Happiness Engineers bearbeiten einen Supportleitfaden in wp-admin wie bisher. Ein Entwickler kann ein Dutzend Seiten in einem Pull Request ändern und vor der Veröffentlichung eine zweite Meinung einholen.

Menschen entscheiden. Agenten tippen.

Wir haben diese Website gemeinsam mit KI-Programmieragenten aufgebaut und betreiben sie auch auf diese Weise.

Das Repository enthält Anweisungen, denen Claude Code, Codex oder Cursor folgen können. Du beschreibst, was du möchtest, etwa „die Titelbilder dieser alten Blogbeiträge aktualisieren“ oder „einen Branch für Animationen auf der Startseite anlegen und mir die lokale Vorschau zeigen.“ Der Agent holt die Inhalte ab, nimmt die Änderung vor, prüft sie und öffnet den Pull Request.

Er hält an und fragt nach, bevor irgendetwas die Live-Website berührt (wenn du nicht im YOLO-Modus arbeitest). Automatisierte Prüfungen laufen bei jeder Änderung, und eine Person genehmigt sie, bevor sie veröffentlicht wird.

Marketingmitarbeiter, Supportmitarbeiter und Entwickler können jetzt alle über denselben Prozess an derselben Website arbeiten.

Übersetzungen bleiben automatisch aktuell

Alle Seiten und Beiträge, die wir auf Englisch veröffentlichen, werden automatisch ins Spanische, Französische, Deutsche und Japanische übersetzt. Wir haben diese vier Sprachen ausgewählt, weil sie auf der alten Website am beliebtesten waren.

Wenn sich der englische Text ändert, werden nur die geänderten Absätze erneut übersetzt. Jede Übersetzung wird vor der Veröffentlichung geprüft. Im September wurden auch die Supportleitfäden in denselben Ablauf aufgenommen.

Ein neues Supportdesign an einem Tag

Möchtest du ein Beispiel?

Vor etwa einer Woche besprachen wir in unserem wöchentlichen Treffen mit dem Happiness-Team von Jetpack, wie schwierig es war, den richtigen Supportleitfaden zu finden. Die Leitfäden eines Produkts waren nur über eine von Hand zusammengestellte Liste am Ende jedes Artikels erreichbar. VaultPress Backup hat 11 Leitfäden, aber diese Liste zeigte etwa 8 davon.

Das neue Design wurde an einem Tag erstellt und war noch in derselben Woche online.

Das ist neu bei jetpack.com/support:

• Eine Suche, die nur Supportleitfäden zurückgibt, mit beliebten Suchanfragen direkt unter dem Suchfeld.
• Karten für „Häufige Szenarien“ für Dinge, wegen derer Menschen gestresst auf der Website landen: eine nicht erreichbare Website, ein Hack, eine nicht funktionierende Verbindung oder ein wiederherzustellendes Backup.
• „Nach Thema durchsuchen“ und „Nach Produkt durchsuchen“, damit du einen Leitfaden finden kannst, ohne seinen Namen zu kennen.
• Eine Seitenleiste in jedem Artikel mit allen Leitfäden dieses Produkts.
• „War dieser Artikel hilfreich?“ am Ende jedes Artikels, damit wir wissen, welche Leitfäden überarbeitet werden müssen.
• Unsere Happiness Engineers, abgebildet und namentlich rund um das Suchfeld.

Auch die Seite „Support kontaktieren“ wurde geändert. Im Mittelpunkt steht jetzt unser Support-KI-Assistent, und es wird klar angezeigt, wohin du als Nächstes gehen kannst – unabhängig davon, ob du Kunde bist oder das kostenlose Plugin verwendest.

49 Korrekturen seit dem Start

Seit dem Start hat das Team 49 nachträgliche Korrekturen und Verbesserungen abgeschlossen, angeführt von Gergely Juhász und Manzoor Wani.

Einige davon sind klein: Tabellen, die du mit der Tastatur scrollen kannst, eine Pausensteuerung im Karussell der Startseite und ältere Beiträge, deren Absatzformatierung beim Umzug verloren ging.

Einige stammten direkt davon, dass ich beobachtet hatte, wie Menschen die Website nutzten. Wenige Tage nach dem Start bat ich eine Lehrerin, die mit WordPress arbeitet, Jetpack einzurichten, während ich zusah. Sie landete auf der Startseite und konnte nicht erkennen, dass Jetpack einen kostenlosen Tarif anbietet.

Die Leute werden also einfach gehen.

Sie hatte recht. Auf der Startseite gibt es jetzt eine Schaltfläche „Jetpack kostenlos erhalten“, und darunter steht, dass ein dauerhaft kostenloser Tarif ohne erforderliche Kreditkarte verfügbar ist.

Wie geht es weiter?

Zuerst haben wir die alte Website nachgebildet. Jetzt können wir sie verbessern, mit übersichtlicheren Produktseiten, im Laufe der Zeit mehr Sprachen und Tests von Änderungen statt bloßem Raten.

Wenn dir auf Jetpack.com etwas Defektes oder Verwirrendes auffällt, sag es uns. Und wenn du beruflich Websites mit WordPress erstellst und einen tieferen Einblick in die Funktionsweise des Git- und Agenten-Workflows möchtest, gib mir Bescheid. Ich schreibe gern einen Folgebeitrag.