Skills
.Work. You
Rest

tool-ui-design

Community

Design professional, high-density tool UIs that users actually love.

Design & Creative#developer productivity#ui design#dark theme#information density#desktop tools#table & chart components#qa capture ui
Authoreaglefly628
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill helps you design desktop and developer tools with professional, information-dense UI that prioritizes usability and workflow efficiency over decoration, so expert users can operate faster with fewer mistakes.

Core Features & Use Cases

Dense, efficient UI layouts: Creates clear information hierarchy with compact typography, purposeful whitespace, and standard productivity structures (sidebar + main workspace + details panel).
Accurate interaction feedback: Defines loading/success/error feedback patterns (skeletons, toasts, confirmations for dangerous actions) and ensures discoverable keyboard shortcuts.
Reusable component standards: Provides specifications for core tool UI elements including tables, charts, forms, badges, terminals/log panels, and capture/QA-style annotation interfaces.

Quick Start

Ask for a professional dark-mode UI spec for a high-throughput QA screenshot/recording tool that includes capture preview, timeline controls, annotation tools, and an export drawer.

Dependency Matrix

Required Modules

None required

Components

Standard package

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: tool-ui-design
Download link: https://github.com/eaglefly628/captureAIshi/archive/main.zip#tool-ui-design

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.