detailed-design-templates

Generate Markdown design documents and GitHub issue templates with Mermaid dependency diagrams.

Updated Jan 8, 2026
One-click install
npx skills add https://github.com/takemo101/compose-workflow --skill detailed-design-templates
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: detailed-design-templates
Source: https://github.com/takemo101/compose-workflow/tree/main/.opencode/skill/detailed-design-templates
Command: npx skills add https://github.com/takemo101/compose-workflow --skill detailed-design-templates

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill provides standardized templates for creating detailed design documents and associated GitHub Issues, ensuring consistency and completeness in the software development lifecycle.

Core Features & Use Cases

  • Frontend Design Templates: Pre-defined structures for frontend architecture, state management, API integration, and more.
  • Issue Templates: Boilerplates for Epic, Child, and Documentation Update issues, promoting clear task definition and tracking.
  • Dependency Visualization: Enforces the use of Mermaid for clear dependency mapping between issues.
  • Use Case: When starting a new feature, use the frontend design template to outline the component structure, state management, and API calls, then create a corresponding Epic issue using the provided template to manage the development process.

Quick Start

Use the detailed-design-templates skill to generate a frontend design document for a new user profile page.

Frequently Asked Questions about detailed-design-templates

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

FAQPage Schema
What is the best way to structure a detailed software design document for frontend architecture?

Frontend design templates provide structured Markdown boilerplates for component architecture, state management, and API integration. These standardized templates ensure consistency and completeness when outlining detailed software design documents for new features.

How do I create GitHub issue breakdowns with dependency visualization for a new project epic?

To create GitHub issue breakdowns with dependency visualization, use Markdown templates for Epic and Child issues that enforce Mermaid diagrams. This approach clearly maps dependencies between issues and promotes structured task tracking for the project epic.

Does this documentation approach work for backend module design as well as frontend components?

Yes, this documentation approach works for backend module design as well as frontend components. The templates support structured documentation for overall project epics, backend modules, and frontend architecture, ensuring comprehensive coverage across the entire project.

How do I generate a frontend design document for a new user profile page?

To generate a frontend design document for a new user profile page, apply a pre-defined Markdown template to outline the component structure, state management, and API calls. You can then create a corresponding Epic issue to manage the development process.

When do I need detailed design templates for software documentation?

You need detailed design templates for software documentation when starting a new feature and requiring standardized structures for design docs and associated GitHub Issues. They solve the problem of inconsistent documentation by providing boilerplates for frontend, backend, and Epic issue tracking.