Mindmap

What & why

The requirement was an app that draws real Buzan-style mindmaps: organic branches that start thick at the core and taper toward the tip, the text on the branch instead of in separate boxes, and one colour per branch family. We built it from the ground up — a dependency-free HTML5 app with exactly those branches, dragging, inline text, plus its own multi-user backend with login and roles. Fully in-house.

Most mindmap tools draw boxes with connecting lines; a real Buzan mindmap — with drawn, organic branches — calls for something of its own. That style was the requirement here, as was full in-house control: no subscription to someone else's platform, but an app that belongs to its maker.

Approach

1. The Buzan rules taken as a spec: a free central point, branches thick at the core and tapering to the tip, and the text as a label along the branch.
2. Those tapering branches rendered as filled SVG paths, the words upright along the line; every branch and its sub-branches share one colour.
3. A fine editor: dragging (with the whole subtree), panning, zooming, inline renaming, undo, and im/export as JSON.
4. Its own multi-user backend (PHP + SQLite) with login, roles and per-user mindmaps — database outside the docroot, rolled out in-house via CI.

Technology

• Dependency-free HTML5
• SVG / tapering bézier
• PHP
• SQLite
• Session + CSRF auth
• Self-hosted