distill

Simplify UI/UX designs by removing nonessential elements across five dimensions.

3|3|Updated Aug 19, 2025
One-click install
npx skills add https://github.com/StartaleGroup/app-sdk --skill distill-startalegroup
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: distill
Source: https://github.com/StartaleGroup/app-sdk/tree/main/.claude-lib/shared/skills/distill
Command: npx skills add https://github.com/StartaleGroup/app-sdk --skill distill-startalegroup

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Strip designs to their essence by removing unnecessary complexity, revealing the essential elements and creating clarity through ruthless simplification.

Core Features & Use Cases

  • MANDATORY PREPARATION: Invoke /frontend-design — it contains design principles, anti-patterns, and the Context Gathering Protocol. Follow the protocol before proceeding — if no design context exists yet, you MUST run /teach-impeccable first.
  • Assess Current State: Identify sources of complexity, distill the core goal, and determine what can be removed or simplified.
  • Plan Simplification: Outline a ruthless editing strategy focusing on core purpose, essential elements, progressive disclosure, and consolidation opportunities.
  • Simplify the Design: Apply simplifications across Information Architecture, Visual, Layout, Interaction, and Content dimensions to reduce clutter while preserving usability.
  • Verify Simplification: Ensure faster task completion, reduced cognitive load, clearer hierarchy, and preserved accessibility.
  • Document Removed Complexity: Record what was removed and why, and note any user feedback to monitor.

Quick Start

Distill a provided design by removing nonessential elements to reveal the core structure.

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 and improve visual clarity in UX design?

Simplify a cluttered UI by applying ruthless editing across information architecture, visual, layout, interaction, and content dimensions to remove extraneous complexity, enforce one primary action, and reduce cognitive load while preserving usability.

What is design simplification and when should I use it in a product design sprint?

Design simplification is the process of removing unnecessary complexity to reveal core elements and create clarity. You should use it during product design sprints, UI/UX design reviews, and design critique workflows when clutter obscures the core goal.

How do I reduce cognitive load by pruning information architecture?

Reduce cognitive load by iteratively pruning information architecture, consolidating redundant elements, and applying progressive disclosure. This ensures faster task completion, clearer hierarchy, and preserved accessibility while enforcing a single primary action.

What do I need to do before I can distill a product design for simplification?

Before distilling a product design, you must invoke a frontend design module containing the Context Gathering Protocol and design principles. If no design context exists, you are required to run a preparatory teaching workflow first to establish context.

Does ruthless simplification hurt usability or accessibility in UX design?

Ruthless simplification does not hurt usability if applied correctly. You must verify simplification by checking for faster task completion, reduced cognitive load, clearer hierarchy, and explicitly preserved accessibility after removing nonessential elements.