time to mental image

• Less time to a mental imageAsk your agent how something works, and you get a wall of text. It's overwhelming, and it assumes context you may not have. You skim, you guess, and the picture never comes together — or it isn't the one your agent meant. With ttmi, your agent draws the answer instead — the picture it means, walked through one step at a time, out loud.
• Any domainCode, infrastructure, a business process, a contract, a pathway. Give ttmi your domains, conventions and terms, and every sketch the agent draws speaks your language.
• Narrated, and said rightA voice running in your browser reads each step aloud. Tell it how to say your product names, acronyms and jargon, and the walkthrough pronounces them the way your team does.

• FreeFor you and your agent
  $0
  • Unlimited sketches
  • Walkthroughs, narrated in your browser
  • Comments your agent answers
  • Public links anyone can open
  • Your own domains, conventions and terms
  Start free
• TeamFor a team that sketches together
  Let's talk
  • Everything in Free
  • Share sketches in your organization
  • PNG export for issues, pull requests and docs
  • One guide for every agent in the organization
  • API keys for CI: a sketch on every pull request
  • SSO and directory sync on request
  Contact us

The layout engine, the format and the guidance an agent gets were reviewed against the research on diagrams and explanation. Each finding became a rule the engine enforces, not a suggestion in a style guide. Read the research

1. 1Larkin and Simon, 1987Text makes the reader search for facts and infer how they connect. A diagram works by locality: what belongs together sits together, so the reader looks instead.→Layout keeps connected parts next to each other, and a note beside the part it explains.
2. 2Heiser and Tversky, 2006With arrows a drawing reads as cause and function; without them, as structure. Lines are relations.→Every arrow between parts carries a label. A note's connector is drawn as a line, not an arrow.
3. 3Bransford and Johnson, 1972The same passage was hard to understand and remember without the picture it described, and easy with it, but only when the picture came first.→A walkthrough opens on the whole drawing, so every step lands on a picture you already have.
4. 4Glenberg, Wilkinson and Epstein, 1982Readers miss contradictions in text they have just read, and still rate their understanding as high.→The explanation is a picture you can check at a glance. A wrong part or a missing arrow is plain to see.
5. 5Tversky, Morrison and Bétrancourt, 2002Discrete steps beat animation. What is shown has to be perceivable in the time it is shown.→Play is a walkthrough you pace yourself, one step at a time, the camera moving to each new part.
6. 6Mayer, multimedia principlesSegment, let the reader pace, signal the new part, keep words next to the picture, cut what is not needed.→The narration sits under the step's shapes; what a step brings in fades in; the format has no decoration.
7. 7Moody, 2009One symbol, one meaning. Few symbols. Text plus graphics. Hierarchy to manage complexity.→Fill is weight. Colour means one thing per sketch, and a legend says what. Groups are the hierarchy.
8. 8Sweller, cognitive loadA concrete example beats an abstract description, and detail away from the thing splits attention.→A note shows one concrete example, and sits next to the part it is about.
9. 9Shneiderman, 1996Overview first, zoom and filter, then details on demand.→The overview fits one screen. Notes stay folded until you open them, or the step that needs them.
10. 10Dyson and Haselgrove, 2001Lines of about fifty-five characters are read fastest and understood best.→Notes and narration keep to that line length, so every line reads at a glance.