skills.rest
binggg
bingggCOMMUNITY
Explore all skills by this author →
𝕏@being99GitHub

ui-design

Create frontend UI design specifications covering color, typography, layout, and accessibility.

1|Updated Dec 1, 2025
Search Tags:#typography#frontend#prototyping#ui design#color-palette#design-guidelines#aesthetic-direction
One-click install
npx skills add https://github.com/binggg/GALAXY-VORTEX --skill ui-design-binggg
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-design
Source: https://github.com/binggg/GALAXY-VORTEX/tree/main/.claude/skills/ui-design
Command: npx skills add https://github.com/binggg/GALAXY-VORTEX --skill ui-design-binggg

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Professional UI design and frontend interface guidelines help teams produce distinctive, production-grade interfaces for web pages, mini-programs, prototypes, and components.

Core Features & Use Cases

  • Design specification and aesthetic direction for frontend UI
  • Guidance on color, typography, layout, accessibility, and responsive design
  • Prototyping and implementation best practices for production-grade UI

Quick Start

Create a complete design specification for a frontend UI task before implementing the interface prototype.

Frequently Asked Questions about ui-design

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

FAQPage Schema
How do I create a design specification for a web page or mini-program frontend?▼

A UI design specification establishes aesthetic direction, color palettes, typography rules, and layout strategies to guide production-grade frontend interface implementation for web pages and mini-programs.

What's the best way to choose a color palette and typography for frontend interfaces?▼

Choosing a color palette and typography for frontend interfaces requires defining an aesthetic direction and applying design guidelines that ensure professional polish, accessibility, and responsive layout strategy.

Can I use these design guidelines for prototyping mini-programs and web pages?▼

Yes, these design guidelines apply directly to prototyping both mini-programs and web pages, covering accessibility, responsive design, and implementation best practices for production-grade UI.

How does accessibility factor into frontend UI design and layout strategy?▼

Accessibility in frontend UI design integrates with layout strategy by applying design guidelines and prototyping best practices to ensure production-grade interfaces are usable across responsive web pages and mini-programs.

Do I need to finalize aesthetic direction before starting frontend prototyping?▼

Yes, you should finalize your aesthetic direction, design specification, color, and typography choices before starting frontend prototyping to achieve distinctive, professional polish in the final interface.

Related Skills

Explore More Design & Creative Skills→
bfree-trainerbfree-trainer
60

teach-impeccable

Capture project design context and persist it to AI configuration.

Official
Intermediate
jordanhubbardjordanhubbard
105

web-designer-engineer

Translate design specifications into accessible, responsive web components.

Community
Advanced
glassflowglassflow
495

frontend-design

Develop custom frontend interfaces with distinctive typography, color, and motion.

Official
Advanced
KILWA73KILWA73

canvas-design

Generate a visual design philosophy in MD and a single-page PNG or PDF canvas.

Community
Advanced