diff --git a/ultrawork-manifesto-web/public/images/footer-pattern.png b/ultrawork-manifesto-web/public/images/footer-pattern.png new file mode 100644 index 000000000..19ddf94fb Binary files /dev/null and b/ultrawork-manifesto-web/public/images/footer-pattern.png differ diff --git a/ultrawork-manifesto-web/public/images/hero.png b/ultrawork-manifesto-web/public/images/hero.png new file mode 100644 index 000000000..b49b03037 Binary files /dev/null and b/ultrawork-manifesto-web/public/images/hero.png differ diff --git a/ultrawork-manifesto-web/public/images/orb-divider.png b/ultrawork-manifesto-web/public/images/orb-divider.png new file mode 100644 index 000000000..df679491f Binary files /dev/null and b/ultrawork-manifesto-web/public/images/orb-divider.png differ diff --git a/ultrawork-manifesto-web/src/index.html b/ultrawork-manifesto-web/src/index.html new file mode 100644 index 000000000..245cb2c77 --- /dev/null +++ b/ultrawork-manifesto-web/src/index.html @@ -0,0 +1,281 @@ + + + + + + Ultrawork Manifesto + + + + + + +
+
+ Ultrawork Hero +

Manifesto

+
+
+ +
+ +
+

Human Intervention is a Failure Signal

+ +
+ HUMAN IN THE LOOP = BOTTLENECK
+ HUMAN IN THE LOOP = BOTTLENECK
+ HUMAN IN THE LOOP = BOTTLENECK +
+ +

Think about autonomous driving. When a human has to take over the wheel, that's not a feature - it's a failure of the system. The car couldn't handle the situation on its own.

+ +

Why is coding any different?

+ +

When you find yourself:

+ + +

...that's not "human-AI collaboration." That's the AI failing to do its job.

+ +

Oh My OpenCode is built on this premise: Human intervention during agentic work is fundamentally a wrong signal. If the system is designed correctly, the agent should complete the work without requiring you to babysit it.

+
+ +
+ Divider +
+ + +
+

Indistinguishable Code

+ +

Goal: Code written by the agent should be indistinguishable from code written by a senior engineer.

+ +

Not "AI-generated code that needs cleanup." Not "a good starting point." The actual, final, production-ready code.

+ +

This means:

+ + +

If you can tell whether a commit was made by a human or an agent, the agent has failed.

+
+ +
+ Divider +
+ + +
+

Token Cost vs. Productivity

+ +

Higher token usage is acceptable if it significantly increases productivity.

+ +

Using more tokens to:

+ + +

...is a worthwhile investment when it means 10x, 20x, or 100x productivity gains.

+ +

However:

+ +

Unnecessary token waste is not pursued. The system optimizes for:

+ + +

Token efficiency matters. But not at the cost of work quality or human cognitive load.

+
+ +
+ Divider +
+ + +
+

Minimize Human Cognitive Load

+ +

The human should only need to say what they want. Everything else is the agent's job.

+ +

Two approaches to achieve this:

+ +
+
+

Approach 1: Prometheus (Interview Mode)

+

You say: "I want to add authentication."

+

Prometheus:

+
    +
  • Researches your codebase to understand existing patterns
  • +
  • Asks clarifying questions based on actual findings
  • +
  • Surfaces edge cases you hadn't considered
  • +
  • Documents decisions as you make them
  • +
  • Generates a complete work plan
  • +
+

You provide intent. The agent provides structure.

+
+ +
+

Approach 2: Ultrawork (Just Do It Mode)

+

You say: "ulw add authentication"

+

The agent:

+
    +
  • Figures out the right approach
  • +
  • Researches best practices
  • +
  • Implements following conventions
  • +
  • Verifies everything works
  • +
  • Keeps going until complete
  • +
+

You provide intent. The agent handles everything.

+
+
+ +

In both cases, the human's job is to express what they want, not to manage how it gets done.

+
+ +
+ Divider +
+ + +
+

Predictable, Continuous, Delegatable

+ +

The ideal agent should work like a compiler: markdown document goes in, working code comes out.

+ +

Predictable

+

Given the same inputs:

+ +

...the output should be consistent. Not random, not surprising, not "creative" in ways you didn't ask for.

+ +

Continuous

+

Work should survive interruptions:

