Supported Diagram Types in Archify: A Complete Guide to the 5 Formats

Archify supports five distinct diagram categories—Architecture, Workflow, Sequence, Data Flow, and Lifecycle—each backed by dedicated JSON schemas, validation rules, and renderers defined in the DIAGRAM_TYPES constant.

The tt-a1i/archify repository provides a declarative diagramming engine that transforms JSON payloads into interactive visualizations. Understanding the supported diagram types in Archify allows you to select the optimal format for documenting everything from high-level system boundaries to granular state machine transitions.

The Five Supported Diagram Types in Archify

Archify categorizes visualizations into five independent types, each with strict validation schemas located in archify/schemas/ and dedicated rendering engines under archify/renderers/. The canonical list is defined in scripts/site-copy.mjs within the DIAGRAM_TYPES constant.

Architecture Diagrams

Architecture diagrams visualize high-level system component layouts, including services, databases, network zones, and deployment boundaries. Use this type when you need a static, bounded view of your overall system for architecture reviews, security boundary checks, or deployment ownership proofs.

These diagrams support an optional deployment-ownership profile and enable Architecture-Delta comparisons for pull request reviews.

Workflow Diagrams

Workflow diagrams represent linear or parallel pipelines of tasks and layers, such as CI/CD processes or data-processing steps. Choose this format when documenting operational pipelines, job-queue visualizations, or process flows where ordering and parallelism matter, but the specific call-sequence between participants does not.

Sequence Diagrams

Sequence diagrams capture call-order interactions between participants, including services, components, and actors. This type excels at modeling API request-response flows, microservice interaction patterns, and event-driven sequence tracing where temporal message order is the primary concern.

Data Flow Diagrams

Data Flow diagrams illustrate how information moves through stages, channels, or streams, such as ETL processes and Kafka-style message buses. Select this format for data-centric architectures where the emphasis is on transformation stages, sinks, and sources rather than control flow or component interactions.

Lifecycle Diagrams

Lifecycle diagrams render finite state machines, depicting states, transitions, and triggering events. Use this type for component or resource lifecycle charts, protocol-state specifications, and any scenario requiring formal modeling of allowed state transitions.

How to Specify Diagram Types in Your JSON Payload

Each payload must declare its type using the diagramType field. Archify validates the input against the corresponding schema (archify/schemas/<type>.schema.json) and routes it to the appropriate renderer (archify/renderers/<type>/).

Architecture Example

{
  "diagramType": "architecture",
  "meta": { "title": "My System" },
  "components": [{ "id": "frontend", "type": "service" }],
  "relationships": []
}

Workflow Example

{
  "diagramType": "workflow",
  "meta": { "title": "CI Pipeline" },
  "lanes": [{ "id": "build", "label": "Build" }],
  "nodes": [{ "id": "compile", "lane": "build" }]
}

Sequence Example

{
  "diagramType": "sequence",
  "meta": { "title": "Login Flow" },
  "participants": [{ "id": "client" }, { "id": "authSvc" }],
  "messages": [{ "from": "client", "to": "authSvc", "label": "POST /login" }]
}

Data Flow Example

{
  "diagramType": "dataflow",
  "meta": { "title": "ETL Pipeline" },
  "stages": [{ "id": "extract" }, { "id": "transform" }, { "id": "load" }],
  "flows": [{ "from": "extract", "to": "transform" }]
}

Lifecycle Example

{
  "diagramType": "lifecycle",
  "meta": { "title": "Pod Lifecycle" },
  "states": [{ "id": "Pending" }, { "id": "Running" }],
  "transitions": [{ "from": "Pending", "to": "Running", "event": "start" }]
}

CLI Generation and Validation

The Archify CLI auto-detects the diagramType field, validates the payload against its schema, and generates a self-contained HTML file.

# Generate an Architecture diagram

npx archify generate examples/web-app.architecture.json

# Generate a Workflow diagram  

npx archify generate examples/ci-pipeline.workflow.json

The validation engine enforces strict compliance with the JSON schema for each type before rendering begins, ensuring type safety across all five diagram categories.

Summary

• Archify defines five supported diagram types: Architecture, Workflow, Sequence, Data Flow, and Lifecycle, enumerated in scripts/site-copy.mjs.
• Each type requires a specific diagramType value in the JSON payload to trigger the correct validation schema and renderer.
• Validation schemas reside in archify/schemas/<type>.schema.json, while rendering logic is implemented in archify/renderers/<type>/.
• Architecture suits system overviews, Workflow for pipelines, Sequence for message flows, Data Flow for ETL/streaming, and Lifecycle for state machines.
• CLI generation uses archify generate <file>.json, automatically selecting the appropriate rendering pipeline based on the declared type.

Frequently Asked Questions

What are the supported diagram types in Archify?

Archify supports five diagram types: Architecture, Workflow, Sequence, Data Flow, and Lifecycle. These are defined in the DIAGRAM_TYPES constant within scripts/site-copy.mjs and each has independent JSON schemas, validation rules, and rendering engines.

How does Archify validate diagram payloads?

Archify validates payloads against JSON schemas stored in archify/schemas/<type>.schema.json. When you run archify generate, the CLI inspects the diagramType field and applies the matching schema to ensure structural correctness before rendering.

Where are the diagram renderers located in the repository?

Each diagram type has a dedicated renderer directory under archify/renderers/. For example, Architecture diagrams use archify/renderers/architecture/, while Lifecycle diagrams use archify/renderers/lifecycle/. These modules convert validated JSON into interactive HTML/SVG output.

Can I use multiple diagram types in a single JSON file?

No. Each JSON payload must specify a single diagramType value (e.g., "architecture" or "sequence"). To generate multiple diagram types, create separate JSON files and invoke the CLI for each file individually.

{
  "mcpServers": {
    "instagit": {
      "command": "npx",
      "args": ["-y", "instagit@latest"]
    }
  }
}