Skip to main content

/design Command

Design architecture, features, or workflows following AIKit design principles.

Usage

# Design new feature
/design "User authentication system"

# Design architecture
/design --architecture

# Design workflow
/design --flow

Arguments

ArgumentTypeRequiredDefaultDescription
<description>stringYes-Feature or system description
--architectureflagNofalseFocus on architecture only
--flowflagNofalseCreate workflow diagram
--databaseflagNofalseInclude database design
--apiflagNofalseInclude API design
--componentsflagNofalseList components to design
--asyncflagNofalseDesign asynchronous workflows

Workflow

1. Requirements Gathering

AIKit will:

  1. Ask clarifying questions
  2. Understand constraints
  3. Identify stakeholders
  4. Determine scope

Questions:

  • What are we designing?
  • Who will use this?
  • What are the requirements?
  • What are the constraints?
  • What's the timeline?
  • Are there technical constraints?

2. Analysis Phase

Research:

  • Review existing code patterns
  • Check architecture for consistency
  • Identify integration points
  • Research design system if applicable

Design:

  • Create system architecture
  • Design data models
  • Define interfaces between components
  • Plan for scalability

3. Design Phase

Create:

  • System architecture
  • Component structure
  • Data flow diagrams
  • API endpoints (if applicable)
  • Database schemas (if applicable)

Deliverables:

  • Architecture documentation
  • Component specifications
  • Interface definitions
  • Data flow documentation
  • Implementation plan

Design Artifacts

1. Architecture Diagram

graph TD
    User[Interface] --> API[Authentication]
    User[Interface] --> UI[Frontend]
    User[Interface] --> UI[Dashboard]
    API[Authentication] --> Database[UserDB]
    API[Authentication] --> Cache[Redis]

2. Component Specifications

// Component Interface
interface AuthComponentProps {
  onLogin: (email: string, password: string) => void;
  onRegister: (userData: UserData) => void;
  onLogout: () => void;
}

// Component Specification
## Component: Authentication
Type: Functional
Props: See above
Events: onLogin, onRegister, onLogout
State: Managed by AuthContext
Dependencies: API client, auth context

3. Data Model

// Data Models
interface User {
  id: string;
  email: string;
  passwordHash: string;
  createdAt: Date;
  updatedAt: Date;
}

interface AuthToken {
  token: string;
  refreshToken: string;
  expiresAt: Date;
}

interface Session {
  id: string;
  userId: string;
  token: AuthToken;
  createdAt: Date;
  expiresAt: Date;
}

4. API Endpoints

POST /api/v1/auth/register
POST /api/v1/auth/login
POST /api/v1/auth/logout
POST /api/v1/auth/refresh
POST /api/v1/auth/verify
GET /api/v1/auth/me

Examples

Simple Feature Design

# Design authentication feature
/design "Add user authentication"

# AIKit will:
# 1. Ask about requirements
# 2. Create authentication flow
# 3. Design components
# 4. Document APIs

Architecture-First Design

# Design with architecture focus
/design "Authentication system" --architecture

# AIKit will:
# 1. Create system architecture
# 2. Define module boundaries
# 3. Design interfaces
# 4. Plan data flow

Workflow Design

# Create workflow diagram
/design "Checkout flow" --flow

# AIKit will:
# 1. Define checkout steps
# 2. Create flow diagram
# 3. Document edge cases
# 4. Include error handling

Design Principles

SOLID Principles

  • Single Responsibility: Each component has one job
  • Open/Closed: Modules should be extensible
  • Liskov Substitution: Dependencies should be swappable
  • Interface Segregation: Depend on abstractions not implementations
  • Dependency Inversion: High-level modules shouldn't depend on low-level details

DRY Principles

  • Don't Repeat Yourself: Extract common functionality
  • Follow Convention: Use project patterns
  • Compose Functions: Build complex behavior from simple parts

Clean Architecture

  • Separation of Concerns: Keep business logic separate
  • Clear Layers: UI, API, data models
  • Minimal Dependencies: Reduce coupling

Best Practices

Before Designing

✅ DO:

  • Understand existing architecture
  • Review similar features
  • Consult team members
  • Document decisions made
  • Plan for scalability
  • Consider all use cases

❌ DON'T:

  • Design in isolation
  • Over-engineer for future needs
  • Ignore technical constraints
  • Create overly complex abstractions
  • Skip edge cases

During Designing

✅ DO:

  • Iterate on designs
  • Get feedback regularly
  • Validate assumptions
  • Document trade-offs
  • Consider implementation

❌ DON'T:

  • Commit to first design
  • Ignore team feedback
  • Skip validation
  • Design without documentation

After Designing

✅ DO:

  • Create implementation plan
  • Update architecture docs
  • Document design decisions
  • Define success criteria

❌ DON'T:

  • Leave design undocumented
  • Make assumptions without noting
  • Skip success criteria

Output Formats

Markdown Documentation

AIKit generates markdown files with:

  • Architecture overview
  • Component specifications
  • API documentation
  • Data flow diagrams
  • Implementation plan

Code Examples

AIKit generates code examples for:

  • Component implementations
  • API endpoint handlers
  • Data models
  • Test examples