+ +

The agent maintains state. You don't have to.

+ +

Delegatable

+

Just like you can assign a task to a capable team member and trust them to handle it, you should be able to delegate to the agent.

+

This means:

+ +
+ +
+ Divider +
+ + +
+

The Core Loop

+ +
+Human Intent → Agent Execution → Verified Result + ↑ ↓ + └──────── Minimum ─────────────┘ + (intervention only on true failure) +
+ +

Everything in Oh My OpenCode is designed to make this loop work:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
FeaturePurpose
PrometheusExtract intent through intelligent interview
MetisCatch ambiguities before they become bugs
MomusVerify plans are complete before execution
OrchestratorCoordinate work without human micromanagement
Todo ContinuationForce completion, prevent "I'm done" lies
Category SystemRoute to optimal model without human decision
Background AgentsParallel research without blocking user
Wisdom AccumulationLearn from work, don't repeat mistakes
+
+ +
+ Divider +
+ + +
+

The Future We're Building

+ +

A world where:

+ + +

The agent should be invisible. Not in the sense that it's hidden, but in the sense that it just works - like electricity, like running water, like the internet.

+ +

You flip the switch. The light turns on. You don't think about the power grid.

+ +

That's the goal.

+
+
+ + + + \ No newline at end of file diff --git a/ultrawork-manifesto-web/src/styles.css b/ultrawork-manifesto-web/src/styles.css new file mode 100644 index 000000000..d5799da42 --- /dev/null +++ b/ultrawork-manifesto-web/src/styles.css @@ -0,0 +1,336 @@ +/* Design System */ +:root { + /* Colors */ + --bg-primary: #0a0a0a; + --bg-secondary: #0E1115; + --text-primary: #ffffff; + --text-muted: #99A1AF; + --text-dim: #6A7282; + --accent: #87F0F2; + --accent-glow: #ABF5F7; + + /* Gold gradient for emphasis */ + --gold-gradient: linear-gradient(180deg, #f0daaf 0%, #e4c380 50%, #5d5135 100%); + + /* Typography */ + --font-primary: 'Inter', system-ui, sans-serif; + --font-mono: 'JetBrains Mono', monospace; + + /* Layout */ + --max-width: 800px; + --spacing-section: 80px; +} + +/* Reset & Base Styles */ +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} + +body { + background-color: var(--bg-primary); + color: var(--text-primary); + font-family: var(--font-primary); + line-height: 1.6; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +/* Typography */ +h1, h2, h3 { + font-weight: 700; + line-height: 1.2; + margin-bottom: 1.5rem; +} + +h1 { + font-size: 3.5rem; + letter-spacing: -0.02em; +} + +h2 { + font-size: 2.5rem; + color: var(--text-primary); + margin-bottom: 2rem; + letter-spacing: -0.01em; +} + +h3 { + font-size: 1.5rem; + color: var(--accent); + margin-top: 2rem; + margin-bottom: 1rem; +} + +p { + margin-bottom: 1.5rem; + color: var(--text-muted); + font-size: 1.125rem; +} + +strong { + color: var(--text-primary); + font-weight: 600; +} + +ul { + list-style: none; + margin-bottom: 2rem; + padding-left: 1.5rem; +} + +ul li { + position: relative; + margin-bottom: 0.75rem; + color: var(--text-muted); + font-size: 1.125rem; +} + +ul li::before { + content: "→"; + position: absolute; + left: -1.5rem; + color: var(--accent); +} + +code { + font-family: var(--font-mono); + background: var(--bg-secondary); + padding: 0.2em 0.4em; + border-radius: 4px; + font-size: 0.9em; + color: var(--accent); +} + +/* Layout */ +header { + position: relative; + width: 100%; + height: 60vh; + min-height: 400px; + overflow: hidden; + display: flex; + align-items: center; + justify-content: center; + margin-bottom: var(--spacing-section); +} + +.hero-container { + position: relative; + width: 100%; + height: 100%; + display: flex; + align-items: center; + justify-content: center; +} + +.hero-image { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + object-fit: cover; + opacity: 0.6; + mask-image: linear-gradient(to bottom, black 50%, transparent 100%); + -webkit-mask-image: linear-gradient(to bottom, black 50%, transparent 100%); +} + +.hero-title { + position: relative; + z-index: 1; + font-size: 5rem; + text-transform: uppercase; + letter-spacing: 0.1em; + text-shadow: 0 0 30px rgba(135, 240, 242, 0.3); + animation: fadeIn 1.5s ease-out; +} + +main { + max-width: var(--max-width); + margin: 0 auto; + padding: 0 2rem; +} + +section { + margin-bottom: var(--spacing-section); +} + +/* Components */ +.divider { + display: flex; + justify-content: center; + margin: var(--spacing-section) 0; + opacity: 0.5; +} + +.divider img { + width: 100px; + height: auto; +} + +/* Specific Styles */ +.gold-gradient-text { + font-family: var(--font-mono); + font-weight: 700; + font-size: 1.5rem; + line-height: 1.4; + background: var(--gold-gradient); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; + background-clip: text; + margin-bottom: 2rem; + text-align: center; + border: 1px solid rgba(240, 218, 175, 0.2); + padding: 2rem; + border-radius: 8px; + background-color: rgba(240, 218, 175, 0.05); +} + +.highlight-box { + background: var(--bg-secondary); + border-left: 4px solid var(--accent); + padding: 1.5rem; + border-radius: 0 8px 8px 0; + font-size: 1.25rem; + color: var(--text-primary); +} + +.approach-container { + display: grid; + grid-template-columns: 1fr; + gap: 2rem; + margin: 2rem 0; +} + +@media (min-width: 768px) { + .approach-container { + grid-template-columns: 1fr 1fr; + } +} + +.approach { + background: var(--bg-secondary); + padding: 2rem; + border-radius: 12px; + border: 1px solid rgba(255, 255, 255, 0.05); + transition: transform 0.3s ease, box-shadow 0.3s ease; +} + +.approach:hover { + transform: translateY(-5px); + box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5); + border-color: rgba(135, 240, 242, 0.2); +} + +.ascii-art { + font-family: var(--font-mono); + white-space: pre; + overflow-x: auto; + background: var(--bg-secondary); + padding: 2rem; + border-radius: 8px; + color: var(--accent); + margin-bottom: 2rem; + font-size: 0.9rem; + line-height: 1.4; + border: 1px solid rgba(135, 240, 242, 0.1); +} + +/* Table */ +table { + width: 100%; + border-collapse: collapse; + margin: 2rem 0; + background: var(--bg-secondary); + border-radius: 8px; + overflow: hidden; +} + +th, td { + padding: 1rem 1.5rem; + text-align: left; + border-bottom: 1px solid rgba(255, 255, 255, 0.05); +} + +th { + background: rgba(135, 240, 242, 0.05); + color: var(--accent); + font-weight: 600; + text-transform: uppercase; + font-size: 0.85rem; + letter-spacing: 0.05em; +} + +td { + color: var(--text-muted); +} + +tr:last-child td { + border-bottom: none; +} + +tr:hover td { + background: rgba(255, 255, 255, 0.02); + color: var(--text-primary); +} + +/* Footer */ +footer { + margin-top: var(--spacing-section); + padding: 4rem 0; + background: linear-gradient(to top, #000 0%, transparent 100%); + text-align: center; + position: relative; +} + +.footer-content { + display: flex; + flex-direction: column; + align-items: center; + gap: 2rem; +} + +.footer-pattern { + width: 100%; + max-width: 1200px; + height: auto; + opacity: 0.3; + mask-image: linear-gradient(to bottom, transparent, black 20%, black 80%, transparent); + -webkit-mask-image: linear-gradient(to bottom, transparent, black 20%, black 80%, transparent); +} + +.final-statement { + font-size: 2rem; + font-weight: 700; + color: var(--text-primary); + text-align: center; + margin-top: 3rem; + letter-spacing: -0.02em; +} + +/* Animations */ +@keyframes fadeIn { + from { opacity: 0; transform: translateY(20px); } + to { opacity: 1; transform: translateY(0); } +} + +/* Scrollbar */ +::-webkit-scrollbar { + width: 8px; + height: 8px; +} + +::-webkit-scrollbar-track { + background: var(--bg-primary); +} + +::-webkit-scrollbar-thumb { + background: var(--bg-secondary); + border-radius: 4px; +} + +::-webkit-scrollbar-thumb:hover { + background: var(--text-dim); +}