Scribble Board guide
How to make a flowchart: symbols, steps and a worked example
To make a flowchart, write down the steps of a process in order, then draw each one as a shape joined by arrows. Use an oval for the start and end, a rectangle for each action and a diamond for each yes-or-no decision, with one arrow leaving the diamond for each answer. Keep the flow running top to bottom or left to right, and read it through once with a real example to check that every path reaches an end.
Flowchart symbols you actually need
Formal flowcharting has dozens of symbols, but almost every useful flowchart gets by with four:
| Shape | Means | Example |
|---|---|---|
| Oval (rounded) | Start or end | "Order received", "Done" |
| Rectangle | An action or step | "Pack the parcel" |
| Diamond | A decision with two or more answers | "In stock?" |
| Arrow | What happens next | Labelled "Yes" or "No" when it leaves a diamond |
Some people add a parallelogram for input or output (such as "Customer enters address") and a document shape for paperwork. Use them if your audience expects them; otherwise a rectangle is fine.
Making a flowchart, step by step
- Name the process and its edges. Decide where it starts and where it ends. "From a customer ordering to the parcel leaving" is a clear scope; "how the shop works" is not.
- List the steps as short verbs. Write them down in order before you draw anything: "Check stock", "Take payment", "Pack". Three or four words per box is plenty.
- Find the decisions. Wherever the answer to a question changes what happens next, that's a diamond. Phrase it as a question with clear answers.
- Draw the main path first. Lay out the "happy path", where everything goes right, in a straight line top to bottom.
- Add the branches. Draw the other answer from each diamond off to the side, and either bring it back to the main path or to its own end.
- Walk through it. Follow the arrows with a real example. Every path should reach an end, and no box should be a dead end.
A worked example
Worked example: answering a support email
Start (oval): "Email arrives".
Step: "Read and tag it". Decision: "Is it a refund request?"
Yes → "Check the order" → Decision: "Within 30 days?" Yes → "Issue refund"; No → "Explain the policy". Both arrows lead to "Reply and close".
No → "Answer the question" → "Reply and close".
End (oval): "Ticket closed". Two decisions, six steps, and every route finishes in the same place.
Notice that both branches rejoin before the end. That's what keeps a flowchart readable: one start, as few ends as possible, and no arrows crossing if you can avoid it.
Drawing it in Scribble Board
Scribble Board is a whiteboard with a hand-drawn look, which suits flowcharts: a sketchy style tells people "this is a draft, comment freely". It runs in your browser with no account.
- Shapes: press R for a rectangle, D for a diamond and O for an ellipse, then drag on the canvas. Double-click a shape to type inside it.
- Arrows: press A and drag from one shape to the next. The arrow attaches to both, so it follows when you move a box. In the style panel, Arrow type switches between curved or straight and elbow connectors.
- Tidy up: hold Shift for straight lines, Ctrl D to duplicate a box, and set Sloppiness to Architect if you want cleaner lines.
- Library: ready-made pieces, including a decision diamond and a sticky note, drop in with a tap.
- Export and share: save a PNG at 1x to 3x, copy it to the clipboard, or share a link. The whole drawing is packed into the link, so nothing is uploaded; people who open it see a read-only copy and can tap "Edit a copy".
Every drawing tool, PNG export, share links and 3 scenes are free. Scribble Board Pro ($2.99 once) adds unlimited scenes, templates (including a ready-made flowchart), presenting frames as slides, and SVG export. Your boards are saved in this browser, so use Save to file or Back up for anything you want to keep.
Tips for a clear flowchart
- One direction. Flow top to bottom or left to right, and keep it that way.
- Label every arrow out of a diamond. "Yes" and "No" (or the actual answers) remove all guessing.
- Keep boxes the same size and line them up. Duplicating one box is quicker than drawing ten.
- Split big charts. If it doesn't fit on one screen, turn a section into a single box ("Handle refund") and draw that section as its own chart.
- Use colour for meaning, not decoration: for example, red for steps that need a manager.
Common mistakes
- Decisions with only one arrow out. A diamond always has at least two answers.
- Sentences in boxes. If a box needs a paragraph, it's probably two or three steps.
- Dead ends, where a branch just stops without reaching an end.
- Mixing levels of detail, such as "Run the business" next to "Click Save".
- Drawing before thinking. List the steps first; it's far quicker than rearranging shapes.
Questions
What are the basic flowchart symbols?
An oval for the start and end, a rectangle for each action, a diamond for each decision, and arrows to show what happens next. A parallelogram is sometimes used for input or output.
What shape is used for a decision in a flowchart?
A diamond. Write the decision as a question inside it, and draw one labelled arrow out of it for each possible answer, usually Yes and No.
Which direction should a flowchart go?
Top to bottom or left to right. Pick one and keep it, so readers can follow the arrows without hunting.
How many steps should a flowchart have?
As few as explain the process. If it no longer fits on one screen or page, group a section into a single step and draw that section as its own flowchart.
Can I make a flowchart for free online?
Yes. Scribble Board lets you draw shapes and connected arrows in your browser with no account, export a PNG and share a link. Templates and SVG export come with the optional Pro upgrade.
How do I share a flowchart made in Scribble Board?
Use Share link: the whole drawing is compressed into the link, so nothing is uploaded. Anyone who opens it sees a read-only copy and can choose to edit their own copy. You can also export a PNG.