Storyboarding Article

Storyboarding Multimedia

Adrian Mallon, 1995

---

Table of contents

Introduction
So what is a storyboard?
Multimedia Storyboarding Tools
The Advantages of Storyboarding
Interactive Storyboarding
Using Interactive Storyboarding to Speed-up the Content-writing Phase
Using Interactive Storyboarding to Speed-up Report Document Production
From Interactive Storyboard to Prototype: A Practical Example
Conclusions

---

Introduction

Depending on the nature and scale of your operation, you might be sceptical of the idea of storyboarding programs. It can be time-consuming and if the product development time is short (as in TV or Radio news programming) then who has time to produce a shot-by-shot plan of how the end product should look and sound? But if you are in film, commercial or TV magazine and documentary production, dealing with large multidisciplinary production teams who may be split between different sites, then careful planning is essential. Storyboarding plays an important role in these areas in providing everyone, including the client, if there is one, with a common point of reference, to verify and validate structural and content elements. The same is true in multimedia production, perhaps even more so since teams in this area are still in the process of developing a common cross-disciplinary language and, with development tools still in the process of evolution, experience is not always there to draw on when it comes to the incorporation of more obscure design elements.

Multimedia authoring tools such as Hypercard and Macromedia Director have already made an impact in storyboarding for more tradition media such as film and commercial production. Their use in storyboarding multimedia productions is even more appropriate and can lead to faster production times and fewer design problems to overcome in later production stages. The major assumption in the recommendation of this approach is that the designer is fluent in the authoring/storyboarding tools. Without this fluency, it makes more sense to pursue alternative, more traditional, paper-based storyboarding techniques.

So what is a storyboard?

A storyboard is an expression of everything that will be contained in the program -- what menu screens will look like, what pictures (still and moving) will be seen when and for how long, what audio and text will accompany the images, either synchronously or hyperlinked. Typically, storyboards may be written documents and off-the-shelf storyboard pads for TV and video formats, adaptable for multimedia, are available. For me, the storyboard expresses, in one way or another, everything that can be seen or heard or experienced by the end-user of the multimedia program. It's more than a test-of-concept model, and just short of the final product specification document.

Multimedia Storyboarding Tools

The illustration at the top of this section is from a storyboard produced using Hypercard on the Mac. It shows some screens in an interactive program for the teaching of Home Economics which was commissioned by the Design Council. Each storyboard page actually contained eight such illustrations in B&W.

It was produced by the interactive designer, to use in communicating what was required to the interactive programmer and to the graphic designer. This example of a storyboard doesn't give any feel for the interactive structure of the program -- that was expressed separately in a flowchart diagram, cross-referenced to the storyboard screens, to avoid having to work with large wall-chart diagrams. But from this storyboard, the team could decide on screen text-fonts, screen layout, image size and resolution, and do the sums necessary to calculate the file-size of the application to ensure it would fit on the target distribution medium (in this case a high-density floppy disc). These decisions were made before the programming and final artwork stages to avoid having to go back to the content-definition team to ask for re-writes then.

The Advantages of Storyboarding

Storyboarding need not take the considerable time that some think it does, depending on how one goes about it. And there are significant advantages to be considered.

• It helps catalyse feelings about the feasibility of the program idea. If the storyboard looks wrong, the program will too.
• Omissions may be spotted as a result of producing the storyboard.
• There is a document which everyone can point to as a common point of reference, enabling the design team (which includes the client) to say, 'Yes, that is what I meant', or 'No, we've a problem here'.
• The storyboard helps focus on the total content of the program, both from the point of view of the overall size of the program, and in discussing user interaction times.
• Problems may be spotted from the storyboard which may have proven more costly to correct at a later stage.
• A detailed storyboard can save time in writing project documentation, e.g., in the production of the product specification document.
• Advanced planning can result in templates for the content-writer to work with. This speeds up the content-writing process and makes the production of the storyboard itself so much faster.

Measuring the true effectiveness of storyboarding is, of course, problematic. There is a lack of data from commercial developers, and questions must be asked of the reliability of what data is available. Few developers are keen to admit, or even measure, the costs of program revision arising from weaknesses in planning, -- increased costs being added to the client's bill or absorbed as acceptable loss of profit by the developer. But if storyboarding has a role to play in the design process then studying how to go about it the right way must influence product design; indeed, I would argue that, for complex multimedia products and in extended working teams, detailed storyboarding is essential.

