technology tip of the month Using Storyboards in Online Course Design
Virgil E. Varvel Jr.
2004

Creating Storyboards

  • Consider objectives
    The rest of the design stage should be centered around how best to meet the objectives for the audience and its needs.
     
  • Organize all information and media elements that have already been developed.
    The first step is to figure out what you have, what you want, and what you still need in order to meet your objectives. In addition, you may have ideas for media that you are able to find already produced online, some that you can link directly to without obtaining permission.
     
  • Review rationale for materials choice and inclusion.
    Consider why you have chosen to use various media elements. Does the time of production warrant the added benefit to the students? How much of a benefit is the media? I take a more media oriented approach since such are most suited to the use of storyboards. The rationales should be in line with the objectives and the audience. How can these objectives best be met, and how can the audience best be served?
     
  • Produce flowchart or outline where necessary.
    I do not believe that it is necessary to flowchart an entire course, but that is just my preference. For some, this may be necessary to keep all of the information in an ordered numbering system. For those lessons that I feel are best served by a more complex or media oriented design, I will produce a flowchart from which storyboards can be developed. To that flowchart is appended a standard design flowchart that I use to denote a standard course template with discussion forums, homepage, etc. I want at least to assign a number or value to these items in some way so as to organize and understand linkages that I build into the course at a later time. One thing to remember is that I am trying to make this process feasible within typical time and material restraints.
     
  • Write preliminary text outline and full text when appropriate or already available.
    Often, most of your notes have already been produced in other courses in the face-to-face environment, but when moving to the online environment, you have to make some changes. Because the information dispersal may not occur in a linear order, you have to consider adding information and perhaps redundancies in order to eliminate confusion by students who skip around. Some argue that you should have all of your text written before or during the storyboarding process. I do not see this as absolutely necessary. What is vitally important; however, is that you have a detailed outline from which to draw information linkages and organization. Once again, I am trying to streamline the process to make it feasible.
     
  • Produce storyboards.
    Below I list the primary consideration when developing your actual storyboards.
    • Use a template that is as simple as possible within your needs.
      We don't have all the time in the world to create our storyboards. We are also educators for the most part, with limited resources. Also, as storyboarding of multimedia has developed, the complexity of the templates has increased. It has been my experience that this complexity is unnecessary. I show on the following pages a simple template that has served our group well.
    • Begin with core components.
      Begin filling in core items in the storyboard such as lesson, date, etc. It is important to provide basic information on the storyboard so as to distinguish one from the other. It is also important to date them so that you do not confuse early storyboards with redesigns.
    • Start pages with a navigation element.
      Since the standard navigation element is consistent throughout much of an educational course, you can usually place this item relatively quickly. I will often abbreviate elements such which are repeatedly used such as a basic navigation element.
    • Include rationale prior to proceeding too far to avoid extra work.
      Every page within a course should have a reason to exist. The design of that page should exist in order to meet the reasons for the page's existence. Therefore, I include a rationale section at the bottom of my template. Also, this region can come in handy when verifying a course with a curriculum committee or for providing rationales to colleagues, employers, etc.
    • Add text and multimedia elements.
      Next, begin to place your text and other elements. While I do not often have all of my text completed at this stage, I still go to lengths to have a detailed outline. By this point, you must also decide how much space the text will take up and where within the page. Text attributes can be assigned from different sections such as how certain text will be highlighted over other text, and how the titles or section headers will appear.
    • Produce only for pages needed.
      I do not produce storyboards for every page within my courses. I simply do not have the time. Within some productions such as the tutorial example in the following pages, it is necessary as there are no common elements. I filled two binders with storyboards for that project and still ended up having to go back and add some aspects to the tutorial. On the other hand, within a course common elements do exist. For example, when working with a course management system, a discussion board layout will be provided. All you have to do is to organize the forums. I will usually do this simply with a list of titles that I can add, edit, and delete as needed when other content in the course is developed or updated.
    • Build information linkages.
      One of the greatest benefits for storyboarding is the ability to use visuals to develop information linkages. I recommend finding a large blank wall and organizing your storyboards along that wall. As you look at the whole, you can visualize the hyperlinks you have places and perhaps find other ones that will benefit the students. You may also begin to see objectives that are not being met or that could be met through an alternative organization.
    • Other considerations (color schemes, font attributes, etc.)
      I recommend developing a simple code for telling yourself how some things should appear. I will often simply use a few colored pencils or pens to denote color changes. You can also use <b> type coding to denote font attributes. You can also develop a style sheet on a separate sheet of paper to which you can refer from your storyboards. You may also develop different thematic styles within various sections of a course. I try to only define these styles once (usually when they would first appear) and then refer back to them for specifics while presenting a general overlay on independent storyboards. Basically, do whatever makes the process simplest and the most understandable for you.
    • Check fit of overlaying displays and interactive elements within page context.
      Does everything fit where you want it too? Are the images too big? Is there appropriate room for the content with respect to other elements on the page?
       
  • Build additional information linkages and review overall layout of content.
    Basically go over everything you have done so far and see if anything was missed from the holistic perspective. Make sure that all of the objectives have been met. Are there alternative methods that might work better for given content? Are there areas where time can be saved? Are there areas where resources can be saved? Is there someone that can be assigned a given task?

You may notice that I did not number the items below. I did not include numbers because I do not believe that storyboarding is always if ever a linear process. Depending on my motivation, current sparks of intellect, availabilty of a needed resource, etc., the order needs to be modified. You can go backwards as easily as forward. At some point you see the light at the end of the tunnel and pull everything together into a cohesive whole

 

arrow image Introduction
arrow image Why Use Storyboards
arrow image Creating Storyboards
arrow image Putting Storyboards into Practice
arrow image Simplified Storyboard Template
arrow image Example Storyboards
arrow image References


ION Home | Pointers and Clickers

Home | Online Courses | Institutes & Presentations | Educational Resources | Initiatives | Institutional Partners | About ION

uiuc uic uis