Werkzeugkasten
Hier stehen die Vorlagen zu den Werkzeugen, über die ich im Ratgeber schreibe. Jede ist ein Text, den Sie in eine Sitzung mit Claude Code einfügen, und aus dem eine erste, lauffähige Fassung entsteht.
Was hier steht, ist der Bau. Ob sich für Ihren Ablauf ein eigenes Werkzeug lohnt oder ob ein fertiges Produkt die Sache besser erledigt, ist eine andere Frage, und die beantwortet diese Seite nicht.
Alle Vorlagen brauchen ein Claude-Konto auf Pro, Max, Team oder Enterprise. Sie erzeugen eine erste Fassung, kein fertiges Produkt.
Ohne Anbindung zeigt die Seite nichts
Jede Vorlage, die Zahlen aus einem anderen System holt, braucht eine Verbindung dorthin. Die richten Sie in Claude Code oder in der Cowork-App ein, nicht im anderen System. Was Sie mitbringen müssen, sind dessen Zugangsdaten.
Am Beispiel Notion, vier Schritte:
- In Claude Code einmal
claude mcp add --transport http notion https://mcp.notion.com/mcpeingeben. Damit weiß Claude, wo Notion liegt. /mcpeingeben. Es öffnet sich der Browser, und Sie melden sich bei Notion an.- Notion fragt, welche Seiten und Datenbanken die Verbindung sehen darf. Wählen Sie genau die aus, um die es geht, und keine weiteren.
- Fertig. Ab jetzt kann Claude diese Datenbank lesen, und die Vorlage findet ihre Zahlen.
Für ein System ohne fertige Verbindung läuft es fast gleich, nur dass Sie den Schlüssel selbst erzeugen. Sie legen ihn im anderen System an, speichern ihn in einer Datei außerhalb des Projekts und nennen Claude Code beim Einrichten den Pfad dorthin. So läuft es bei einer eigenen n8n-Instanz, bei Search Console, Google Ads und GA4 über die Google-Cloud-CLI und bei den meisten Buchhaltungsanbietern.
Rechnen Sie damit, dass diese Einrichtung länger dauert als der Bau der Seite selbst. Bei den Werkzeugen hier war das durchgehend so. Wenn Sie unterwegs hängen bleiben, fragen Sie Claude direkt danach. Jede Vorlage hier sagt ihm, dass er Sie durch die Einrichtung führen soll.
Vorsicht beim Einrichten:
- Zugangsdaten gehören nie in den Prompt und nie in die fertige Seite. Sie liegen in einer Datei außerhalb des Projekts oder in einer Umgebungsvariable, und der Code liest sie von dort. Was Sie in eine Sitzung tippen, ist danach nicht mehr privat.
- Geben Sie der Verbindung nur die Rechte, die das Werkzeug braucht. Leserecht reicht fast immer. Wo etwas zurückgeschrieben wird, erlauben Sie genau die Felder dieser einen Entscheidung und niemals das Löschen. Dann ist der größte mögliche Schaden ein falsch gesetzter Wert, den ein zweiter Klick zurücknimmt.
1. Cockpit: ein Bild aus mehreren Systemen
Was es tut. Eine Seite statt fünf offener Tabs. Sie sehen an einer Stelle, was heute offen ist, etwa die unbeantworteten Anfragen aus mehreren Postfächern, die offenen Aufgaben aus Asana oder Notion, die Reichweite aus Instagram und das Tagesbudget aus Google Ads. Alle Kacheln lesen nur, beantwortet und abgehakt wird weiter im jeweiligen System.
Ein Betriebs-Cockpit aus einem Kundenprojekt. Alle Zahlen und Namen sind unkenntlich gemacht.
# Vorlage aus dem Werkzeugkasten von Düsterhöft Digital Design
# duesterhoeft-digital-design.de/werkzeugkasten
Baue mir eine Übersichtsseite als einzelne HTML-Datei, die Kennzahlen aus
mehreren Quellen an einer Stelle zeigt.
Meine Quellen:
- <Quelle 1, z. B. Aufgabenliste: welches System, welche Zahl>
- <Quelle 2, z. B. Postfach: welche Zahl>
- <Quelle 3>
Bauart, bitte genau so:
1. Trenne Layout und Daten. Das Layout steht fest, die Daten stehen in einem
klar abgegrenzten Block, den ein späterer Lauf komplett ersetzen kann, ohne
das Layout anfassen zu müssen.
2. Jede Quelle ist ein eigener Baustein. Ist eine Quelle nicht erreichbar,
zeigt ihre Kachel eine kurze Fehlermeldung, und die übrigen Kacheln bauen
trotzdem auf. Kein Baustein darf die ganze Seite verhindern.
3. Alle Bausteine lesen nur. Keiner schreibt in ein Quellsystem zurück.
4. Schreibe am Ende jedes Laufs eine Zeile in eine Protokolldatei: Zeitpunkt,
welche Quelle geliefert hat, welche nicht.
Frage mich nach, bevor du baust: welche Zahl soll je Quelle groß oben stehen,
und woran erkenne ich auf einen Blick, dass etwas nicht stimmt?Falls ich keinen Account bei der genannten Quelle habe, leite mich durch die Einrichtung.Grenzen. Erzeugt die Seite, nicht den täglichen Lauf. Wer sie jeden Morgen neu bauen will, braucht zusätzlich eine geplante Aufgabe auf dem eigenen Rechner. Zurückschreiben kann diese Seite nichts. Wer aus der Übersicht heraus entscheiden und abhaken will, nimmt Block 5.
Anbindung. Je Quelle eine eigene Verbindung. Notion, Asana und Gmail hängen Sie wie oben beschrieben in Claude Code an. Kennzahlen aus Google-Diensten laufen über die Google-Cloud-CLI mit aktivierter API und angemeldetem Konto. Alle Bausteine nur mit Leserecht.
2. Vor-Ort-Liste: ein Kern, drei Ausgaben
Was es tut. Dieselbe Liste in drei Formen. Als Ausdruck für die Abrechnung, als Link zum Weitergeben und als Hakenliste auf dem Handy, auf der zwei Leute gleichzeitig arbeiten können, ohne sich gegenseitig zu überschreiben.
Die Materialliste für den Aufbautag. Beträge und Namen sind ersetzt.
# Vorlage aus dem Werkzeugkasten von Düsterhöft Digital Design
# duesterhoeft-digital-design.de/werkzeugkasten
Ich habe eine Liste, die drei verschiedene Zielgruppen unterschiedlich nutzen.
Baue mir dafür einen gemeinsamen Renderer mit austauschbarer letzter Schicht.
Meine Daten: <woher, welche Felder, welcher Filter>
Die drei Ausgaben:
- Druckfassung als PDF für die Abrechnung
- öffentliche Leseansicht zum Teilen per Link
- Arbeitsseite fürs Handy, auf der Einträge abgehakt werden
Bauart, bitte genau so:
1. Layout, Formatierung und das Auslesen der Daten liegen an einer einzigen
Stelle. Die drei Ausgaben tauschen nur den letzten Abschnitt aus, der die
Daten lädt und die Seite entweder statisch lässt oder schreibbar macht.
2. Auf der Arbeitsseite genügen zwei Schaltflächen je Zeile. Mehr nicht.
3. Ein Klick schreibt sofort zurück. Schlägt das fehl, macht die Seite den
Klick sichtbar rückgängig, statt einen Stand fälschlich als erledigt
anzuzeigen.
4. Mehrere Geräte gleichen sich in festem Takt ab, damit zwei Personen nicht
denselben Eintrag doppelt abhaken.
5. Die Arbeitsseite läuft ohne Anmeldung. Sichere sie nicht über einen Login,
sondern darüber, dass nur diese zwei Felder überhaupt beschreibbar sind.
Sag mir vor dem Bau, welcher der drei Wege bei meinen Daten am ehesten
scheitert und warum.Falls ich keinen Account bei der genannten Quelle habe, leite mich durch die Einrichtung.Grenzen. Die schreibende Fassung kann kein öffentlich geteiltes Artefakt sein. Sie braucht einen eigenen Platz, weil ein Artefakt keine Anfragen an fremde Server schicken darf.
Anbindung. Zwei Teile. Die Datenquelle hängen Sie an wie oben beschrieben, etwa Notion. Der Rückschreibweg braucht eine Automatisierung, die die Klicks annimmt, etwa n8n. Eine veröffentlichte Seite kann nicht direkt in ein fremdes System schreiben.
3. Auftrags-Radar: sammeln, bewerten, selbst entscheiden
Was es tut. Fünf Portale, einmal am Tag automatisch durchgesehen. Morgens stehen die passenden Ausschreibungen sortiert auf einer Seite, die auch ohne Internet funktioniert, und was Sie schon angesehen oder verworfen haben, bleibt markiert.
Das Ausschreibungs-Dashboard, mit dem ich selbst arbeite. Auftraggeber und Quellportale sind unkenntlich gemacht.
# Vorlage aus dem Werkzeugkasten von Düsterhöft Digital Design
# duesterhoeft-digital-design.de/werkzeugkasten
Baue mir ein Dashboard, das Ausschreibungen und Aufträge aus mehreren Quellen
sammelt und mir die Auswahl erleichtert, ohne sie mir abzunehmen.
Meine Quellen: <Portale, Feeds oder Schnittstellen>
Meine Kriterien: <Themen, die passen; Themen, die nie passen; Region; Wert>
Bauart, bitte genau so:
1. Ein Lauf holt die Daten, vereinheitlicht sie, entfernt Dubletten über die
Quellen hinweg und vergibt Punkte nach meinen Kriterien.
2. Ein zweiter Lauf baut daraus eine einzelne HTML-Datei. Alle Daten liegen als
JSON in der Seite selbst, jede Filterung läuft im Browser, ohne Server und
ohne Internetverbindung.
3. Zeige immer nur einen Ausschnitt der Treffer und lade den Rest über eine
Schaltfläche nach. Alles auf einmal zu rendern wird bei mehreren tausend
Einträgen spürbar langsam.
4. Ausschlusskriterien blenden nur in der Ansicht aus, nie in den Rohdaten.
Eine automatisch getroffene Ausblendung muss rücknehmbar bleiben.
5. Zeige oben, wie viele Einträge seit dem letzten Bau neu sind.
6. Mein eigener Status je Eintrag (angesehen, interessant, beworben, verworfen)
bleibt im Browser gespeichert und überlebt den nächsten Bau.
Frage mich vorher, welche Ausschlusswörter zu breit gefasst sind und welche
passenden Treffer sie mir wegfiltern würden.Falls ich keinen Account bei der genannten Quelle habe, leite mich durch die Einrichtung.Grenzen. Bewertet nach Ihren Kriterien, nicht nach Erfolgsaussicht. Die Punktzahl ersetzt das Lesen der Ausschreibung nicht.
Anbindung. Je Quelle unterschiedlich: offene Feeds brauchen keinen Zugang, Portale einen API-Schlüssel, manche geben ihre Daten nur über die eigene Website heraus. Klären Sie vor dem Bau, welche Ihrer Quellen überhaupt eine Schnittstelle hat.
4. Umfrage mit Auswertung, vergleichbar über die Jahre
Was es tut. Zwei Befragungen, die sich vergleichen lassen. Die Antworten laufen in dieselben Felder wie im Vorjahr, deshalb lässt sich am Ende sagen, ob es besser geworden ist. Wer antwortet, bekommt einen eigenen Link und braucht kein Konto.
Der Fragebogen, wie ihn die Teilnehmer sehen. Die Ansicht ist leer, es liegen keine Antworten darin.
# Vorlage aus dem Werkzeugkasten von Düsterhöft Digital Design
# duesterhoeft-digital-design.de/werkzeugkasten
Baue mir ein Umfrageformular und die dazugehörige Auswertung. Wichtigste
Bedingung: die Ergebnisse müssen sich mit einer früheren Ausgabe vergleichen
lassen.
Meine Fragen: <Liste, getrennt nach Pflicht und freiwillig>
Meine bestehende Datenbank: <welche Felder, welche Schreibweisen>
Bauart, bitte genau so:
1. Die Antworten laufen in exakt dieselben Felder wie beim letzten Mal, nicht
in ähnliche. Triff die vorhandenen Schreibweisen der Auswahlwerte genau,
inklusive Sonderzeichen, sonst legt die Datenbank stillschweigend eine
weitere Variante an.
2. Jeder Teilnehmer bekommt einen persönlichen Link ohne Anmeldung.
3. Ein zweites Absenden aktualisiert dieselbe Zeile, statt eine doppelte
anzulegen.
4. Die Pflichtfragen bleiben unter fünf Minuten. Vertiefungsfragen lassen sich
nach dem Absenden zusätzlich aufklappen.
5. Freitextfelder bekommen einen Diktierknopf. Der Text bleibt vor dem
Speichern editierbar, die Aufnahme selbst wird nicht aufbewahrt.
6. Die Auswertung benutzt denselben Rechenweg wie meine übrigen Auswertungen
und stellt die neuen Werte den alten gegenüber.
Prüfe zuerst meine bestehenden Felder und sage mir, welche Frage sich so nicht
vergleichbar stellen lässt.Falls ich keinen Account bei der genannten Quelle habe, leite mich durch die Einrichtung.Grenzen. Formular und Aufnahme brauchen einen Platz, der eigene Sicherheitsvorgaben zulässt. Manche Automatisierungsplattformen setzen dort feste Kopfzeilen, die sich nicht abschalten lassen.
Anbindung. Die Zieldatenbank braucht einen API-Zugang mit Schreibrecht auf genau die Felder der Umfrage. Das Formular braucht zusätzlich einen Platz, der eigene Sicherheitsvorgaben zulässt.
5. Auswahl-Board: Entscheidungen landen sofort im System
Was es tut. Durchgehen und entscheiden, ohne die Liste hinterher zu übertragen. Jeder Klick geht über n8n zurück in die Notion-Datenbank, und wenn auf dem Gelände gerade kein Netz ist, merkt sich die Seite die Klicks und liefert sie nach.
Ein Auswahlblatt aus dem Bewerbungsdurchgang. Fotos sind weichgezeichnet, Kontaktdaten ersetzt.
# Vorlage aus dem Werkzeugkasten von Düsterhöft Digital Design
# duesterhoeft-digital-design.de/werkzeugkasten
Baue mir eine Seite, auf der ich eine Liste durchgehe und je Eintrag eine
Entscheidung treffe, die sofort im System landet.
Meine Liste: <woher, welche Felder, welches Bild>
Meine Entscheidung je Eintrag: <welche zwei bis drei Zustände>
Bauart, bitte genau so:
1. Ein Klick schreibt über eine schmale, fest umrissene Schnittstelle zurück.
Nur die Felder dieser Entscheidung sind von dort aus erreichbar, kein
anderes, und Löschen nie.
2. Ohne Verbindung funktioniert die Seite weiter. Nicht übertragene Klicks
merkt sich der Browser und liefert sie nach, sobald die Verbindung wieder
steht.
3. Keine Anmeldung. Die Absicherung liegt in einem Zugangsschlüssel in der
Seite und in der engen Beschränkung dessen, was die Schnittstelle annimmt.
Der schlimmste denkbare Fehler ist ein falsch gesetzter Haken, der sich mit
einem weiteren Klick zurücknehmen lässt.
4. Arbeiten mehrere Personen gleichzeitig, gleichen sich die Geräte in festem
Takt ab.
Nenne mir vor dem Bau, welches Feld ich aus Versehen freigebe, wenn ich deine
Schnittstelle so baue, wie du sie vorschlägst.Falls ich keinen Account bei der genannten Quelle habe, leite mich durch die Einrichtung.Grenzen. Der Zugangsschlüssel wird von Hand weitergegeben und von Hand getauscht. Einen automatischen Ablauf dafür gibt es nicht.
Anbindung. Lesezugang zur Datenbank plus eine schmale Schreibschnittstelle über eine Automatisierung, etwa n8n. Der Zugangsschlüssel steckt in der Seite selbst, deshalb muss die Schnittstelle jedes Feld ablehnen, das nicht zu dieser Entscheidung gehört.
6. Bericht: am Bildschirm lesen, als PDF verschicken
Was es tut. Einen Bericht pflegen, nicht zwei. Dieselbe Datei liest sich am Bildschirm in Hell und Dunkel und wird auf Knopfdruck zum PDF, in dem keine Überschrift allein am Seitenende steht und keine Tabelle mitten durchgeschnitten wird.
Ein Website-Check in der Bildschirmfassung. Messwerte und Kundenangaben sind unkenntlich gemacht.
# Vorlage aus dem Werkzeugkasten von Düsterhöft Digital Design
# duesterhoeft-digital-design.de/werkzeugkasten
Baue mir einen Bericht, der am Bildschirm gut lesbar ist und sich als PDF
verschicken lässt, ohne dass ich ihn zweimal pflege.
Mein Inhalt: <worum geht es, welche Abschnitte, welche Kennzeichnungen>
Bauart, bitte genau so:
1. Der Inhalt entsteht einmal als HTML-Datei mit eingebettetem Stylesheet, mit
hellem und dunklem Farbschema. Diese Quelle ist direkt online lesbar.
2. Für den Druck liest ein getrenntes Skript dieselbe Quelle, ergänzt Kopf und
Rahmen, hängt ein zweites Stylesheet nur für den Druck an und lässt einen
Browser im Hintergrund daraus eine PDF-Datei drucken.
3. Das Druck-Stylesheet erzwingt das helle Farbschema unabhängig von der
Systemeinstellung, setzt eine feste Seitengröße und verhindert, dass eine
Überschrift allein am Seitenende steht oder eine Tabelle mitten durch
geschnitten wird.
4. Text und Befunde ändern sich zwischen beiden Ausgaben nicht. Nur die
Darstellung passt sich an.
Aufbau des Inhalts: Kernaussage in ein bis zwei Sätzen ganz oben, danach
nummerierte Abschnitte mit eigenen Zwischenüberschriften, farbige
Kennzeichnung für Schweregrad oder Status, und ein eigener Abschnitt, der
benennt, was der Bericht bewusst nicht bewertet.Falls ich keinen Account bei der genannten Quelle habe, leite mich durch die Einrichtung.Grenzen. Erzeugt Layout und Druckweg, nicht den Inhalt. Der Abschnitt darüber, was der Bericht nicht bewertet, ist Handarbeit und der wichtigste Teil.
Anbindung. Keine fremde Schnittstelle nötig. Lokal braucht der Druckweg einen Browser, der im Hintergrund läuft und das PDF erzeugt.
7. Belegdurchgang: was beim Blättern nicht auffällt
Was es tut. Ein Jahr Belege in Durchgängen statt in einer langen Liste. Das Arbeitsblatt zeigt mögliche Duplikate, offene Zuordnungen und fehlende Kategorien aus Lexware Office, mit Fortschrittsbalken und Suchfeld. Die Buchung selbst machen Sie weiter in Lexware Office.
Das Arbeitsblatt zum Belegputz. Es zeigt Platzhalterdaten, keine echte Buchhaltung.
# Vorlage aus dem Werkzeugkasten von Düsterhöft Digital Design
# duesterhoeft-digital-design.de/werkzeugkasten
Baue mir ein Arbeitsblatt, mit dem ich ein Jahr Buchhaltung in Durchgängen
aufräume.
Meine Datenquelle: <welches System, welche Schnittstelle, welcher Zeitraum>
Bauart, bitte genau so:
1. Ein Lauf holt einmal einen vollständigen Abzug und legt ihn lokal ab. Alles
Weitere arbeitet auf dieser Kopie.
2. Der zweite Lauf prüft den Abzug gegen sich selbst: mögliche Duplikate,
offene Zuordnungen, nicht kategorisierte Posten. Gruppiere Duplikate über
die eindeutige Belegnummer, nicht über Name und Betrag.
3. Der dritte Lauf sortiert die Fälle nach Abhängigkeit statt nach Betrag:
zuerst die Fälle, die andere Entscheidungen blockieren, dann Löschungen,
dann Kategorisierungen, zuletzt Zuordnungen.
4. Der vierte Lauf baut daraus eine HTML-Seite mit Fortschrittsbalken und
Suchfeld, gegliedert in Durchgänge. Jede Zeile lässt sich abhaken.
5. Der Haken überlebt einen Neubau der Seite, weil jede Zeile einen festen, aus
der Belegnummer abgeleiteten Schlüssel trägt statt einer Zeilennummer.
6. Schreibende Zugriffe auf die Buchhaltung sind grundsätzlich gesperrt und
müssen einzeln freigeschaltet werden.
Sag mir vorher, welche Duplikate deine Prüfung übersieht und warum.Falls ich keinen Account bei der genannten Quelle habe, leite mich durch die Einrichtung.Grenzen. Findet Kandidaten, keine Wahrheit. Ob eine Buchung wirklich doppelt ist, entscheidet weiterhin ein Mensch, und Steuerberatung ist das ohnehin nicht.
Anbindung. Ein API-Zugang zu Ihrem Buchhaltungssystem, ausdrücklich nur lesend. Schreibrechte braucht das Arbeitsblatt nicht und sollte sie auch nicht bekommen.
8. Workshop-Moderation mit Timer und Entscheidungsvorlage
Was es tut. Der Tag endet mit einer Entscheidung. Timer und Moderationstext laufen auf einer Seite mit, jeder Block nennt sein Ziel und seine Minuten, und am Ende steht eine Entscheidungsvorlage statt eines Protokolls.
Das Moderations-Cockpit für einen Workshop-Tag. Thema und Namen sind ersetzt.
# Vorlage aus dem Werkzeugkasten von Düsterhöft Digital Design
# duesterhoeft-digital-design.de/werkzeugkasten
Baue mir ein Moderations-Cockpit als einzelne HTML-Seite für einen
Workshop-Tag.
Mein Thema: <welche Streitfrage soll am Ende entschieden sein>
Meine Blöcke: <Abfolge, Ziel je Block, Dauer je Block>
Bauart, bitte genau so:
1. Eine mitlaufende Kopfzeile zeigt durchgehend den aktuellen Block und einen
großen Timer, der bei Ablauf farblich warnt.
2. Jeder Block lässt sich aufklappen und zeigt vier Dinge: eine Tabelle mit
Minutentakt, das Moderationsskript, eine typische Moderationsfalle samt
Gegenmittel, und die Dokumente, die in diesem Block gefüllt werden.
3. Das Ziel des Tages ist eine Entscheidungsvorlage mit Leitplanken, die über
den Tag hinaus gelten, nicht ein Protokoll des Gesprächs.
Frage mich vor dem Bau, an welchem Block der Tag am ehesten kippt, und baue
dort den Puffer ein.Falls ich keinen Account bei der genannten Quelle habe, leite mich durch die Einrichtung.Grenzen. Erzeugt die Struktur, nicht die Moderation. Wer den Streit im Raum nicht aushält, bekommt auch mit Timer keine Entscheidung.
Anbindung. Keine. Die Seite läuft ohne fremde Systeme, Agenda und Texte stehen in ihr selbst.
Die Vorlagen wachsen mit
Jedes neue Werkzeug, über das ich schreibe, bekommt hier seinen Block.
Wenn Sie so etwas brauchen, es aber nicht selbst bauen wollen, schreiben Sie mir.