Sight, touch, and voice in one workspace

Koi charts documentation

Build a flowchart, inspect its structure, and verify every route with the same chart across the canvas, tactile display, and outline.

Start building Test a route

Getting started

Create your first route

Every input method updates one shared chart.

Choose how you work

Voice

Press Ctrl+Alt+V, wait for Listening, then say add a start called Begin.

Canvas

Drag a shape from the palette onto the canvas, or select a shape once to append it to the route.

Keyboard

Open Keyboard editing & advanced commands to add shapes by label and position.

Add an entry point
Create a Start shape. Double-click it to rename it, or say rename Start to Begin.
Connect the next step
Drag between shape ports, or drop the connection on empty canvas and choose a shape to create there. The pending route stays anchored to the original release point while you choose. You can also say connect Begin to a new process called Sign in. Select an arrow to add a branch label such as Yes or No.
Inspect the shared chart
Focus a shape and compare the visual canvas, 120 × 80 tactile simulation, Braille information strip, and chart outline.

Editing essentials

Select a shape or connection and press Delete. The lower-right selection card also provides a delete button. Press Escape to clear the selection. Use Compact nodes when space is limited. Use Auto arrange chart to restore a readable top-to-bottom layout, fit the chart to the canvas, and centre the focused shape.

Press Ctrl+Alt+S to interrupt a spoken reply.

Reading command syntax

Replace angle-bracket terms such as <shape> and <label> with your own values.
Every shape displays a short reference such as N3 on the canvas. Say node three or N3 anywhere a full shape label is accepted; the reference remains attached when you rename the shape.
Square brackets mark optional wording.
Quote labels containing command words: add a process called “Sign in with Google”.
Fast local commands handles common phrases without a network request. Join recognised commands with then, and then, or and to apply them together. If any clause is not recognised, Koi Charts sends the complete request to Gemini.
Speak replies controls spoken feedback.
Voice timing controls the pause after a complete phrase: Quick waits 0.25 seconds, Balanced waits 0.8 seconds, and Patient waits 1.6 seconds. Speech resumed during that pause is joined to the same command. Balanced is the default.

Structural review

Checking a chart

Find gaps and ambiguity before walking a route.

Check chart reviews the whole flow without changing it. It presents one issue at a time, focuses the relevant shape across the canvas, tactile display, and outline, and recalculates as you edit.

Review the structure

Open. Select Check chart above the canvas, or say check chart.
Read. Each item states whether it is Required for a complete route or a Review item that may cause ambiguity.
Navigate. Use Next issue and Previous issue, or speak those phrases. The corresponding shape receives shared focus and is centred in the canvas.
Apply a safe fix. Missing Start and End issues offer an add action that uses normal edit history and can be undone.
Open the relevant editor. Duplicate labels open the shape editor, unlabelled branches open the arrow editor, and multiple Starts are reviewed one focused node at a time. The audit closes before the editor opens.
Repeat. Select or say Repeat issue to hear the current title again.
Close. Select the close control or say Close check. Closing the review does not alter the chart.

What the audit checks

Entry and exit: A chart needs one Start and at least one End. Multiple Starts are identified for review.
Reachability: Every shape should belong to a route that begins at the Start.
Complete paths: Non-End dead ends and connected paths that cannot reach an End are reported separately.
Decision branches: Each Decision needs at least two outgoing arrows, and each arrow should have an outcome label.
Distinct labels: Duplicate labels are identified because voice and keyboard references need an unambiguous name.

Private, concise feedback

Chart checking runs locally without calling Gemini or using Gemini quota. Spoken and visible issue copy uses chart labels and never exposes internal identifiers. When a suggested action opens an editor, the reply names the shape or connection being edited. Opening Test chart closes the audit so the two review modes do not overlap.

Guided verification

Testing a chart

Walk the route you built without changing it.

Test chart is a verification and walkthrough mode for an existing chart. It follows shapes and connections one step at a time; it does not create, reconnect, rename, or delete chart content.

Run a walkthrough

Begin. Select Test chart, or say test chart or start test. Choose a Start if the chart has more than one.
Advance. Select Next step or say next. Playback pauses at every shape.
Choose. At multiple outgoing arrows, select a branch label or destination. For example, say take Yes.
Review. Use Back one step or back. Use Repeat step or repeat to hear the current guidance again.
Finish. Use Restart test or restart test, and Stop test or stop test.

When a route needs attention

Missing Start: A chart without a Start cannot begin. Use Check chart for structural issues such as unreachable shapes, missing Ends, and incomplete decisions.
Missing branch labels: An unlabelled arrow remains available by destination, but branch labels make decisions clearer.
Dead end: Playback pauses when the current shape has no outgoing connection.
Loop: Playback announces a loop when the route returns to a visited shape and waits for your decision.
Chart changes: Editing during playback blocks advancement until you restart the test with the current graph.

