skills.rest
ShareX
ShareXOFFICIAL
Explore all skills by this author →
Website𝕏@ShareXGitHub

design-ui-window

Redesign Avalonia .axaml views with standardized layout, typography, and styling.

309|15|Updated Dec 29, 2025
Search Tags:#design#consistency#accessibility#refactor#avalonia#uiux#axaml
One-click install
npx skills add https://github.com/ShareX/XerahS --skill design-ui-window
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: design-ui-window
Source: https://github.com/ShareX/XerahS/tree/main/.ai/skills/design-ui-window
Command: npx skills add https://github.com/ShareX/XerahS --skill design-ui-window

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Redesigns Avalonia .axaml views/windows to achieve best-in-class UI/UX quality. Enforces consistent layout, spacing, typography, interaction, accessibility, and visual hierarchy. Only changes visuals, layout and styles — never business logic, bindings or public view-model API. Reusable by updating target_view_path.

Core Features & Use Cases

  • Consistent grid-based layouts across Avalonia windows.
  • Centralized styling for typography, spacing, colors, and controls.
  • Quick iteration by swapping the target_view_path to apply the same standards to different views.

Quick Start

Set the target_view_path in the context to the Avalonia window you want to redesign and apply the standardized UI/UX across that view.

Frequently Asked Questions about design-ui-window

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

FAQPage Schema
How do I redesign Avalonia .axaml views to improve UI consistency without breaking existing bindings?▼

To redesign Avalonia .axaml views without breaking bindings, apply standardized styling and layout adjustments to visuals and styles only. This preserves existing business logic, view-model APIs, and data bindings while enforcing consistent typography, spacing, and accessibility across the targeted UI.

What's the best way to standardize spacing and typography across multiple Avalonia windows?▼

The best way to standardize spacing and typography across Avalonia windows is to apply centralized styling resources and tokens. Adhering to the app's styling tokens ensures consistent visual hierarchy, grid-based layouts, and centralized control properties across all targeted views.

Can I refactor Avalonia UI layouts for better accessibility without modifying the view-model API?▼

Yes, you can refactor Avalonia UI layouts for better accessibility without modifying the view-model API. Changes are strictly limited to visuals, layout, and styles within the .axaml files, ensuring the public view-model API and underlying business logic remain completely untouched.

How do I apply consistent grid-based layouts to different Avalonia views quickly?▼

To apply consistent grid-based layouts to different Avalonia views quickly, update the target view path context. Swapping the target view path applies the same standardized UI/UX rules, layout grids, and centralized styling to any specified .axaml window or view for rapid iteration.

Does redesigning .axaml files for UI/UX quality affect the interaction behavior of existing controls?▼

Redesigning .axaml files for UI/UX quality guides interaction behavior across the targeted UI but does not alter underlying business logic. Visuals, layout, and styles are updated to achieve best-in-class quality while preserving the functional integrity of existing controls and bindings.

Why should I not manually adjust visual hierarchy when refactoring Avalonia UI windows?▼

Manually adjusting visual hierarchy when refactoring Avalonia UI windows risks breaking consistency. Using standardized styling resources enforces centralized typography, spacing, and colors, ensuring the redesigned view achieves best-in-class UI/UX quality without compromising existing public APIs.

Related Skills

Explore More Design & Creative Skills→
johnlindquistjohnlindquist
24

figma

Extract design tokens, components, and styles from Figma files.

Community
Intermediate
diazvaldiviavdiazvaldiviav

Avalonia UX/UI Principles — Nexus Agent Desktop

Provide UX/UI standards for the Nexus Agent Desktop Avalonia application.

Community
Basic
linuxdevellinuxdevel
27

avalonia-wpf-migration

Map WPF XAML, controls, and MVVM patterns to Avalonia equivalents.

Community
Intermediate
Claude-Code-Community-IrelandClaude-Code-Community-Ireland
10

avalonia-layout-zafiro

Develop Avalonia UI layouts with Zafiro.Avalonia semantic containers and shared styles.

Official
Intermediate