Flowchart Wizardry: Master the Art of Visualizing Algorithms 😎

In my previous article, we looked at Pseudocode and its application in problem solving as a developer.
In this article, we would consider Flow charts, which is basically the graphical representation of Pseudocode.

Flowcharts Explained

Flowcharts makes it easier for developers to communicate clearly the algorithm used to solve a particular problem. This in turn makes it easier for the audience to grasp the concepts and for other developers to easily code this out.

Flow charts are a part of the Unified Modelling Language, which provides a broader range of diagrams that cover various aspects of system design and modelling.

Uses of Flow charts

• Flow charts provide a visual representation of all processes or workflows used to solve a problem.

• They serve as a common language for sharing and discussing problems. This means, they are not tied to a specific programming language and hence makes collaboration and communication easier between other developers and stakeholders.

• They also serve as great tools for education and training purposes especially for beginner programmers.

Flow Chart Symbols

For flow charts to foster easy communication of thought process of developers, there must be guidelines for this.

Let's have a look at the six (6) basic symbols which are widely used.

Now let's explain them.

• Terminator: This represents the start and end points of the flow diagram / algorithm that is represented.

• Decision: This represents a question to be answered either YES or NO. The flowchart path may split to different branches depending on the answer.

• Process: This represents an action taken or a function. It is the most widely used of all the symbols.

• Document: This is used to indicate a point in the process where information is documented or recorded.

• Data: This represents the input of data into the flowchart. This input is then processed in the flowchart.

• Direction of flow: As the name clearly suggests, it determines where every process leads. This makes it easier to trace the logic being explained to solve a particular problem.

Read more about flow chart symbols here

How to draw flowcharts

1. Clearly understand the process or algorithm you want to represent in the flowchart. Identify the starting point.

2. Identify the symbols needed. Each symbol represents a specific action or decision point in the process.

3. Start with the start/end symbols. Place them at the beginning and the end of the flowchart.

4. Add process, decision symbols as and when necessary. Also include input/output if the process requires a user input or generates output.

5. Add annotations if needed to provide additional details about specific steps.

Worked Examples

In this section, we would solve the same problems in my previous article using flowcharts.

Problem Statement 1
Write an algorithm to calculate the product of two numbers given by a user

Solution

Problem Statement 2
Write an algorithm that reads 3 numbers and writes them all in a sorted order

Solution

Problem Statement 3
Write an algorithm to print the first 20 numbers in the Fibonacci sequence (Read about the Fibonacci sequence)

Solution

Problem Statement 4
Develop an algorithm to calculate a running sum

If you wrote the Pseudocode for this in my previous article, go ahead and translate this into the flowchart. Drop your shareable link in the comment section.

You can use the following to draw the charts.

• Lucid Charts
• Draw io

Flowcharts serve as a powerful visual tool for representing the logic of an algorithm or process. They offer a clear and concise way to communicate complex ideas, making them an invaluable asset in various fields, including software development, engineering, project management, and problem-solving.

Let's get interactive on Twitter and LinkedIn.

Follow me if you found this content helpful 🤝.

Happy programming 🥂