My introduction to the wonderful world of wireframing

Home/Uncategorized/My introduction to the wonderful world of wireframing

I am currently taking EDUC 682: Instructional Technology Design and Development at UMBC.  This class is taught on-line synchronously.  Last week’s lecture focused on wireframing.  Many students were unfamiliar with this term, and confused about the difference between it, “storyboarding” and a “flow chart”.    Professor Mark’s was almost evangelical about clarifying the differences.  I think this is because in his experience in  the “real world” he has observed that being able to do all 3 results in much better planning and project management.

In a nutshell, a “wireframe” is a prototype of a single page of a website or learning module.  A storyboard shows all the pages together in sequence. Only the flow chart allows for branching.  Thus if a learner doesn’t follow the lesson sequentially, but is allowed to skip ahead or repeat based on their learning needs the flow chart will show their alternative paths.

At Professor Mark’s company professional software is used.  I asked if there were any free on-line options for those of us who have already spent too much on software.  He pointed us to this site:

I haven’t had a chance to test every program mentioned, but her are my preliminary results.  Since I have a Mac, your results may vary:

Lumzy was the best.

Mockingbird and Hot Gloo – no longer free

Denim – was able to launch application, but not to figure out how to work it.  Marks would slowly appear, then disappear

Cacoo looks to be the easiest to use and best designed, but very slow (constantly got what we mac users call “spinning volleyball of doom”}.  It exported an image as a png


About the Author: