distill

Simplifies UI designs by removing unnecessary elements, visual noise, and redundant content.

Updated Mar 28, 2026
One-click install
npx skills add https://github.com/po4yka/blog --skill distill-po4yka
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: distill
Source: https://github.com/po4yka/blog/tree/main/.agents/skills/distill
Command: npx skills add https://github.com/po4yka/blog --skill distill-po4yka

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Interfaces often accumulate clutter over time: competing buttons, excessive colors, redundant copy, and nested containers that confuse users and slow task completion. This Skill provides a structured method to strip a design down to its essential elements without sacrificing functionality or accessibility. ## Core Features & Use Cases - Complexity Assessment: Identifies sources of clutter such as visual noise, information overload, unclear hierarchy, and feature creep before making changes. - Multi-Dimensional Simplification: Systematically reduces complexity across information architecture, visual styling, layout, interactions, content, and code structure. - Guardrails Against Over-Simplification: Enforces explicit NEVER rules so necessary functionality, accessibility, and decision-critical information are preserved. - Use Case: A settings page has grown to twelve options, three card layers, and five competing CTAs. Use this Skill to consolidate related actions, apply progressive disclosure, flatten the layout, and leave one clear primary action. ## Quick Start Ask the AI to distill the current page or component by removing clutter and reducing it to its essential elements.

Frequently Asked Questions about distill

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I simplify a cluttered UI design?

Start by identifying complexity sources such as too many elements, excessive color variation, and unclear hierarchy. Then reduce scope with progressive disclosure, limit the palette to 1-2 colors plus neutrals, and keep one clear primary action per view.

How to reduce visual clutter in a web page?

Remove decorative borders, shadows, and backgrounds that do not serve hierarchy or function. Flatten nested containers, avoid cards inside cards, use one consistent spacing scale, and let generous white space separate content.

Does simplifying a UI mean removing features?

No. Simplification removes obstacles between users and their goals, not necessary functionality. Features can be hidden behind progressive disclosure like accordions or step-through flows, but everything users need must remain accessible.

When should I not simplify a design further?

Stop when further reduction would remove information users need to make decisions, harm accessibility, or make the interface unclear. Complex domains should keep complexity matched to the actual task rather than being oversimplified.

How do I verify a simplified design is actually better?

Check whether users complete tasks faster, cognitive load is reduced, and the hierarchy makes the most important element obvious. Confirm all necessary features remain accessible and document anything removed along with the reasoning.