AI Agent Skill

Museum of the Essential

A specialized design system for AI agents to build calm, high-quality web interfaces. We use the principles of modernism to remove visual noise and focus on what truly matters: the user's content.

6 Axioms 7 Case Studies 4 Pillars

The Origins

Minimalism isn't just an aesthetic; it's a structural necessity. These are the classic ideas that taught us how to design with purpose.

The Architect

Ludwig Mies van der Rohe

"Less is more."

Mies spent his career proving that stripping away decoration doesn't make a design "empty"—it makes it clearer. By focusing on essential materials and open space, he showed us how to reveal the true character of a project.

Design for the Web: Clarity over Decoration

In modern web development, this means removing every border, shadow, and icon that isn't helping the user complete their task. We let the typography and the whitespace do the work of guiding the eye.

This content block uses nothing but whitespace and a single vertical line to establish its presence. There are no shadows or borders to distract you from the text.

Keep your HTML clean and your CSS focused:
<div class="content-block">
    <p>Pure content. No noise.</p>
</div>
The Functionalist

Louis Sullivan

"Form follows function."

Sullivan believed that the shape of anything—a building, a tool, or a website—should come directly from what it's supposed to do. If a feature doesn't serve the user's goal, it shouldn't exist.

Honest Materials: Semantic Structure

Web 'materials' are HTML tags. An interactive element should be a <button>, not a div with an event listener. When we use the right tags for the right jobs, our code becomes simpler, more accessible, and easier to maintain.

A button should look and act like a button:
<nav>
    <button class="primary">Action</button>
    <a href="...">Link</a>
</nav>
The Minimalists

Dieter Rams & Jony Ive

"Less but better."

Dieter Rams defined the principles of good design as being useful, understandable, and as subtle as possible. Jony Ive brought this systemic simplicity to the screens we use every day.

Instinctive Design: Removing Friction

Great interfaces feel natural. We achieve this by using consistent patterns and removing anything that creates "visual friction." The goal is a design that requires no explanation.

Clear labels and focused inputs:
<label for="search">Search</label>
<input type="text" id="search" class="input">

The Way We Think

How we translate these classic principles into modern web design decisions.

Our Framework

Axioms of the Essential

These are the universal rules we use to judge every design choice. We move beyond "style" and into the realm of architectural logic for the web.

  • Justification: Every pixel must have a reason to be there.
  • Typographic Dominance: If the fonts are right, the interface is done.
  • Material Honesty: We don't pretend digital elements have physical depth.
  • The Silent Grid: We use alignment to create order, not lines or boxes.
  • Proximity and Void: Whitespace is your most powerful structural tool. Use it actively to group, separate, and guide the eye.
  • Paradox of Choice: Limit options to increase clarity and intent. Fewer choices lead to better decisions and faster actions.

All 6 Axioms in Practice

Axioms 1–4 are demonstrated through the designer profiles above: Justification and The Silent Grid through Mies van der Rohe, Material Honesty through Sullivan, Typographic Dominance through Rams & Ive. The two remaining axioms require a direct visual comparison to be fully understood:

Axiom 5 — Proximity and Void
Cramped

User name

mikel@example.com

Active account

Member since 2021

Essential

Mikel Aramendia

mikel@example.com · Active · 2021

Axiom 6 — Paradox of Choice
Curated
Work About Contact

Case Studies

Seven real UI patterns, compared side by side. The noisy way versus the essential way — same content, radically different clarity.

Case Study 01
The Information Card

Reducing the container to amplify the content.

The Noisy Way
✨
Project Alpha

Active Status

The Essential Way

Active

Project Alpha
Case Study 02
Global Navigation

Curation over decoration. Utility over distraction.

The Noisy Way
The Essential Way
Case Study 03
The Silent Checkout

Removing anxiety through typographic clarity.

The Noisy Way
⚠️ CRITICAL ERROR: INVALID EMAIL FORMAT
The Essential Way
Please enter a valid email.
Case Study 04
Product Specifications

Using alignment and typography to create structure without borders.

The Noisy Way
Weight1.2kg
Size240mm
ColorGraphite
The Essential Way
Weight1.2kg
Size240mm
ColorGraphite
Case Study 05
Search & Discovery

Filtering as a thought process, not a technical operation.

The Noisy Way
All Categories
New Items
The Essential Way
All New Archived
Case Study 06
Purposeful Animation

Motion should confirm an action, not decorate a page. Hover both buttons.

The Noisy Way
Bounces & glows on hover — always
The Essential Way
Only animates to confirm the action
Case Study 07
Color Restraint

Color as semantic signal, not decoration. One accent color, used only to communicate state.

The Noisy Way
Dashboard Overview
New Sale Hot Info

The Essential Way

Dashboard

New items 12
Active sales 3
Status Nominal

How to Use It

This design philosophy is built directly into an AI-powered agent skill for developers.

The Method

The Substractive Pass

Before finalizing any interface, run this three-step process. It is not a style guide — it is a quality filter that transforms functional layouts into essential ones.

01 — Identify
Find the Noise

Scan for shadows, decorative gradients, redundant icons, unnecessary borders, and anything that exists for visual richness rather than function.

→
02 — Remove
Delete & Re-evaluate

Remove each noisy element. If the interface still communicates the same information, the element was unnecessary. Leave it out.

→
03 — Refine
Restore with Type & Space

Compensate for the removed noise by improving typographic hierarchy, line-height, letter-spacing, and whitespace. Structure through rhythm.

For Developers

AI Agent Integration

Designing is a rational process, not a decorative one. For an AI agent, minimalism is a functional choice: by reducing visual noise, we simplify the experience for both the machine and the human user.

Getting Started

This skill provides your AI agent with a curated set of rules, references, and a custom design system. It allows you to skip the "generic" web look and build professional, focused interfaces by default.

Installation
npx skills add Mendiak/less-is-more-ui
Talk to your agent like a design partner:
"Apply the less-is-more-ui principles to this layout.
Prioritize the typography and remove all the noise."