All proposals
04 / 06Signal
4 logo concepts
clankerdocsSee it in action
VISUAL DOCUMENTS FOR CODING AGENTS

See the system.
Review the plan.

Your coding agent can explain more than code. Explore the architecture, follow the request, and leave feedback in one visual document.

Agent-authored Human-reviewed Rich visuals
ONE DOCUMENT. MORE WAYS TO EXPLAIN.
ArchitectureSequence diagramsDatabase schemasPseudocodeWireframes
BUILT FOR HOW AGENTS WORK

Your agent has more
to show you.

A Markdown file can describe a system. A rich document lets you follow its connections, inspect the details, and review the design in place.

Give your agent a shared document with expressive visuals, precise comments, and a history of every revision.

Try the example

One system.
Every important detail.

Select a service. Follow a request. Inspect the schema.
Then leave a comment and preview the agent's revision.

EngineeringOrder processingInteractive example
SYSTEM DESIGN / ENGINEERING Revision 01

How an order gets processed.

The API records each order before queuing it. A worker handles fulfillment, so checkout stays fast even when downstream services are slow.

Five services. One order.
Order processing architecture. Storefront to Order API, queue, worker, and Postgres.ORDER PROCESSINGPOST /orderspublishconsumeupdate statusrecord01 — CHECKOUTAn order, fromrequest to result.UIStorefrontThe checkout interfaceAPIOrder APIValidates and records ordersQOrder queueBuffers accepted ordersFNOrder workerProcesses queued ordersDBPostgresStores orders and results
Select a service to inspect it. Every view describes the same system.
FN
SELECTED COMPONENTOrder worker

Processes queued orders. Review the behavior in the connected views.

Design decision · Process orders asynchronously

Persist the order first. Keep fulfillment outside the checkout request.

01

Your agent creates.

The plan becomes a document with clear writing and useful visualizations.

02

You review.

Leave a precise comment on a component, diagram, or explanation.

03

Your agent revises.

The document improves. Every revision stays available in its history.

THE SIGNAL IDENTITY

Dark surfaces, live diagrams, and a precise document agent.

Signal borrows the precision of a developer's instruments. Deep navy surfaces carry bright, legible data paths. A document-and-processor mark makes agent authorship explicit, while live diagrams demonstrate how much a document can explain.

Find the right signature.

Select a mark to see it applied throughout this proposal. Each concept is an original vector drawing.

Document coreRecommended

A clipped document is also a processor, with two small eyes cut into the center. Recommended for the strongest developer signal in this family.

Agent terminal

A command-like fold and a broad visor turn a document into a compact technical agent. The lower line anchors it as a page.

Bracket bot

A pair of brackets wraps a small document face. The brackets serve as both an agent's frame and a reference to structured authoring.

Pixel page

A page built from a controlled grid of squares contains a minimal robot expression. The stepped corner remains readable in a small bitmap-like icon.

One color
Reversed
App icon
16px24px32px
Actual sizes

Document core is currently applied to the wordmark, document, and review interface.

SPACE GROTESK
Aa0123

Understand
the whole system.

BODY / INTERFACE / CODE

Order processing

The API records each order before adding it to the queue. A worker handles fulfillment and updates the order status.

ReviewedRevision 02
POST /orders → queue → worker

Space Grotesk adds a technical character with distinctive, controlled letterforms. Geist handles longer text; monospace is reserved for paths, labels, and code.

Aa#9EF2C9
MintBrand / actions
Aa#101E23
NightBackground
Aa#192D33
PanelDocument surface
Aa#ECF4F1
FrostHeadlines / text
Aa#3D575F
SlateBorders / grid
Aa#78CEED
CyanSecondary diagrams
MESSAGING IN USE

See the system. Review the plan.

Your coding agent can explain more than code. Explore the architecture, follow the request, and leave feedback in one visual document.

Explain the architecture.Comment on the details.Keep every revision.
CREATE → EXPLAIN → REVIEW

Motion with a job to do.

Animate signals along a readable circuit. Let the reader pause, isolate a service, or step through the request. The active path carries the accent color.

Try the interactive example
clankerdocs

See the system.
Review the plan.

clankerdocs.com
DOCUMENT VISUAL LANGUAGE
customersordersorder_items

One customer. Many orders.
Every connection, explained.

WHY THIS DIRECTION

The most technical direction, with strong contrast and a natural home for animated system models.

THE TRADEOFF

Dark presentation can make everyday reading feel dense. Keep generous spacing and provide clear document surfaces.