ui-architect

Plan layered UI architectures and component hierarchies for legaltech products.

1|Updated Feb 12, 2026

Search Tags:#design-system #ui-architecture #frontend-architecture #component-hierarchy #legaltech-ui

Ready to run

npx skills add https://github.com/45black-Limited/uk-legal-plugins --skill ui-architect-45black-limited

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: ui-architect
Source: https://github.com/45black-Limited/uk-legal-plugins/tree/main/skills/ui-architect
Command: npx skills add https://github.com/45black-Limited/uk-legal-plugins --skill ui-architect-45black-limited

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Design and plan scalable UI architectures for legaltech products, enabling clear layer separation and consistent design systems without heavy coding.

Core Features & Use Cases

Provide a structured component map and layer definitions for new UI projects.
Evaluate design system options and map data flows across presentation, interaction, and data layers.
Use case: When starting a new product, generate a baseline UI architecture plan and a component hierarchy.

Quick Start

Provide product goals and user roles to generate a layered UI architecture plan.

Frequently Asked Questions about ui-architect

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

FAQPage Schema

How do I plan a scalable UI architecture for a legaltech product?▼

To plan a scalable UI architecture for a legaltech product, you need to define layer separation and establish a consistent design system. This approach generates a structured component map and outlines data flows across presentation and interaction layers.

What is UI layer separation and why is it important for frontend architecture?▼

UI layer separation is the process of dividing frontend architecture into distinct presentation, interaction, and data layers. It is important because it ensures clear data flow mapping and maintains consistent design systems across trustee, client, and developer personas in legaltech products.

How do I structure a component hierarchy for a new legaltech interface?▼

To structure a component hierarchy for a new legaltech interface, you must gather context, select an appropriate design system, and map out layer definitions. This process yields a documented architecture outcome with a clear baseline component map.

Can I use this approach to restructure existing legaltech interfaces?▼

Yes, you can use this UI architecture planning approach to restructure existing legaltech interfaces. It evaluates design system options and remaps component hierarchies and data flows across trustee, client, and developer personas to produce a forward-looking architecture plan.

What do I need to provide to generate a baseline UI architecture plan?▼

To generate a baseline UI architecture plan, you need to provide product goals and user roles. This input triggers a workflow of context gathering, design-system selection, layer definitions, and data-flow outlining to produce a documented architecture outcome.