- Add favicon.png and og-image.png with custom designs - Add og:image meta tags with dimensions and alt text - Create localized versions: Korean, Japanese, Chinese, Spanish - Update styles with language selector and responsive design
341 lines
18 KiB
HTML
341 lines
18 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="ja">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
|
||
<!-- SEO Meta Tags -->
|
||
<title>Ultrawork Manifesto | 高出力エンジニアリングの哲学</title>
|
||
<meta name="description" content="開発者とAIエンジニアが、深い集中、原子的実行、そしてUltraworkメソッドを通じて極限の生産性を達成するための哲学的フレームワーク。">
|
||
<meta name="keywords" content="ultrawork, 開発者の生産性, AIエンジニアリング, ディープワーク, 技術マニフェスト, oh my opencode, sisyphus">
|
||
<meta name="robots" content="index, follow, max-image-preview:large">
|
||
<link rel="canonical" href="https://ulw.dev/ja/">
|
||
<link rel="alternate" hreflang="en" href="https://ulw.dev/">
|
||
<link rel="alternate" hreflang="ko" href="https://ulw.dev/ko/">
|
||
<link rel="alternate" hreflang="ja" href="https://ulw.dev/ja/">
|
||
<link rel="alternate" hreflang="zh" href="https://ulw.dev/zh/">
|
||
<link rel="alternate" hreflang="es" href="https://ulw.dev/es/">
|
||
<link rel="alternate" hreflang="x-default" href="https://ulw.dev/">
|
||
<meta name="theme-color" content="#0a0a0a">
|
||
<meta name="author" content="Yeongyu Kim">
|
||
<link rel="icon" type="image/png" href="../images/favicon.png">
|
||
<link rel="apple-touch-icon" href="../images/favicon.png">
|
||
|
||
<!-- Open Graph / Facebook -->
|
||
<meta property="og:type" content="website">
|
||
<meta property="og:url" content="https://ulw.dev/ja/">
|
||
<meta property="og:title" content="Ultrawork Manifesto | 高出力エンジニアリングの哲学">
|
||
<meta property="og:description" content="開発者とAIエンジニアが、深い集中、原子的実行、そしてUltraworkメソッドを通じて極限の生産性を達成するための哲学的フレームワーク。">
|
||
<meta property="og:image" content="https://ulw.dev/images/og-image.png">
|
||
<meta property="og:image:width" content="1200">
|
||
<meta property="og:image:height" content="630">
|
||
<meta property="og:image:alt" content="Ultrawork Manifesto - 意義ある仕事への青写真">
|
||
<meta property="og:site_name" content="Ultrawork">
|
||
|
||
<!-- Twitter Card -->
|
||
<meta name="twitter:card" content="summary_large_image">
|
||
<meta name="twitter:site" content="@justsisyphus">
|
||
<meta name="twitter:creator" content="@justsisyphus">
|
||
<meta name="twitter:title" content="Ultrawork Manifesto | 高出力エンジニアリングの哲学">
|
||
<meta name="twitter:description" content="開発者とAIエンジニアが、深い集中、原子的実行、そしてUltraworkメソッドを通じて極限の生産性を達成するための哲学的フレームワーク。">
|
||
<meta name="twitter:image" content="https://ulw.dev/images/og-image.png">
|
||
|
||
<!-- Fonts -->
|
||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||
<link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400&family=Inter:wght@400;600;700&family=JetBrains+Mono:wght@400&display=swap" rel="stylesheet">
|
||
<link rel="stylesheet" href="../styles.css">
|
||
</head>
|
||
<body>
|
||
<header>
|
||
<div class="hero-container">
|
||
<img src="../images/hero.png" alt="Ultrawork Hero" class="hero-image">
|
||
<h1 class="hero-title">Ultrawork Manifesto</h1>
|
||
</div>
|
||
</header>
|
||
|
||
<main>
|
||
<!-- Section 1 -->
|
||
<section id="human-intervention">
|
||
<h2>人間の介入は失敗のシグナル</h2>
|
||
|
||
<div class="gold-gradient-text bottleneck-text">
|
||
ヒューマン・イン・ザ・ループ = ボトルネック<br>
|
||
ヒューマン・イン・ザ・ループ = ボトルネック<br>
|
||
ヒューマン・イン・ザ・ループ = ボトルネック
|
||
</div>
|
||
|
||
<p>自動運転について考えてみてください。人間がハンドルを握らなければならない時、それは機能ではなく、システムの失敗です。車がその状況を自力で処理できなかったのです。</p>
|
||
|
||
<h3>なぜコーディングは違うと言えるのでしょうか?</h3>
|
||
|
||
<p>次のような状況に陥った時:</p>
|
||
<ul>
|
||
<li>AIの中途半端なコードを修正している</li>
|
||
<li>明らかな間違いを手動で直している</li>
|
||
<li>タスクを通してエージェントを一歩一歩導いている</li>
|
||
<li>同じ要件を繰り返し説明している</li>
|
||
</ul>
|
||
|
||
<p>...それは「人間とAIの協調」ではありません。AIが仕事を果たせていないだけです。</p>
|
||
|
||
<p><strong><a href="https://github.com/code-yeongyu/oh-my-opencode" target="_blank" rel="noopener">Oh My OpenCode</a> はこの前提の上に構築されています</strong>:エージェンティックな作業への人間の介入は、根本的に誤ったシグナルです。システムが正しく設計されていれば、エージェントはあなたの子守りを必要とせず、仕事を完遂するはずです。</p>
|
||
</section>
|
||
|
||
<div class="divider">
|
||
<img src="../images/orb-divider.png" alt="Divider">
|
||
</div>
|
||
|
||
<!-- Section 2 -->
|
||
<section id="indistinguishable-code">
|
||
<h2>見分けのつかないコード</h2>
|
||
|
||
<p class="highlight-box"><strong>目標:エージェントが書いたコードは、シニアエンジニアが書いたコードと見分けがつかないものであるべきです。</strong></p>
|
||
|
||
<p>「手直しが必要なAI生成コード」ではありません。「良い出発点」でもありません。実際の、最終的な、本番環境で使えるコードです。</p>
|
||
|
||
<p>これは以下を意味します:</p>
|
||
<ul>
|
||
<li>既存のコードベースのパターンに正確に従う</li>
|
||
<li>指示されなくても適切なエラーハンドリングを行う</li>
|
||
<li>実際に正しいことをテストするテストコード</li>
|
||
<li>AIによる粗雑なコード(オーバーエンジニアリング、不必要な抽象化、スコープクリープ)がない</li>
|
||
<li>価値がある場合にのみコメントを追加する</li>
|
||
</ul>
|
||
|
||
<p>コミットが人間によるものかエージェントによるものか見分けがつくなら、そのエージェントは失敗しています。</p>
|
||
</section>
|
||
|
||
<div class="divider">
|
||
<img src="../images/orb-divider.png" alt="Divider">
|
||
</div>
|
||
|
||
<!-- Section 3 -->
|
||
<section id="token-cost">
|
||
<h2>トークンコスト vs 生産性</h2>
|
||
|
||
<p><strong>生産性を著しく向上させるのであれば、より高いトークン使用量は許容されます。</strong></p>
|
||
|
||
<p>より多くのトークンを使って:</p>
|
||
<ul>
|
||
<li>複数の専門エージェントに並行して調査させる</li>
|
||
<li>人間の介入なしに仕事を完全に終わらせる</li>
|
||
<li>完了前に作業を徹底的に検証する</li>
|
||
<li>タスクを超えて知識を蓄積する</li>
|
||
</ul>
|
||
|
||
<p>...これらは、10倍、20倍、あるいは100倍の生産性向上を意味するのであれば、価値ある投資です。</p>
|
||
|
||
<h3>しかし:</h3>
|
||
|
||
<p>不必要なトークンの浪費は追求しません。システムは以下に向けて最適化されます:</p>
|
||
<ul>
|
||
<li>単純なタスクには安価なモデル(Haiku, Flash)を使用する</li>
|
||
<li>重複する探索を避ける</li>
|
||
<li>セッション間で学習内容をキャッシュする</li>
|
||
<li>十分なコンテキストが集まったら調査を停止する</li>
|
||
</ul>
|
||
|
||
<p>トークン効率は重要です。しかし、仕事の質や人間の認知的負荷を犠牲にしてまで優先されるべきではありません。</p>
|
||
</section>
|
||
|
||
<div class="divider">
|
||
<img src="../images/orb-divider.png" alt="Divider">
|
||
</div>
|
||
|
||
<!-- Section 4 -->
|
||
<section id="cognitive-load">
|
||
<h2>人間の認知的負荷を最小化する</h2>
|
||
|
||
<p><strong>人間は「何が欲しいか」を言うだけでいいはずです。それ以外はすべてエージェントの仕事です。</strong></p>
|
||
|
||
<p>これを達成するための2つのアプローチ:</p>
|
||
|
||
<div class="approach-container">
|
||
<div class="approach ultrawork-approach">
|
||
<h3>アプローチ 1: Ultrawork</h3>
|
||
<p class="approach-tagline">ただ "ulw" と言って立ち去るだけ。</p>
|
||
<p>あなたの発言: <code>ulw add authentication</code></p>
|
||
<p>エージェントは自律的に:</p>
|
||
<ul>
|
||
<li>コードベースのパターンとアーキテクチャを分析する</li>
|
||
<li>公式ドキュメントからベストプラクティスを調査する</li>
|
||
<li>実装戦略を内部的に計画する</li>
|
||
<li>既存の規約に従って実装する</li>
|
||
<li>テストとLSP診断で検証する</li>
|
||
<li>何か問題があれば自己修正する</li>
|
||
<li><strong>100%完了するまで岩を押し続ける</strong></li>
|
||
</ul>
|
||
<p class="approach-summary"><strong>介入ゼロ。完全な自律性。結果だけを。</strong></p>
|
||
</div>
|
||
|
||
<div class="approach prometheus-approach">
|
||
<h3>アプローチ 2: Prometheus + Atlas</h3>
|
||
<p class="approach-tagline">戦略的なコントロールが必要な時。</p>
|
||
<p><kbd>Tab</kbd>を押してエージェントを切り替えた後: <code>add authentication</code></p>
|
||
<p><strong>Prometheus</strong> (戦略プランナー):</p>
|
||
<ul>
|
||
<li>並列エージェントを通じて深いコードベース調査を行う</li>
|
||
<li>知的で文脈に沿った質問であなたにインタビューする</li>
|
||
<li>エッジケースとアーキテクチャへの影響を特定する</li>
|
||
<li>依存関係を含む詳細なYAML作業計画を生成する</li>
|
||
</ul>
|
||
<p><strong>Atlas</strong> (マスターオーケストレーター):</p>
|
||
<ul>
|
||
<li><code>/start-work</code> を通じて計画を実行する</li>
|
||
<li>専門エージェント(Oracle, Frontend Engineerなど)にタスクを委譲する</li>
|
||
<li>効率のために並列実行の波を管理する</li>
|
||
<li>進捗を追跡し、失敗を処理し、完了を保証する</li>
|
||
</ul>
|
||
<p class="approach-summary"><strong>あなたが設計し、エージェントが実行する。完全な透明性。</strong></p>
|
||
</div>
|
||
</div>
|
||
|
||
<p>どちらの場合も、人間の仕事は<strong>何が欲しいかを表現すること</strong>であり、どうやってそれを実現するかを管理することではありません。</p>
|
||
</section>
|
||
|
||
<div class="divider">
|
||
<img src="../images/orb-divider.png" alt="Divider">
|
||
</div>
|
||
|
||
<!-- Section 5 -->
|
||
<section id="predictable-continuous">
|
||
<h2>予測可能、継続的、委譲可能</h2>
|
||
|
||
<p><strong>理想的なエージェントはコンパイラのように動作すべきです</strong>:Markdownドキュメントを入力すれば、動作するコードが出力されるのです。</p>
|
||
|
||
<h3>予測可能</h3>
|
||
<p>同じ入力があれば:</p>
|
||
<ul>
|
||
<li>同じコードベースのパターン</li>
|
||
<li>同じ要件</li>
|
||
<li>同じ制約</li>
|
||
</ul>
|
||
<p>...出力は一貫しているべきです。ランダムでも、驚くようなものでもなく、頼んでもいない「創造的」なものであってはなりません。</p>
|
||
|
||
<h3>継続的</h3>
|
||
<p>作業は中断に耐えうるべきです:</p>
|
||
<ul>
|
||
<li>セッションがクラッシュした? <code>/start-work</code> で再開</li>
|
||
<li>席を外す必要がある? 進捗は追跡されています</li>
|
||
<li>数日にわたるプロジェクト? コンテキストは保持されます</li>
|
||
</ul>
|
||
<p>エージェントが状態を維持します。あなたがする必要はありません。</p>
|
||
|
||
<h3>委譲可能</h3>
|
||
<p>優秀なチームメンバーにタスクを割り当てて任せることができるように、エージェントにも委譲できるべきです。</p>
|
||
<p>これは以下を意味します:</p>
|
||
<ul>
|
||
<li>明確な受け入れ基準、独立して検証される</li>
|
||
<li>何か問題が起きた時の自己修正動作</li>
|
||
<li>本当に必要な時だけの(Oracleやユーザーへの)エスカレーション</li>
|
||
<li>「ほぼ完了」ではなく、完全な仕事</li>
|
||
</ul>
|
||
</section>
|
||
|
||
<div class="divider">
|
||
<img src="../images/orb-divider.png" alt="Divider">
|
||
</div>
|
||
|
||
<!-- Section 6 -->
|
||
<section id="core-loop">
|
||
<h2>コアループ</h2>
|
||
|
||
<div class="ascii-art">
|
||
人間の意図 → エージェントの実行 → 検証された結果
|
||
↑ ↓
|
||
└────────── 最小限 ────────────┘
|
||
(真の失敗時のみ介入)
|
||
</div>
|
||
|
||
<p>[Oh My OpenCode](https://github.com/code-yeongyu/oh-my-opencode) のすべては、このループを機能させるために設計されています:</p>
|
||
|
||
<table>
|
||
<thead>
|
||
<tr>
|
||
<th>機能</th>
|
||
<th>目的</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td>Prometheus</td>
|
||
<td>知的なインタビューを通じて意図を抽出する</td>
|
||
</tr>
|
||
<tr>
|
||
<td>Metis</td>
|
||
<td>バグになる前に曖昧さを捉える</td>
|
||
</tr>
|
||
<tr>
|
||
<td>Momus</td>
|
||
<td>実行前に計画が完全であることを検証する</td>
|
||
</tr>
|
||
<tr>
|
||
<td>Orchestrator</td>
|
||
<td>人間のマイクロマネジメントなしに作業を調整する</td>
|
||
</tr>
|
||
<tr>
|
||
<td>Todo Continuation</td>
|
||
<td>完了を強制し、「終わりました」という嘘を防ぐ</td>
|
||
</tr>
|
||
<tr>
|
||
<td>Category System</td>
|
||
<td>人間の判断なしに最適なモデルへルーティングする</td>
|
||
</tr>
|
||
<tr>
|
||
<td>Background Agents</td>
|
||
<td>ユーザーをブロックせずに並列調査を行う</td>
|
||
</tr>
|
||
<tr>
|
||
<td>Wisdom Accumulation</td>
|
||
<td>作業から学び、過ちを繰り返さない</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</section>
|
||
|
||
<div class="divider">
|
||
<img src="../images/orb-divider.png" alt="Divider">
|
||
</div>
|
||
|
||
<!-- Section 7 -->
|
||
<section id="future">
|
||
<h2>私たちが築く未来</h2>
|
||
|
||
<p>次のような世界:</p>
|
||
<ul>
|
||
<li>人間の開発者は、AIにどう作らせるかではなく、<strong>何を</strong>作るかに集中する</li>
|
||
<li>コードの品質は、誰が(あるいは何が)書いたかとは無関係である</li>
|
||
<li>複雑なプロジェクトも単純なプロジェクトと同じくらい簡単になる(ただ時間がかかるだけ)</li>
|
||
<li>「プロンプトエンジニアリング」が「コンパイラデバッグ」と同じくらい時代遅れになる</li>
|
||
</ul>
|
||
|
||
<p><strong>エージェントは不可視であるべきです。</strong> 隠されているという意味ではなく、電気や水道、インターネットのように、ただ当たり前に機能するという意味で。</p>
|
||
|
||
<p>スイッチを入れる。明かりがつく。送電網のことなど考えもしない。</p>
|
||
|
||
<p class="final-statement">それが目標です。</p>
|
||
</section>
|
||
</main>
|
||
|
||
<footer>
|
||
<div class="footer-content">
|
||
<a href="https://github.com/code-yeongyu/oh-my-opencode" class="cta-link" target="_blank" rel="noopener">
|
||
Oh My OpenCode を入手 →
|
||
</a>
|
||
<p><strong>just ulw ulw</strong></p>
|
||
|
||
<nav class="language-selector" aria-label="Language selection">
|
||
<span class="language-selector-label">Language</span>
|
||
<div class="language-links">
|
||
<a href="../" class="language-link" lang="en">English</a>
|
||
<a href="../ko/" class="language-link" lang="ko">한국어</a>
|
||
<a href="./" class="language-link active" lang="ja">日本語</a>
|
||
<a href="../zh/" class="language-link" lang="zh">简体中文</a>
|
||
<a href="../es/" class="language-link" lang="es">Español</a>
|
||
</div>
|
||
</nav>
|
||
</div>
|
||
</footer>
|
||
</body>
|
||
</html> |