Interactive Storyboarding

With the increased power and ease-of-use of present multimedia authoring tools, interactive storyboards are now possible. An interactive storyboard is a working version of the program but produced in an easily adjusted form to material to be added and adjusted without requiring any deep-level programming. Used in conjunction with other design and production documentation (the treatment, flowchart, product specification and individual team-member production briefs), it adds greatly to the development team's understanding of its objectives by providing a common point of reference to illustrate the structure and feeling of the projected software program from the end-user point of view.

An interactive test-of-concept model and an interactive storyboard will differ principally by their level of completeness and also by the purpose for which each is used. The test-of-concept model is produced when the design is at a plastic stage and is an aid to thinking about the problem and arriving at better and best solutions. Thus there may be several test-of-concept models before a final design is fixed on. But once the final design is fixed on, effort should be concentrated on fleshing out the model by developing the content in a detailed way along each of the program's branches and in each of its sections. The storyboard will define largely what needs to be written, what graphics need to be produced, how best to apply transition and other computer effects, and the information playback load on the target-computer delivery system imposed by simultaneously accessing diverse media-types.

If the product is an innovative one, the production of the interactive storyboard should precede the production of the product specification document which enables the prototype to be constructed. This ensures a deeper level of reflection and testing of the methods by which the content is to be delivered before committing to the relatively more expensive production of a prototype. If the program type is not innovative, however, and simply the reapplication of proven strategies and techniques, interactive storyboarding is still of value. In this case, it may occur after the production of a product specification In both instances, it will serve in as an aid in drawing up the briefs which must be produced separately for software, graphics, film and sound-engineer team members.

The speed with which storyboards and working models can be created means that it is unimportant whether or not the final software is to be written on the same platform as the authoring tool, although if the final production itself is to be produced using only an authoring tool then it is, of course, desirable to plan and design using the same tool.

A screen from an interactive storyboard is shown in Figure 5 (an example from the program flowcharted in Figure 4). Pathways can be tested through the material to investigate the look and feel, the consistency and ease of use, of the program, even before the complete screen text (if any) has been added. The top-left-hand part of the screen represents the viewing area to be presented to the end-user. On a 14"-screen, typically, this is all of the storyboard that would be viewable to allow visual impact and cursor-interaction movements to be assessed. On a larger, 16"-screen, say, a wider range of information fields relevant to different parts of program research and production come into view. The program can be customised to conceal those fields which are not relevant to a particular development team member for the sake of clarity. Print-outs are then made, which, along with statements from the interactive designer, document clearly and exhaustively the extent of a program and the detail of what needs to be completed.

Using Interactive Storyboarding to Speed-up the Content-writing Phase

Content writing is an unpredictable phase at best. The unpredictability arises from uncertainties which are inherent in any creative process. Where the content writer and the designer are one-and-the-same there are fewer problems, but this is not often the case. A further problem area is where the client is also the content expert/writer. In such instances, forcing the client to keep to project deadlines can be problematic since development teams' internal scheduling requirements will often be invisible to the client. Anything that can be done to speed up the content-writing phase is to be welcomed.

What I tend to do is to create first a test-of-concept model for a program in Hypercard. The test-of-concept model helps focus attention on the overall form and approach of the program. This is then extendedin functionality to act as a template for the content-writer. A storyboard of every screen in the resource is produced, with blanks to be filled in by the content-writer. These screens can be printed out to allow the content writer to pen in their contributions. Much more interesting and productive is when the content-writer is confident enough to write directly to the storyboard in its interactive form. This involves the content-writer sitting in front of the template version of the program, referring to a printed flowchart which illustrates the overall structure. The writer navigates through the program as an end-user would, with access to all program sections and levels. The writer then clicks on open text fields on the screen to enter the text to appear at the appropriate part of the screen.

