design-architecture

Define site maps, navigation systems, and user flows for digital products.

1|Updated Apr 14, 2026
One-click install
npx skills add https://github.com/hschne/pi-stuff --skill design-architecture-hschne
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: design-architecture
Source: https://github.com/hschne/pi-stuff/tree/main/skills/design-architecture
Command: npx skills add https://github.com/hschne/pi-stuff --skill design-architecture-hschne

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill eliminates the risk of launching digital products with disorganized structure, unclear navigation, and broken user flows that require costly rework after visual design is complete, ensuring the product's foundation is user-centered and scalable from the start.

Core Features & Use Cases

  • Information Architecture Planning: Define content hierarchy and page structure for new or existing digital products, including documentation sites, SaaS platforms, and consumer web apps.
  • Navigation & User Flow Mapping: Outline primary, secondary, and mobile navigation systems, plus critical user paths like onboarding, task completion, and content discovery.
  • Scalable Structure Design: Create URL strategies and content growth plans that accommodate expanding content and features over time without requiring full architectural overhauls.
  • Use Case Example: Use this Skill when building a new e-commerce help center to map out all support article sections, navigation links, and user paths to find troubleshooting content before writing any code.

Quick Start

Use the design-architecture skill to map the full site structure, navigation system, and user flows for the new project management tool I'm building for freelance teams.

Frequently Asked Questions about design-architecture

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

FAQPage Schema
What is information architecture planning for a digital product?

Information architecture planning defines the structural skeleton and content hierarchy of digital products. It establishes scalable, user-centered site structures and navigation systems prior to visual design implementation to prevent costly rework.

How do I map user flows and navigation systems for a SaaS platform?

You map user flows by outlining primary, secondary, and mobile navigation systems alongside critical user paths like onboarding and task completion. This process ensures your SaaS platform structure supports content discovery and aligns with existing codebase structures.

When do I need to plan a URL strategy and site structure?

You need a URL strategy and site structure when building new web applications, documentation sites, or SaaS platforms. Planning upfront accommodates expanding content and features over time without requiring full architectural overhauls.

Can I use this approach for an e-commerce help center site structure?

Yes, this approach works for e-commerce help centers to map support article sections, navigation links, and user paths to find troubleshooting content. It ensures the site structure is defined before writing any code.

What is the best way to design scalable site structure for growing content?

The best way to design scalable site structure is creating content growth plans and URL strategies upfront. This accommodates expanding features over time without requiring full architectural overhauls or disrupting existing user flows.