Voice, keyboard, and screen reader access

Playback phrases are fast local commands and run without calling Gemini or using Gemini quota. Reach every control with Tab and activate it with Enter or Space. Live status announcements use chart labels instead of internal identifiers.

Command reference

Speak with predictable results

Use the exact local forms for the fastest response, or speak naturally for Gemini interpretation.

With local commands enabled, the supported phrases below are processed without a Gemini request. Other phrasing is sent to Gemini for interpretation and may require clarification.

Join up to ten exact local edits with "then" or "and". If any part is uncertain, the whole request goes to Gemini.
Quote a label that contains grammar words: add a process called "Check before payment".
Name a shape by its own label — or, when the chart has only one of them, by its kind: "the decision".
Use its short reference when a label is tiring to say: node 3 or N3. The reference remains attached when the shape is renamed.

Download the command reference in Unified English Braille (Braille ASCII, 40 cells per line and 25 lines per page): Grade 2, contracted (.brf) · Grade 1, uncontracted (.brf)

Combine edits

<command> then <command>
Runs a sequence as one local, undoable change when every part matches the local grammar.
Accepted variants: then; and then; and before a clear command verb; up to ten edits.
- add a start then add a process

Build the chart

add a <shape>
Adds a shape with a default label.
Accepted variants: add; create; insert; make; place; put; new; shape: start / process / decision / end; start also: begin; process also: step, action, task; decision also: choice, question; end also: finish, stop, terminal.
- add a start
- create a decision node
add a <shape> called <label>
Adds a shape with the label you say.
Accepted variants: called; named; labelled; titled; that says.
- add a process called Check payment
- add a decision called Approved?
- add a process called "Check before payment"
add a <shape> [called <label>] <relation> <existing shape>
Adds a shape in a chosen position beside one already in the chart.
Accepted variants: before; after; above (over); below (under); left of; right of.
- add an end below Check payment
- add a process called Refund to the right of Check payment

Connect shapes

connect <source> to a new <shape> [labelled <label>]
Creates the destination, then connects the source to it. Labelled names the new node, not the arrow. A new node without a shape type defaults to Process. Undo removes both changes.
Accepted variants: called; named; labeled; labelled.
- connect Start to a new process
- connect it to a new decision labelled Approved?
- connect Start to a new node labelled Review
connect <shape> to <shape>
Draws an arrow from the first shape to the second.
Accepted variants: connect; link; join; draw an arrow from.
- connect Start to Check payment
- draw an arrow from Check payment to End
connect <shape> to <shape> labelled <label>
Draws an arrow and labels it — how a decision's branches are named.
Accepted variants: labelled; called; named; with label.
- connect Approved to Refund labelled No
label connection from <source> to <destination> as <label>
Adds or replaces the label on an existing arrow. Use full shape labels or short references such as node 1 and N2.
Accepted variants: connection; arrow; link; edge; as; with label; labelled.
- label connection from Approved to Refund as No
- label arrow from node one to N2 as Yes
clear label on connection from <source> to <destination>
Removes an arrow label without deleting the connection.
- clear label on connection from N1 to N2

Change what is there

rename <shape> to <label>
Changes a shape's label.
Accepted variants: rename; relabel; change; to or into; this / it / the selected shape refer to the current selection.
- rename Check payment to Take payment
- change Process 3 into Review
- rename this to Take payment
move <shape> <relation> <shape>
Repositions a shape beside another one.
- move Refund below Approved
delete <shape>
Removes a shape. A shape with arrows asks for confirmation first.
Accepted variants: delete; remove; erase.
- delete Refund
- remove the selected shape
<any command> the <shape kind>
When the chart has only one shape of a kind, its kind names it — useful when the label is a long question. With two of them you are asked which.
Accepted variants: the start; the process (step, action, task); the decision (choice, question); the end (finish, stop).
- delete the decision
- focus on the end
delete the connection from <shape> to <shape>
Removes one arrow, leaving both shapes in place.
Accepted variants: connection; arrow; link; edge.
- delete the connection from Start to Check payment

Test the chart

test chart / start test
Starts guided playback at a Start shape without changing the chart.
- test chart
- start test
repeat / restart test / stop test
Repeats the current step, starts the route again, or closes guided playback.
Accepted variants: repeat step.
- repeat
- restart test
- stop test
next / back / take <branch>
While testing, moves through the recorded route or takes only the branch you name.
- next
- back
- take Yes

Move the cursor

next / back
Walks one step along the arrows, and says where you landed.
Accepted variants: next (go next, forward); back (go back, previous).
- next
- go back
take <branch>
At a decision, follows the arrow with that label.
Accepted variants: take; follow.
- take No
go to start / go to end / where am I
Jumps to either end of the chart, or repeats your current position.
- go to start
- go to the end
- where am I
focus on <shape> / clear selection
Selects a shape by name, or drops the selection entirely.
Accepted variants: focus on; focus; select; highlight; clear selection; deselect.
- focus on Check payment
- select the last shape
- clear selection

