Beautiful Articlevon ConardLi

Beautiful Article Skill.

Gestalten Sie ein Dokument, das lesenswert ist, ohne es in ein Dashboard zu verwandeln.

Editorial Design
HTML
Longform

OpenDesign herunterladen Anleitung ansehen

Quellenprüfung · Beautiful ArticleSKILL.md

Aufgabe Editorial Design Liefert • Ein eigenständiges article.html mit Inline-Styling und -Skripten • Extrahiertes Quell-Markdown und Hinweise zur Extraktionsqualität • Einen redaktionellen Plan und einen geprüften ersten Spread für den Artikel Vor dem Start Der dokumentierte Build verwendet Node/npm, Vite, React, TypeScript und Reacticle. Für die Dokumentenextraktion und die optionale PDF-Ausgabe können zusätzliche Werkzeuge erforderlich sein; generierte Bilder benötigen ein separat verfügbares Backend.

Redaktionelle Zusammenfassung · Quelle geprüft 2026-10-07 · kein generiertes Beispiel

01 Funktionen

Beautiful Article

Eine redaktionelle Pipeline, die Extraktion, Artikelplanung, Freigabe des ersten Spreads, vollständige Komposition und Offline-Auslieferung voneinander trennt.

Quellenbasierter WorkflowKein Ausführungs-Benchmark

Die Arbeitsweise

Beautiful Article ist der Workflow von ConardLi von der Quelle zum Artikel. Er beginnt mit vorhandenem Material: einer Artikel-URL, Markdown, einem Dokument, einem PDF oder Screenshots. Das angestrebte Ergebnis ist ein Longform-Leseerlebnis, keine kurze Marketing-Zusammenfassung. Das extrahierte Quellenmaterial bleibt verfügbar, damit Fakten, Beispiele und technische Details während des gesamten Builds überprüft werden können.

Die Besonderheit ist, einen ersten Spread zu prüfen, bevor der gesamte Artikel entsteht. Ein Cover, ein Eröffnungsabschnitt und ein repräsentativer visueller Block legen fest, wie sich der Inhalt lesen wird. Reacticle liefert semantische Artikelkomponenten, während eine eingeschränkte benutzerdefinierte Ebene Diagramme oder andere Lesehilfen ergänzen kann. Ausgeliefert wird eine eigenständige HTML-Datei; PDF ist eine separate, auf Anfrage erzeugte Ausgabe und nicht der Standard.

Erwartete Ergebnisse

Ein eigenständiges article.html mit Inline-Styling und -Skripten
Extrahiertes Quell-Markdown und Hinweise zur Extraktionsqualität
Ein redaktioneller Plan und ein geprüfter erster Spread für den Artikel

Beispiel-Brief ansehen

Vom Brief zur Prüfung

01
Quelle wiederherstellen
Extrahieren Sie das gelieferte Material und führen Sie Buch über fehlende oder unsichere Inhalte. Schwierige PDFs und Screenshots brauchen besondere Aufmerksamkeit, bevor ihr Text zur Grundlage eines Artikels wird.
02
Das Leseerlebnis planen
Holen Sie vor dem Build getrennte Entscheidungen der Nutzer zu Artikeltyp und Informationsumfang, Theme, Layoutbreite, Bildmodus und Cover ein. Standard ist die vollständige Beibehaltung der Informationen; vereinbarte Kürzungen werden im Plan festgehalten.
03
Den ersten Spread prüfen
Erstellen Sie das freigegebene Cover, den Eröffnungsabschnitt und einen repräsentativen visuellen Block. Lassen Sie ihn von einem unabhängigen Reviewer-Agenten prüfen und pausieren Sie dann, damit der Nutzer das Muster freigibt und zwischen sequenzieller und paralleler Entwicklung wählt.
04
Fertigstellen und paketieren
Prüfen Sie jeden Abschnitt und den fertigen Artikel, beheben Sie Fehler und holen Sie dann die finale Auslieferungsentscheidung ein, bevor Sie das Offline-HTML exportieren. Die Prüfung des ersten Spreads und die Abschlussprüfung erfolgen, wenn möglich, durch unabhängige Agenten; ein Rückfall auf den Haupt-Agenten muss offengelegt werden. PDF wird nur auf Anfrage exportiert.

02 Einsatzbereiche

Wann er sich eignet

Der dokumentierte Build verwendet Node/npm, Vite, React, TypeScript und Reacticle. Für die Dokumentenextraktion und die optionale PDF-Ausgabe können zusätzliche Werkzeuge erforderlich sein; generierte Bilder benötigen ein separat verfügbares Backend.

Gut geeignet

Technische ErklärtexteNützlich, wenn Code, Formeln, Tabellen oder Vergleiche neben dem Fließtext lesbar bleiben sollen, statt in folienartige Karten gepresst zu werden.
Portable LesekopienPasst zu einem Bericht oder Essay, der als einzelne HTML-Datei geöffnet werden soll, ohne von einem laufenden Entwicklungsserver abzuhängen.

Zu prüfende Grenzen

Kein AnwendungsbaukastenDie Quelle grenzt diesen Workflow ausdrücklich von Dashboards, Formularen, allgemeinen Webanwendungen und Produktprototypen ab.
Keine automatische IllustrationExterne und generierte Bilder sind bewusste Entscheidungen. Ein Artikel ohne Bilder kann dennoch inhaltsgetriebene CSS- oder SVG-Erklärungen nutzen, ohne stillschweigend einen Bilddienst anzufragen.

