skills.rest
SHGrowth
SHGrowthOFFICIAL
Explore all skills by this author →
WebsiteGitHub

om-backend-ui-design

Standardize backend admin UI development with @open-mercato/ui components.

6|2|Updated Mar 27, 2026
Search Tags:#design#consistency#forms#data-tables#ui-library#backend-ui
One-click install
npx skills add https://github.com/SHGrowth/om-superpowers --skill om-backend-ui-design
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: om-backend-ui-design
Source: https://github.com/SHGrowth/om-superpowers/tree/main/skills/om-backend-ui-design
Command: npx skills add https://github.com/SHGrowth/om-superpowers --skill om-backend-ui-design

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This skill standardizes the creation of backend/backoffice interfaces, ensuring consistent UX and efficient development across modules by reusing a shared UI component library.

Core Features & Use Cases

  • Reusable backend UI components from the @open-mercato/ui library for pages, headers, data tables, forms, and detail views.
  • Guidelines for layout, data presentation, keyboard navigation, and accessibility to ensure consistency and usability.
  • References and examples included to illustrate implementation patterns and best practices.

Quick Start

Describe your backend admin screen and apply the prescribed components and patterns to implement it.

Frequently Asked Questions about om-backend-ui-design

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

FAQPage Schema
How do I design consistent backend admin dashboards?▼

Design consistent backend admin dashboards by enforcing a component-driven layout using the @open-mercato/ui library. This standardizes page headers, bodies, and data tables to ensure uniform UX across modules and teams.

What is the best way to standardize CRUD forms across backend modules?▼

Standardize CRUD forms across backend modules by reusing shared CrudForm, FormHeader, and FormFooter components. This approach enforces a single source of truth for layout and styling, ensuring consistent data entry experiences.

Does @open-mercato/ui work for data tables and detail pages?▼

Yes, @open-mercato/ui works for data tables and detail pages by providing core reusable components like DataTable and Page. These components enforce consistent data presentation and layout patterns across backend interfaces.

Can I use this approach for settings screens and admin backoffice interfaces?▼

Yes, you can use this approach for settings screens and admin backoffice interfaces. The prescribed components and layout guidelines apply universally to ensure consistent UX across all backend modules.

Why does backend UI consistency matter for multi-team development?▼

Backend UI consistency matters for multi-team development because it eliminates fragmented layouts and styling. Using a shared UI library ensures all teams follow identical component patterns, reducing maintenance overhead and UX discrepancies.

Related Skills

Explore More Software Engineering Skills→
comeritocomerito

backend-ui-design

Design backend admin pages with @open-mercato/ui components and layouts.

Official
Intermediate
dominikpalatynskidominikpalatynski

backend-ui-design

Standardize backend admin pages with shared Page, DataTable, and CrudForm components.

Community
Advanced
timsvoicetimsvoice

specimin-ui-accessibility

Audit and fix generated UI code for WCAG 2.1 AA compliance.

Community
Advanced
drshk5drshk5

backend-ui-design

Design backend admin interfaces using the @open-mercato/ui component library.

Community
Intermediate