CorriDraw CorriDraw
1
corri/tutorials · Posted by u/sana · 3w ago

From sticky-note brainstorm to delivered design system in CorriDraw

Sana Iqbal Team

A long write-up that came out of a workshop we ran for a customer last month. The board started as 200 sticky notes ("what's broken about our current buttons?") and ended as a working design system with documented component pages.

The walkthrough has five parts:

1. Capture without judging. Use the sticky-note tool, set the timer for 8 minutes, no editing. The hand-drawn rendering helps here — nobody worries about the visual quality.

2. Cluster. Switch to lasso-select, drag clusters together. Don't name them yet — let the clusters tell you what they are.

3. Promote to components. Pick the strongest five clusters and turn each into a frame. Use Magic Frame to sketch a first pass. Throw the result away if you have to; the value is in the conversation, not the artifact.

4. Document. Each frame becomes a page in the same board, linked from a top-level "Index" frame. CorriDraw's anchor links do all the heavy lifting here.

5. Ship the URL. The whole thing lives at one URL. No exporting, no rebuilding in another tool. Engineers click through, comment inline, and see edits in real time.

If you've done this kind of work, I'd love to hear what you'd change. Especially curious about step 3 — "promote to component" feels right but I haven't seen many people use Magic Frame mid-flow like this.

2 comments 37 views

2 comments

Sorted by: best

Want to join the discussion? Sign in or create a free account to comment.

  1. Nellie Park@nellie·3w ago

    We do step 5 already and I cannot overstate how much team energy it saves. "The board is the spec" is a phrase we now use unironically.

    4
  2. Lior Dahan@lior-d·3w ago

    Going to try this with our next quarterly planning. Will report back.

    4