ENGINEERING WORKSPACE

Software Architecture Studio

Make complex systems understandable. Design C4 diagrams, connect services, document decisions, and share architecture clearly — entirely in your browser.

01 · Visual C4 modeling02 · Architecture review03 · Export & handoff

YOUR ARCHITECTURE PROJECT

LOCAL

Loading workspace…

Drag cards to arrange · Drag empty space to pan · Use Connect for arrows

Tip Start with a diagram, connect elements, then document decisions.

Ctrl/⌘ Z to undo · Delete to remove selection · Arrow keys to nudge

DOCUMENT WITH CLARITY

A cleaner way to explain your system.

Choose the level of detail that fits your audience. Keep labels, technology and responsibilities together in one reusable architecture model.

Start with context

Map people, the software system and external dependencies before adding implementation detail.

Zoom into the design

Build separate container and component views, plus a deployment topology for runtime decisions.

Share useful artifacts

Download project JSON, diagram SVG/PNG, Mermaid flowcharts and a Markdown architecture report.

Files are processed locally. Projects are saved in this browser when storage is available. Export a JSON backup before clearing browser data. The studio is an approachable C4 modeling aid, not a full Structurizr DSL or deployment-orchestration editor.

Using Software Architecture Studio

Start from a sample or create architecture views, reuse shared elements and connect relationships. Add documentation and keep project JSON, or export a handoff ZIP containing the project and supported per-view files.

This is C4-oriented modeling rather than a full Structurizr DSL implementation or deployed-system verification. Deployment boundaries are conceptual, Mermaid is a generic flowchart and the handoff ZIP is output-only; import its project JSON. Browser storage is not a durable backup.

Choose an architecture project or a documentation handoff

Project JSON: preserve supported shared elements, relationships and views for editing.

SVG or PNG: share the chosen visual architecture view.

Mermaid or Markdown: document supported relationships and decisions; Mermaid is a generic flowchart handoff.

Handoff ZIP: package the project and supported per-view files for another person.

Practice: a fictional service boundary

Create a view showing a person, an application and a data store.

Label their relationships and document one assumption about the design.

Reuse supported shared elements in another view, then save JSON before exporting the handoff.

This is an authored architecture exercise, not a verified deployed system.

Architecture modeling questions

Can I import the entire handoff ZIP back into the editor?

The ZIP is an output package. Extract and import its project JSON to continue editing; per-view images and text exports serve separate review purposes.

Does a C4-oriented or deployment view verify implementation?

No. Views are conceptual models. This tool is not a full Structurizr DSL implementation or automatic hierarchical deployment modeler, and it does not inspect the running architecture.