素材を用意する
はじめる
1つのプロンプトから
OpenPressは初めてですか?スキルをインストールし、エージェントを再起動して、ワークスペースを作成するよう依頼してください。CLIは最初のページを見てから学習できます。
初心者向けパス
- OpenPressスキルをインストールします。
npx -y skills@latest add quan0715/open-press - エージェントに依頼します。 メモからOpenPressドキュメントを作成してください。ワークスペースをセットアップし、プレビューを実行し、編集する箇所を教えてください。
仕組み
概要から出版まで。
OpenPressは単なるクリエイティブスキルではありません。ドキュメントに実際のページ、ソース管理、繰り返し可能な出力が必要な場合に、これらのスキルが依存できる共有ワークスペースです。
エージェントに形作らせる
ストーリー、セクション、ページコンポーネント
エージェントは概要をMDX、TSXコンポーネント、テーマトークン、メディアの選択肢に変換します。OpenPressで仕上げる
検査、編集、検証、エクスポート
OpenPressはソースを編集可能に保ち、固定ページをレンダリングし、PNG、PDF、またはWebリーダーを出力します。違い
DOMツリー vs Pressツリー
AIはHTMLを生成できます。OpenPressは、ページ、コンポーネント、MDXソースを検査可能な状態に保つ、ドキュメントの形をしたアプリツリーをエージェントに提供します。
DOM Tree Context
14,200 tk / page
Press Tree Context
180 tk / page
Token Reduction
-98.7%
HTML-to-document
Generated DOM tree
<html lang="en">
<body>
<main class="generated-document">
<!-- page split: cover -->
<section class="page page-01">
<header><a href="/">OpenPress</a></header>
<h1>Urban heat and street shade</h1>
<p>Lead paragraph generated directly into layout markup.</p>
<figure><img src="cover.png" alt="" /></figure>
<footer>01 / 12</footer>
</section>
<!-- page split: chapter text -->
<section class="page page-02">
<article class="chapter">
<h2>1. Morning surface temperature</h2>
<p>Paragraph copied into the page body.</p>
<p>Another paragraph with <a href="#note-1">a note link</a>.</p>
<ul><li>shade</li><li>asphalt</li></ul>
</article>
</section>
<!-- page split: generated table -->
<section class="page page-03">
<table>
<thead><tr><th>Time</th><th>Shade</th><th>Delta</th></tr></thead>
<tbody>
<tr><td>09:00</td><td>partial</td><td>-2.1C</td></tr>
<tr><td>12:00</td><td>none</td><td>+6.4C</td></tr>
</tbody>
</table>
</section>
<!-- ... page-04 to page-12 repeat heavy layout markup -->
</main>
</body>
</html>
OpenPress
Press tree + sources
<Workspace name="Heat Study">
<Press title="Urban Heat" page="A4"
sources={[mdxSource("chapters"), mediaSource("figures")]}>
// page sequence stays explicit
</Press>
</Workspace>
press/
index.tsx
chapters/cover.mdx
chapters/01-morning.mdx
components/ChapterPage.tsx
theme/print.css
なぜ存在するのか
1つの基本契約。
開発者は、HTMLからドキュメント、ドキュメントからPPT、ソーシャル投稿のフローを別々のツールで再構築しています。OpenPressは、これらのフローに共有の、人間が編集可能なワークスペースを提供します。
コーディングエージェントは、スキル、プロンプト、ソースファイルからワークスペースを操作します。
ページ、スライド、MDXセクション、テーマ、コメント、および出力の共通ベース。
ソースをレビューし、コピーを調整し、レイアウトの決定を可視化したままにし、再度レンダリングします。
スクリーンショットや生成されたHTMLにパッチを当てないでください。ソースを修正し、OpenPressを通じてエクスポートしてください。
press/index.tsx press/chapters/intro.mdx press/components/SectionPage.tsx press/theme/base.css press/media/cover.png @openpress-comment tighten this section before exporting
人間とのコラボレーション
読みやすいソース。レンダリングされたページ。
エージェントは最終的なスクリーンショットではなく、ワークスペースを編集します。コメント、MDXの章、ローカルコンポーネント、テーマトークンは可視化されたままであるため、人間が結果をレビューし、調整することができます。
出力形式
ページ / スライド / バズ
1つの編集可能なワークスペースを、洗練されたページ、プレゼンテーションスライド、ソーシャル向けビジュアルに変換します。ストーリーをソースに保持し、対象者が必要とする形式でエクスポートします。
エージェントと協力する
スキルからのセンス。OpenPressからのワークスペース。
ソーシャルカードスキル、講義ノートスキル、または論文作成スキルは、ワークフローと入門例を選択できます。OpenPressは、その下のランタイム(ワークスペース、固定ページ、ソース、プレビュー、検証、エクスポート)を提供します。
エージェントワークフローを読む