Ask about the chart

describe the chart / describe this
Reads out the whole chart, or just the selected shape.
- describe the chart
- describe this
inspect <shape>
Lists what leads into and out of one shape.
- inspect Check payment
- inspect this
trace the path from <shape> [to <shape>]
Follows the route between two shapes, or onward from one.
- trace the path from Start to End
- trace the path from Start
check chart / validate the chart
Opens a structured local review of unfinished or ambiguous chart structure.
Accepted variants: check the chart.
- check chart
- validate the chart
next issue / previous issue / repeat issue / close check
Moves through, repeats, or closes the current chart review.
- next issue
- previous issue
- repeat issue
- close check

Arrange the canvas

arrange chart
Repositions the whole chart, fits it into view, and centres the selected shape.
Accepted variants: arrange the chart; auto arrange chart; auto arrange the chart.
- arrange chart
- auto arrange the chart
use compact nodes / use standard nodes
Switches between smaller compact shapes and the standard readable shape size.
Accepted variants: compact nodes; turn compact mode on; turn compact mode off.
- use compact nodes
- use standard nodes

Keep an editable project

save project
Downloads the current chart as an editable Koi project file without using Gemini.
Accepted variants: export project; download project.
- save project
- export project
- download project
open project
Moves focus to Open project. Press Enter to choose a Koi file; browsers require that final keyboard action.
Accepted variants: import project; load project.
- open project
- import project
- load project

Take it back

undo / redo
Steps back or forward through your edits. Walking the chart is not an edit.
- undo
- redo
confirm delete / cancel
Confirms or cancels a pending deletion. Confirmation is recognised word for word only, never approximately.
Accepted variants: confirm; confirm deletion; yes, delete it.
- confirm
- confirm delete
- confirm deletion
- yes, delete it
- cancel

Requests handled by Gemini

Say: “add three steps for onboarding”
Requires interpretation of the requested number and labels of new nodes.
Say: “delete everything”
Requests a bulk operation. Destructive changes require confirmation.
Say: “do not add a start node”
Contains negation and is not treated as a local add command.
Say: “move Start somewhere sensible”
Does not specify a destination or a position relative to another node.

Provider access

Use your own API keys

Local editing remains available without provider keys. Add only the services you want to use.

Open API keys
In the workspace voice toolbar, select API keys. The counter shows how many of the two providers are configured for this tab.
Add Gemini
Gemini interprets natural-language commands outside the fast local grammar. Obtain a key from Google AI Studio, paste it into the Gemini field, and choose Save Gemini key.
Add AssemblyAI
AssemblyAI provides live speech transcription. Obtain a key from AssemblyAI, paste it into the AssemblyAI field, and choose Save AssemblyAI key.
Replace or remove a key
Open API keys again to enter a replacement or remove either provider. Each key is stored only for the current browser tab and is cleared when the tab closes.

Key handling

Keys are masked, excluded from saved Koi projects, and sent only to the matching Koi Charts server route. AssemblyAI returns a short-lived transcription token; its permanent key is never used by the live browser connection. Deployment keys remain the fallback for providers not configured in the tab.

Projects and exports

Exporting charts

Keep an editable project for later, or create a fixed copy for sharing.

Continue editing later
Save project downloads the complete chart as a versioned .koi file. It is readable UTF-8 JSON and preserves shape types, labels, positions, connections, and connection labels. Project files are processed locally in your browser and are never uploaded.
By voice, say Save project, Export project, or Download project to save by voice without calling Gemini. The file excludes credentials such as API keys, environment variables, browser preferences, transcripts, speech data, provider responses, temporary selections, and undo history.
Open a saved project
Select Open project and choose a .koi file no larger than 2 MiB. Koi Charts validates the whole file before it replaces the current chart. A successful import is one history entry: Undo restores the previous chart and Redo reapplies the imported project. An invalid or unsupported file leaves the workspace unchanged.
For keyboard access, use Tab to reach Open project and press Enter. By voice, say Open project, Import project, or Load project. The command focuses the button and asks you to press Enter, which gives the browser permission to show its file picker.
Share a non-editable copy
Choose an image or document format when the recipient only needs to view or publish the chart. These exports capture the complete diagram with balanced padding, independent of canvas zoom, but cannot be reopened as editable Koi Charts projects.

SVG

Scalable vector output for the web and design tools.

PNG

High-resolution lossless image with a transparent background.

JPEG

Compressed image with a white background for sharing.

PDF

Single-page vector document with paths and text preserved.

Safe deletion confirmation

When deleting a connected shape by voice, wait for the confirmation request, then say Confirm delete, Confirm deletion, or Yes, delete it. These exact local phrases confirm only the prepared deletion and do not call Gemini.