How to create a presentation with associated audio, web content using FlowGram
Haris Khawar
M Ali Mardan Qureshi

Flowgram is an online communication platform that lets anyone create and share information in ways never before. It forms a medium to fully exploit the resources available on the web and smartly combines them into a presentation, that is both interactive and user friendly. Creators can manipulate and comment on web pages, photographs, documents and even add a voice narration to their presentations. This exclusively personalized package can shared through email and links to either private groups or the world web.


The key feature of flowgram is that it removes communication barriers. Abstract concepts are best explained through flowgrams as it allows you to add entire Webpages, photographs videos and voice narrations. Videos can be uploaded from YouTube, where as photographs can be grabbed from popular sites such as Facebook, Flickr and MySpace.

Flowgram has proved its worth in the field of education. Flowgrams are now being used to create online lectures and tutorials. Most instructors have found the flowgram environment user-friendly and its features have helped deliver the message more effectively. Students found lectures created through flowgrams more interesting. They can not only visualize the content but also hear the instructor’s commentary; this maximizes learning for the student.

Tutorials have become ever so interesting with flowgrams. Now, one doesn’t require reading text out of a book or a manual, instead the screencasts produced through flowgrams graphically represent the data. This motivates learning and saves a lot of time for the student.

Website-walkthroughs is another application of flowgram. Since flowgram can load live pages into the presentation, walkthroughs are merely a matter of browsing pages now! Suppose, you want to explain a friend features of Wikipedia, simply load the site into your flowgram and start browsing it. You can add your voice to make sure the audience stays with you.

Creating a Flowgram

Creating flowgrams is very simple. Go to, make a user id and simply login.

After you login, you arrive on main page as shown below. The upper tab contains buttons for navigating around the website. Select create from top row.


The Add Content page as shown below allow you to upload Webpages, photos, and documents.


Photographs could be uploaded from Facebook, Flickr or even your own hard drive. Videos can be taken from YouTube.


The editor bar shown below contains some very useful tools. It is located at the top of the every page. It allows, you to add further content, arrange content, record audio, add notes and view page details. The timeline enables you to synchronize the background audio with your slides.


Adding RSS/Atom Feed

RSS is a family of Web feed formats used to publish frequently updated works—such as blog entries, news headlines, audio, and video—in a standardized format. [Wikipedia]

RSS are very useful for engineering students and professionals. You can simply add the RSS link of some particular website into the flowgram and it will show you the updates and changes made on that website. This can help you stay up-to-date with latest research, news, hobbies and lots of other things. You can upload as many links as you want and get related updates on them through your flowgram.
This feature could be used in presentations as well as photo-journalism. Suppose, you are advertising or promoting a new product, you can add RSS links of websites that will review your product, this way you will be update to all the comments and reviews made by people about your product.


Adding Notes and Highlights

You can simply select notes and highlight option from the editor bar. A highlight proves very useful in laying emphasis on topics in slide presentations.
Adding notes is also another useful feature. It allows you to make annotate on websites, documents and photographs. This feature could be used in tutorials, presentation and even website- walkthroughs.

Viewing the Content

Once you have added all the content to your flowgram, go to the “Pages” button on the upper bar. Here, you can view all the content that you have added to your flowgram. Clicking on the URLs would take you directly to the link. Clicking on any YouTube links would automatically start the video.
This page lets you manipulate with all the content that you have added to your flowgram. It contains all the pictures, web pages and attached documents.

Synchronizing the Audio Content

You can upload audio files through your hard rive or even add narration using the record button available on the Editor Bar. The timeline as shown in figure 6 enables you to synchronize the audio content with highlighted sections of your flowgram. This way you can allocate time duration for a particular slide. The timeline is shown below.


Sharing a Flowgram

Sharing the flowgram is very easy and done in many ways.

  1. Send links of your flowgram to friends and family members on their email address.
  2. Make the flowgram public so that the entire world can access it.
  3. Paste the flowgram link on personal site, blogs and IM clients.
  4. Export the flowgram to YouTube as a video file
  5. Post a flowgram widget on Facebook, MySpace, Orkut, Blogger, LiveJournal, IGoogle and many other social networks.

Since creating flowgrams is absolutely free of cost, people are using it to make advertisements and promote their ideas and products.

Applications of Flowgram

Although flowgram is still new on the horizon, people have used the tool to their advantage for many things. Flowgram finds its application in the field of education in form of online lectures; students are finding the interactive and user-friendly environment of flowgram beneficial for their studies. Training aids are also being developed through flowgrams; consider the flowgram on Marketing. Users have been greatly inspired by the features of flowgram and are using them to create website- walkthroughs, tutorials and advertisements. Photo-sharing with friends and family has become ever so easy; people can gather their pictures from different social networks and combine them into an album to share with their loved ones.

Example flowgrams:

1. 21st Century Information Literacy Skills
2. The World Fact Book
3. Search Marketing; A Concise Overview
4. Photo Albums
5. Fiddlesticks

Flowgram: An Engineer’s Perspective

Since flowgram is primarily a communication platform, engineering professional and students could use it convey new ideas and knowledge. Students have found the presentations created in flowgram very helpful. Tutorials for handling specific equipment, promoting new research and staying up-to-date with the latest technology through RSS feeds are some of the features of flowgram that have assisted engineers in their studies and profession.


Flowgram is an online tool for communication. It uses web pages, videos, photographs and documents to make presentations. Creating flowgrams is quick and simple. Engineering student and professionals have both used flowgram to their advantage in spreading knowledge. The tool has many application including website-walkthroughs, presentations and tutorials. The figure below summarizes the whole content of this article.


See Also

1. Microsoft PowerPoint for making Presentations
2. SlideRocket
3. CamStudio for Screencasting


1. Wikipedia
2. Flowgram
3. BBC
4. Google
6. TechCrunch

Unless otherwise stated, the content of this page is licensed under Creative Commons Attribution-ShareAlike 3.0 License