The advantages of the technique, which allows content to be composed within an interactive template, are several. First of all, it ensures a systematic approach to the content-writing phase of any project. Secondly, a great amount of time is saved in inputting the text which would otherwise have to be transferred from paper to word-processable form, and then passages and captions cut and pasted to the appropriate part of the interactive program. Thirdly, the technique is useful in motivating the writer by their deeper involvement in the design process. It also ensures that people are writing with the constraints imposed by the output screen in mind,--avoiding too much text on a screen, say, and making sure that the text-size is readable. In this manner, the writerÕs attention is directed to every detail on every screen which concerns them, and potentially serious omissions are avoided. Finally, the technique can greatly facilitate the localisation of the program for foreign language markets, since problems of text-translation which affect screen layout are immediately identified in translating directly to given screen areas.

Using Interactive Storyboarding to Speed-up Report Document Production

A well-produced, computer-generated storyboard can also reduce the time required to produce a product specification document and production briefs, which will differ in each case for programmers, graphic artists, film crews and sound engineers but which require accurate visuals to effectively communicate specific points. As already mentioned, interactive storyboarding enables decisions to be evaluated at an early stage on screen text-fonts, screen layout, image size and resolution, andfacilitates the calculation of the file-size of the application. Once these decisions have been made and incorporated into the storyboard, storyboard screens can be output to print in expanded templates which allow briefing notes to be attached to each screen. Again the argument applies, that an integrated design approach to program modelling and documentation will benefit and speed development.

From Interactive Storyboard to Prototype: A Practical Example

In one laserdisc production designed to run within a PC environment, Hypercard on the Mac was used as a test program to check the laserdisc frame coding and image quality and to examine aspects of the look and feel of a fully-featured implementation of the software program. The program had been storyboarded in Hypercard and the storyboard used in drawing up a specification for the C-programming of the disc. A test laserdisc containing the video footage and program menu and background screens arrived back from the pressing house and, rather than wait a few more weeks for the C-programming phase to be completed, the Hypercard storyboard model was extended by the use of off-the-shelf XCMD's to enable it to control the laserdisc playback on a second monitor. Because the storyboard was already fully featured and contained the full screen text, this took just one day. The laserdisc was then tested and the go-ahead given for the pressing of a master disc and final run. The program still had to be tested under the final conditions, that is, running on a 386 PC, with video-playthrough via a MIC 3000 card, but the Hypercard prototype was a valuable additional test and enabled programming to proceed with confidence that no changes were going to be sprung at the last minute. It was also invaluable in demonstrating the program at a seminar which took place before the C-programmed version was available, allowing a wider audience of consultant specialists to verify film changes earlier recommended.

Conclusions

The purpose of this article has been to argue that the flexibility of present design tools means they should not be considered as contributing solely to the crafting of the product at the end of the development process. Instead, they can contribute at many stages of that process. The tools can, in fact, contribute to the solution of day-to-day problems, speeding development times and cutting costs, making tasks more interesting and less burdensome.

Storyboarding was chosen as a focus to illustrate how an integrated approach to the design process can help design teams. If storyboarding has a role to play in the design process then studying how to go about it the right way must influence product design. Indeed, I would argue that, for complex multimedia products and in extended working teams, detailed storyboarding is essential.

The technique of interactive storyboarding was described and recommended as a supplementary design aid, not as a substitute for paper-based documentation. It may be that the technique does blur the distinction between program test-of-concept models, storyboards and prototypes, but clarity should be restored by considering that all these modelling techniques form part of a spectrum in a process to ensure that what is designed is wanted and will work. Indeed, the design benefits to be gained by interactive storyboarding should more than compensate the time required to re-evaluate basic modelling concepts and adjust to this more flexible and involving approach.

References

Andriole, S. (1987), "Storyboard Prototyping for Requirements verification", Large Scale Systems in Information and Decision Technologies, v.12, n.3, pp.231-247.
Bove, T. and Rhodes, C. (1990), Que's Multimedia Handbook, Carmel, Indiana, USA.
Bunzel, M. and Morris, S. (1994), Multimedia Applications Development, New York, USA.
Hoffos, S., Sharpless, G., and Lewis, N. (1992), The CD-I Designer's Guide, London.
Holsinger, E (1993), MacWeek Guide to Desktop Video, Emeryville, CA, USA, p.141.
Katz, S. (1991), Film Directing Shot by Shot, California.
Kendall, K. and Kendall, J. (1992), Systems Analysis and Design, New Jersey, USA, 2nd edn.
Marsden, K. and Aiken, P. (1993), "Experiences Using Cooperative Interactive Storyboard Prototyping", Communications of the ACM, v.36, n.6, pp.57-64.
Philips IMS (1992), The CD-I production Handbook, Wokingham, England.
Preston, J.M., ed. (1991), Compact Disc-Interactive: A DesignerÕs Overview, Deventer, The Netherlands, 2nd edn.

Blogging and Teaching

I found this page from the teachingenglish.org website...

Blogging for ELT
Graham Stanley, British Council, Barcelona

This article takes a look at blogging, which is becoming increasingly popular as a language learning tool. It gives an overview of blogging websites, suggests why you might want to use them, and gives some practical advice on setting up blogs for use with your own classes.

What is a blog?
A blog (short for weblog) is a frequently updated website that often resembles an online journal. It's so easy to create and update a blog - it requires only basic access to the Internet, and a minimum of technical know-how. Because of this, it is one of the easiest ways to publish student writing on the WWW. It's almost as easy as sending an email.

Nowadays, blogs can also display photos and some people are using them with audio and even video, but this article will concentrate on the basics, showing how a simple text-based blog can be used to great effect with your English language learners.

Top of page

Types of blogs used in language teaching
Aaron Campbell (2003) has outlined three types of blogs for use with language classes:

• The Tutor Blog is run by the teacher of a class. The content of this type of blog can be limited to syllabus, course information, homework, assignments, etc. Or the teacher may choose to write about his or her life, sharing reflections about the local culture, target culture and language to stimulate online and in-class discussion. In this type of blog, students are normally restricted to being able to write comments to the teacher's posts. A great example of this is Aaron Campbell's own 'The New Tanuki' http://thenewtanuki.blogspot.com/
  
  
• The Class Blog is a shared space, with teacher and students being able to write to the main area. It is best used as a collaborative discussion space, an extra-curricular extension of the classroom. Students can be encouraged to reflect in more depth, in writing, on themes touched upon in class. Students are given a greater sense of freedom and involvement than with the tutor blog. A very good example of what has been done with this type of blog is Barbara Dieu's 'Bee Online' http://beeonline.blogspot.com/) and 'Bee Online 2' http://beeonline2.blogspot.com/
  
  
• The Learner Blog is the third type of blog and it requires more time and effort from the teacher to both set up and moderate, but is probably the most rewarding. It involves giving each student an individual blog. The benefit of this is that this becomes the student's own personal online space. Students can be encouraged to write frequently about what interests them, and can post comments on other students' blogs. For examples, see the links to learner blogs from the class blog and tutor blog examples above.

Of course, teachers who decide to use blogs often use a combination of Tutor or Class blog and Learner blogs, with hyperlinks connecting them.

Top of page

Why blog?
So, why should you blog with your students? There are many reasons why you may choose to use weblogs with students. One of the best reasons is to provide a real audience for student writing. Usually, the teacher is the only person who reads student writing, and the focus of this reading is usually on form, not content. With weblogs, students can find themselves writing for a real audience that, apart from the teacher, may include their peers, students from other classes, or even other countries, their parents, and potentially anyone with access to the Internet.

Here are some other reasons for using blogs:

• To provide extra reading practice for students.
  This reading can be produced by the teacher, other students in the same class, or, in the case of comments posted to a blog, by people from all over the world.
• As online student learner journals that can be read by their peers.
  The value of using learner journals has been well documented. Usually they are private channels between teacher and student. Using a blog as a learner journal can increase the audience.
• To guide students to online resources appropriate for their level.
  The Internet has a bewildering array of resources that are potentially useful for your students. The problem is finding and directing your learners to them. For this reason, you can use your tutor blog as a portal for your learners.
• To increase the sense of community in a class.
  A class blog can help foster a feeling of community between the members of a class, especially if learners are sharing information about themselves and their interests, and are responding to what other students are writing.
• To encourage shy students to participate.
  There is evidence to suggest that students who are quiet in class can find their voice when given the opportunity to express themselves in a blog.
• To stimulate out-of-class discussion.
  A blog can be an ideal space for pre-class or post-class discussion. And what students write about in the blog can also be used to promote discussion in class.
• To encourage a process-writing approach.
  Because students are writing for publication, they are usually more concerned about getting things right, and usually understand the value of rewriting more than if the only audience for their written work is the teacher.
• As an online portfolio of student written work.
  There is much to be gained from students keeping a portfolio of their work. One example is the ease at which learners can return to previous written work and evaluate the progress they have made during a course.
• To help build a closer relationship between students in large classes. Sometimes students in large classes can spend all year studying with the same people without getting to know them well. A blog is another tool that can help bring students together.
  

Top of page

Where to start
There are lots of sites where you can set up a blog for free, but perhaps the best known and one of the most reliable and simple blogging tools to use with students is Blogger (http://blogger.com). It takes only fifteen minutes from setting up an account to publishing the first post using this valuable tool.

The teacher sets up the tutor blog or a class blog. With a Class blog, students will need to be invited to participate by e-mail. Learner blog accounts can either be set up beforehand by the teacher, or done at the same time with a whole class in a computer room. The former gives the teacher more control of student accounts, but some advantages of the latter is that learners are given more choice (of username, design of the blog, etc) and a greater sense of 'ownership' of their new virtual writing space.

Top of page

Tips for managing learner blog settings

• Use the 'Settings' in Blogger to add yourself (under Members) as Administrator of the learner blog. This is invaluable if students later forget usernames or passwords, and can also help if inappropriate posts are published
• Make sure you change the setting and turn the 'Comments' feature on. This will allow the others to respond to things the students write on their learner blogs.
• Also in 'Settings', you will find an option to receive an email whenever a student publishes their blog. This will save you time regularly checking learner blogs to see if any of your students have posted. Another way of being informed of this is to use the 'Site Feed' function (discussed further below).

Top of page

Keeping students interested
Many teachers who start to use blogs find the novelty factor is enough to create student interest in starting to use them. However, blogs work best when learners get into the habit of using them. If learners are not encouraged to post to their blogs frequently, then they can quickly be abandoned. A failed experiment. Here, the teacher in the role of facilitator is vital for maintaining student interest. Here are some ideas to how this can be done:

• Respond to student posts quickly, writing a short comment related to the content. Ask questions about what the learner writes to create stimulus for writing.
• Students should be actively encouraged to read and respond (through the commenting feature of the blog) to their classmates.
• Writing to the blog could be required, and it may form part of the class assessment. Students should be encouraged to post their writing homework on the blog instead of only giving it to the teacher.

Top of page

Some ideas for activities

• Mystery guest. Invite another teacher or someone from another school or country as a mystery guest to your blog. Ask the students to engage him or her in dialogue and guess their identity.
• Project work. A blog is an ideal space for developing a project, especially if the project is a shared one between several classes or even classes in different countries.
• International link-ups. Contact another educational establishment to see if they are interested in a joint blogging project. Students can write about their lives, culture, interests, etc, and be encouraged to read about the other class and respond by writing comments.
• Photoblog. If you plan on using photographs in your blog, there are lots of tools available to help you. Flickr http://www.flickr.com makes publishing photographs to blogs easy. If you want to make photographs central to the blog, however, it is better to use a blogging tool such as Buzznet http://www.buzznet.com, which is a photo publishing tool and blog rolled into one.

Top of page

Pitfalls to watch out for

• Unwanted comments. To avoid unwanted comments, you can always restrict comments to people in the class or to registered bloggers.
• Correction. It is difficult to use a blog for correcting students. Student written work can always be corrected before posting to the blog, or you can do class correction sessions using work published in the blogs.
• Privacy. By their very nature, most blogs are public. Anyone with access to the Web can find and read a blog, and write comments (if this feature has been turned on). If privacy is an issue, then you will be better off using a blogging tool that allows different levels of access rights. Live Journal http://www.livejournal.com is a good choice, and is particularly popular with teenagers . Live Journal allows the setting up of a closed community, which could be restricted to the members of a class or to a wider circle including other classes, parents, etc.