skills.rest
fil512
fil512COMMUNITY
Explore all skills by this author →
GitHub

ui-design-expert

Analyze UI screenshots and provide CSS tweak plans for a brass-era steampunk theme.

3|Updated Dec 14, 2025
Search Tags:#typography#accessibility#ui-design#color-palette#css-patterns#board-games#steampunk
One-click install
npx skills add https://github.com/fil512/upship --skill ui-design-expert
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-design-expert
Source: https://github.com/fil512/upship/tree/main/.claude/skills/ui-design-expert
Command: npx skills add https://github.com/fil512/upship --skill ui-design-expert

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill provides expert guidance to review and polish game UI, ensuring cohesive aesthetics and professional polish across interfaces.

Core Features & Use Cases

  • Design critique of color, typography, layout, and interactions to achieve a steampunk/brass era vibe for UP SHIP!'s interfaces.
  • Guidance for implementation with CSS patterns, spacing, and visual hierarchy examples that translate into concrete UI improvements.
  • Use Case: When preparing in-game screenshots or menus, apply this skill to refine readability, consistency, and tactile feel that matches the Brass Era theme.

Quick Start

Analyze the provided UI screenshot and deliver a concise CSS tweak plan and palette aligned to the Brass Era theme.

Frequently Asked Questions about ui-design-expert

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

FAQPage Schema
How do I polish game UI for a cohesive steampunk aesthetic?▼

To polish game UI for a cohesive steampunk aesthetic, analyze screenshots to refine color palettes, typography, and layout. This provides structured guidance for menus and HUDs, ensuring professional tactile feel and visual consistency.

What CSS patterns improve visual hierarchy in brass-era game interfaces?▼

CSS patterns for brass-era game interfaces improve visual hierarchy by applying specific spacing conventions and typography tweaks. These patterns translate directly into concrete UI improvements, enhancing readability and structural consistency across panels.

How do I select a color palette for a steampunk game HUD?▼

Selecting a color palette for a steampunk game HUD involves reviewing screenshots to align tones with the brass-era theme. The process delivers a targeted palette plan that ensures cohesive aesthetics and readable interactions.

Can I use this UI design guidance for board game menus?▼

Yes, you can use this UI design guidance for board game menus. The skill reviews layout, typography, and interactions to deliver a polished steampunk vibe, satisfying requirements for structured design critique across game interfaces.

What is the best way to critique UI readability for game menus?▼

The best way to critique UI readability for game menus is by analyzing in-game screenshots to evaluate visual hierarchy and spacing. This delivers a concise CSS tweak plan that refines consistency and tactile feel.

Related Skills

Explore More Design & Creative Skills→
ormastesormastes

visual_test

Capture baseline and current screenshots to detect visual regressions across breakpoints.

Community
Advanced
andronicsandronics
1

color-tools

Generate accessible color palettes and validate WCAG contrast for UI designs.

Community
Intermediate
HaslienHaslien

typography

Define scalable UI type systems with CSS variables and mathematical ratios.

Community
Advanced
wubq511wubq511
6

impeccable

Audit frontend interfaces for accessibility, performance, and responsive design.

Community
Advanced