Easy and intuitive and fast way to break down a problem is through flowcharts that's why flowcharts are used by IT teams while building software.

And flowcharts have many advantages such as:

  1. It makes logic clear.
  2. Effective communication.
  3. Good tool for documentation.
  4. Effective tool when analyzing a problem.

Therefore increasing productivity by up to 200%.

So, I thought of why not use it in ITSM. so, I just built it.

What it does

Flowchart app allows you to draw flowcharts in Freshservice with ease. It provides all the basic shapes, arrows that help you to create self-explanation flowcharts for any ticket, changes, e.t.c quickly and easily.

How I built it

I built it Flowchart using vanilla JavaScript, and for rendering the shapes I used the Fabricjs library.

Challenges I ran into

I faced two challenges:

  1. As I use canvas to draw flowcharts, I needed to store the canvas but, the storage API in Freshservice currently supports up to 8KB of storage which is very small for storing canvas. So, I am solving this issue by adding a save button where users can save the flowcharts.
  2. Another was with modifying the canvas. It was difficult to add a shape with editable text inside it. I tried by reading their docs, Stack overflow answers, etc. but, couldn't solve it. So, I removed the feature for now.

Accomplishments that I'm proud of

I got to know about the competition very late like on the 16th I got to know(halfway through). So, I first built a basic app exploring all the APIs and then I faced bugs with that app and it took me a long time to solve those and I had less time for thinking about this app. I started building this app on 4th November. So, I'm proud that I'm able to build this app within 3 days as a Mechanical Engineering student😁.

And I'm also proud that I submitted 4 different apps for Freshservice working solo.

What I learned

I learnt how fast we need to be in terms of thinking & implementation of a project in a hackathon. And how we can push our boundaries and remove the invisible barrier which is stopping us from doing anything by thinking big.

What's next for Flowchart

I am thinking of developing these features in the coming days:

  1. Adding more shapes.
  2. Giving colour options for shapes.
  3. Shapes with text embedded on them(text aligned centre).
  4. Saving the flowchart in Google Firebase Storage so that anyone in the organization can access the flowcharts.
  5. Adding a more powerful arrow connector so that the users can link the shapes with arrows more easily.

These are all the current features I'm thinking of adding, feel free to comment on any new feature ideas, suggestions.

Built With

Share this project: