skills.rest
pillip
pillipCOMMUNITY
Explore all skills by this author →
GitHub

desktop-uiux

Design desktop UX systems and Electron prototypes from kickoff outputs.

11|Updated Feb 18, 2026
Search Tags:#accessibility#electron#prototype#design-system#desktop#uiux#mult-window
One-click install
npx skills add https://github.com/pillip/claude-dev-kit --skill desktop-uiux
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: desktop-uiux
Source: https://github.com/pillip/claude-dev-kit/tree/main/skills/desktop-uiux
Command: npx skills add https://github.com/pillip/claude-dev-kit --skill desktop-uiux

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

desktop-uiux enables teams to translate kickoff outputs and PRD insights into a desktop-focused design system and functional Electron prototype, reducing handoff gaps and ensuring consistency across visuals, interactions, and tokens.

Core Features & Use Cases

  • Generate a desktop design philosophy, tokens, and a reusable component set tailored for multi-window workflows and keyboard-first UX.
  • Produce wireframes, interaction specs, and a runnable Electron prototype that matches the design system.
  • Use Case: If you need a productive desktop app with native window chrome, split panes, rapid iteration, and copy guidance, this skill guides the process from kickoff to prototype.

Quick Start

Kick off by running the kickoff step to generate docs/ux_spec.md, docs/requirements.md, and docs/architecture.md, then invoke the desktop-uiux workflow to produce the design system and prototype.

Frequently Asked Questions about desktop-uiux

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

FAQPage Schema
How do I design a desktop UX system with multi-window support and keyboard-first workflows?▼

To design a desktop UX system with multi-window support, you can generate a cohesive design philosophy, tokens, and a reusable component set tailored for native desktop patterns and keyboard-first workflows.

How do I prototype a desktop app using Electron and a design system?▼

You can prototype a desktop app using Electron by translating kickoff outputs into wireframes, interaction specs, and a runnable prototype that enforces design tokens, accessibility, and IPC patterns.

What is the best way to ensure accessibility and consistent design tokens in a desktop prototype?▼

The best way to ensure accessibility and consistent design tokens in a desktop prototype is to enforce them directly within the prototype pipeline during the generation of the design system.

Can I use my existing PRD and kickoff outputs to generate a desktop design system?▼

Yes, you can use existing PRD insights and kickoff outputs to generate a desktop-focused design system, reducing handoff gaps and ensuring visual and interaction consistency.

Does this desktop UI/UX approach support platform-aware window chrome and split panes?▼

Yes, this approach supports platform-aware window chrome, split panes, and native desktop patterns to deliver a cohesive and productive desktop application experience.

What files do I need before starting the desktop UI/UX design and prototype workflow?▼

Before starting, you need to run a kickoff step to generate docs/ux_spec.md, docs/requirements.md, and docs/architecture.md to feed into the desktop UI/UX workflow.

Related Skills

Explore More Design & Creative Skills→
jtvarisjtvaris

implementation-guide

Generate a phased iOS/macOS implementation guide from PRD, architecture, UX, and design docs.

Community
Advanced
lxt070409lxt070409
1

electron-desktop-apps

Guide development, debugging, and deployment of Electron desktop applications.

Community
Advanced
ichabodcoleichabodcole

electron-vue-ipc

Design typed Electron IPC architecture across main, preload, and renderer for Vue apps.

Community
Advanced
rajavijayachrajavijayach
11

electrobun

Develop cross-platform desktop applications using TypeScript, Bun, and native OS webviews.

Community
Advanced