Diese Eingaben mitbringen

QuellenmaterialLiefern Sie das tatsächliche Dokument oder den zugänglichen Artikel sowie alle Abschnitte, Zitate und Abbildungen, die die Umwandlung überstehen müssen.
Leserschaft und ZweckGeben Sie an, ob es sich um ein Tutorial, Briefing, eine Rezension oder einen Essay handelt und wie viel Vorwissen die vorgesehene Leserschaft hat.
Visuelle FreigabenWählen Sie gelieferte Assets, Platzhalter, generierte Bilder oder keine Bilder; nennen Sie Markenvorgaben und ob eine PDF-Ausgabe erforderlich ist.

03 Wichtige Entscheidungen

Entscheidende Weichenstellungen

Inhalt vor Dekoration
Die Quelle bleibt die Faktenreferenz, während sich die Artikelstruktur ändert. So fällt leichter auf, wenn ein ansprechendes Layout versehentlich eine notwendige Einschränkung entfernt hat.
Eine frühe Leseprobe
Ein geprüfter erster Spread testet tatsächlichen Text und Erklärblöcke, nicht nur Farben. Änderungen an Lesebreite oder visueller Dichte sind möglich, bevor jeder Abschnitt gebaut ist.

04 Beispielbriefing

Einen fokussierten Brief ausprobieren

Der folgende Beispiel-Brief wurde nicht getestet. Prüfen Sie die Einrichtung des Skills, bevor Sie ihn verwenden.

Einrichtung prüfen

Verwenden Sie das Repository-Paket des Autors mit seinen Skripten und Referenzen. Die Quelle beschreibt ein Projekt-Scaffolding, keinen verifizierten universellen Installationsbefehl.

Upstream-Quelldatei

https://github.com/ConardLi/garden-skills/blob/aaf9a82f5efd73e87cc0998edc398e75bfc35901/skills/beautiful-article/SKILL.md

Mit einem Ergebnis beginnen

Passen Sie Umfang, Quellenmaterial und Vorgaben in diesem Brief an, bevor Sie den Skill ausführen.

Beispiel-Brief

Verwende Beautiful Article, um die beigefügte Migrationsanleitung in einen Offline-HTML-Erklärtext für Frontend-Entwickler zu verwandeln. Behalte die Codebeispiele und Kompatibilitätshinweise bei, bewahre die Quellsprache und verwende keine generierten Bilder. Plane die Lesestruktur und zeige einen ersten Spread mit der Einleitung und einem Vergleichsblock, bevor du den Artikel fertigstellst. Liefere das HTML und die Extraktionshinweise; erstelle noch kein PDF.

Das Ergebnis prüfen

Prüfen Sie die tatsächliche Ausgabe anhand dieser beobachtbaren Kriterien.

Der Artikel lässt sich offline mit den vorgesehenen Stilen und Interaktionen öffnen.
Erforderliche Beispiele und Hinweise lassen sich auf die gelieferte Quelle zurückführen.
Der erste Spread und die späteren Abschnitte teilen eine lesbare Hierarchie, ohne Longform-Fließtext durch repetitive Karten zu ersetzen.

OpenDesign bietet einen lokalen Design-Workspace für Coding-Agenten. Dieser Eintrag bedeutet nicht, dass der Skill mitgeliefert wird oder dass externe Werkzeuge, Zugangsdaten und Software-Abhängigkeiten enthalten sind.

OpenDesign herunterladen Schnellstart lesen

05 Quelle und Lizenz

Quelle und Lizenz

Diese Seite beschreibt die unten verlinkte, festgelegte Quellrevision. Verhalten und Anforderungen im Upstream können sich ändern.

Quellen-Eigentümer: ConardLi
Repository: ConardLi/garden-skills
Skill-Datei: skills/beautiful-article/SKILL.md
Lizenz: MIT
Geprüfter Stand: 2026-10-07 · aaf9a82f5efd

Redaktionelle Quellenzusammenfassung

Eine redaktionelle Pipeline, die Extraktion, Artikelplanung, Freigabe des ersten Spreads, vollständige Komposition und Offline-Auslieferung voneinander trennt.

Originalzusammenfassung von OpenDesign auf Grundlage der verlinkten Quelle. Repository-Sterne sind ein datiertes Popularitätssignal, keine Skill-Nutzung und keine Qualitätsbewertung.

06 Fragen vor dem Start

Fragen vor dem Start

Fasst er die Quelle standardmäßig zusammen?

Nein. Der Workflow legt Wert darauf, die Informationen der Quelle beizubehalten. Artikeltyp und Dichte können die Behandlung verändern, doch eine Kürzung sollte eine ausdrückliche redaktionelle Entscheidung sein.

Kann er den Artikel übersetzen?

Eine Übersetzung kann angefordert werden, ansonsten bleibt die Quellsprache erhalten. Halten Sie das Originalmaterial getrennt, damit eine übersetzte Passage überprüfbar bleibt.

Ist PDF das Hauptergebnis?

Nein. Das Hauptergebnis ist eigenständiges HTML. PDF erfordert einen separaten Druckdurchgang, einschließlich Behandlung von Cover und Paginierung.

OpenDesign

Schaffen Sie Raum für die nächste Design-Iteration.

Halten Sie Brief, Quellenmaterial und Designarbeit in einem lokalen Workspace zusammen. Prüfen Sie die Einrichtung des Skills, bevor Sie ihn in Ihren Workflow aufnehmen.

OpenDesign herunterladen Design-Skills durchstöbern