The course‎ > ‎

Week 5: Prototype

7 - 13 February 2013
Source: This week we go from design idea - the sketch - to the first stage of implementation - the prototype. Leonardo did a sketch for moving heavy water pumps, but seems to have never made one. Hundreds of years later, another engineer turns the sketch into a proof-of-concept prototype. Not the final product, but enough to clarify the functionality and basic technical issue for meeting the user requirements (
Twitter hashtag: #oldsmooc_w5

This week we go from design idea - the sketch - to the first stage of implementation - the prototype. Leonardo did a sketch for moving heavy water pumps, but seems to have never made one. Hundreds of years later, another engineer turns the sketch into a proof-of-concept prototype. Not the final product, but enough to clarify the functionality and basic technical issue for meeting the user requirements (

This week we look at doing the same for learning designs. By treating teaching as a form of 'design science' we acknowledge the iterative nature of the process - the need to build on what others have done and learned, to experiment and test, and then use this to improve the design (Laurillard, 2012).

The week's activities include prototyping activities for digital learning of the type that could be done by any teacher, no programming experience necessary. The pedagogical patterns developed in Week 4 are a kind of prototyping for a whole lesson, or sequence of online/offline learning activities that can be built around an existing
digital resource of some kind, such as an Open Educational Resource, or interactive program, or wiki. This week we consider how to express the design of the digital resource itself. It is very important for teachers to be able to express their idea for how a digital learning technology should work for the learner. So we look at some simple ways of expressing and testing interactive programs, i.e. ways of prototyping a design.

The closer teachers are to the specification of digital learning designs, the more these programs are likely to achieve useful learning goals. The detail of the design must not be left to the programmers!

The week will be led by Professor Diana Laurillard who will be joined by Marion Manton as co-facilitator.

The Cloudscape that supports this week can be found at :

Learning outcome
  •  You should be able to design, construct and test a simple prototype for a learning design
Activity 1 (Thursday, 35 mins) Introduction to Prototyping
Activity 1.1
Watch the video introduction to the week’s activities (below or at (Download the video transcript).

The slides for this section are available for download. If you have access to a computer you may prefer to use the downloaded  'OLDSMOOC Week 5.1 2013-part1' slides found right at the bottom of this page in the file list by clicking on the arrow on the right.  When you are ready to work through the slides you need to 'view slideshow' to enable the links to work. Note the slides for this section do not have voice over.

Activity 1.2 Skim through the article by Anderson and Shattuck, noting in particular the section on iterative design.
OPTIONAL: Look at a US blog on prototyping for learning design at
, which summarises the main reasons for doing it as:
  1. Even the slightest ambiguities in the beginning will result in serious problems in later iterations – especially the final product.
    Every designer knows the impact of late changes to a design. Prototypes allow for the involvement of stakeholders early in the design discussion by allowing everyone to see and react - long before the final deliverable.

  2. Words can’t adequately describe media-rich interaction.
    While many feel confident that storyboards are effective at conveying design, it’s just too difficult – and risky – to assume everyone is able to interpret media-rich interactions from written documents.
  3. e-Learning interactivity needs to be witnessed and experienced for effective evaluation.
    How the interaction will react and respond to learner decisions and choices is the critical part of the design. This must be witnessed in order to effectively evaluate the appropriateness of the interaction.
  4. Working with prototypes can point out deficiencies and reveal unseen opportunities that are not apparent in sketches and specification documents.
    “Ah-ha!” moments are either wonderful or challenging depending on when they occur in the process. The late ones cause project overruns while early ones can provide inspiration for improved design. Prototypes create early and inexpensive opportunities for “ah-ha!” moments.
These are all excellent reasons. 2 and 3 invite the BUTs: But not everyone can interpret a sketchy ppt interaction as the way it will look when properly designed; But you have to do quite extensive prototyping to do an effective evaluation - the ppt version will give you something, but not a fully effective evaluation of the idea.
Now work through the 'OLDSMOOC Week 5.1 2013-part1'.

Embed gadget

Finally look at this section on the use of PowerPoint to produce prototypes that work. (Note to view this section either look at the slides from 'OLDSMOOC Week 5.1 2013-storyboard-ex' using PowerPoint or view the embedded recording of the presentation.)

Activity 2 (Friday, 40 mins) Prototyping activities

For Activities 2.1 and 2.2 you will practice some of the prototyping activities shown in the slides from Activity 1.2. Microsoft PowerPoint is required
Activity 2.1 Work through slides 'OLDSMOOC Week 5.1 2013 Act2.1' for Activity 2.1, following the instructions to practice doing a mock-up of part of a prototype in Powerpoint (remember you have to 'view slideshow' to get the links and animations to work).
Optional: Do something similar using any other picture and picture elements relevant to your own design context.
Activity 2.2 Work through slides 'OLDSMOOC Week 5.1 2013 Act2.2' for Activity 2.2, following the instructions in the slides to edit a design to add another element of animation. Check your redesign against the completed example.
Optional: Do something similar using any other picture elements relevant to your own design context.

ALTERNATIVE Activity 2 Reviewing prototyping tools.

Activity 2.3: Look for examples of storyboarding tools on the Web, e.g
Balsamiq ( offers readymade elements for sketching how a screen should look.
OmniGraffle for Mac ( offers well-designed graphic elements and page layouts.
None of these tools, including PowerPoint, is designed for education or for creating interesting forms of interactive software or group activities. That's why we've looked at specific examples of how a slide-creation tool can be adapted to work for what we need in learning design. Those that are intended for learning designs, such as Blueprint ( focus more on learner activities, but still may not help with the detail of designing novel forms of interaction with, say simulations, or models, or microworlds, or role-plays, or serious games.
Explore tools that can assist prototyping and drawing out ideas. If find suitable tools help us grow a Prototype Toolbox on Cloudworks. Just as with the design toolbox in Week 3 add any tools and activities you have used or are aware of. Join in this activity to apply for the Resource Gatherer badge.
Activity 3 (Saturday, 50 mins) Preparing a prototype
Activity 3.1 Work back through the types of prototyping discussed in the Activity 1 slides to decide on which one to trial in your own context.

Activity 3.2 Read through 'OLDSMOOC Week 5.2 2013' slides.

Embed gadget

Activity 3.3 Set up your own Prototyping Cloud in Cloudworks and attach it to the Prototyping Cloudscape ( If you are using a blog or other tool for your MOOC work instead of Cloudworks set up a Prototyping page there. Decide on which testing and data collection technique(s) would be most appropriate for your chosen prototyping technique, and post your notes.

Activity 4 (Sat-Sunday, 35 mins) Plan and review a prototyping tool
Activity 4.1 Plan how you would design a prototype for a learning design in your own context, using what tools; decide on your hypothesis (usually, that learners will achieve the intended learning outcome); plan the testing and data collection technique you would use to test the hypothesis/learning outcome and any open evaluation questions about your design.

Activity 4.2 Post your plan to the Prototyping Clouds or page. (As a reminder, the Prototyping Cloudscape can be found here:

Activity 4.3 Read through other participants' Prototype plans and make comments on at least two of them to help them reflect on their idea.
Consider any comments made on your own notes and revise them accordingly.

Activity 5 (Mon-Tuesday, 15-30 mins) Plan and carry out an observation
Activity 5.1 Adapt the typical observation examples in slides 11-12 (see Activity 1 above) to suit your context and set up a short observation task with a colleague or friend. This should be on something related to your prototype but not necessarily produced by you. E.g. if you want to understand what people think about and do during search, you could ask them to find a resource in the OLDSMOOC Bibsonomy. If you want to explore adding information then use Cloudworks (or whichever tools you wish to consider). Having set a task, you must try hard not to help them, and if you do, make a note of what you had to say or do to help them. Record what they said, how long it took them to do things, and their own reflections on the process, and then you will have an observation report that would be useful for evaluating this interface. If you have a way to video record (e.g. smartphone or webcam) then you can also see how useful that is for further analysis. Please feed back your conclusions alongside your plan using the Prototyping Cloudscape or your chose space

Activity 5.2 CONVERGE: 12 noon GMT 12 February DIY hangout This will be a synchronous (recorded) session, which will provide an opportunity to reflect with others on the activities (60 minutes)

Activity 6 (Wednesday, 15 mins)
Activity 6.1 Write a short blog post explaining how you have progressed with your design and what how this has helped your team plan their next steps
Upload your most useful prototyping and plans to your portfolio and post a link to this (for exmaple on Twitter or in the Google discussion group).
Optional: Feedback on the activities and design of this week can be given using the MOOC Feedback Form. You may also want to provide feedback using the PPC tool itself: download the pattern 'Week 5 pattern v2' html file (scroll down to see it in the file list below) by clicking on the arrow to the right of the file title, and upload it to the PPC, and offer evaluation comments in the 'Add Notes' section of any of the teaching-learning activities you would like to comment on, especially noting any activities that were useful, pointless, too easy, or too time-consuming. Then Abstract it, and Share it online, as you did in Week 4, giving it a title with your initials so that we can learn from your comments on the week.

Thank you for any comments offered.

File list
To download files you must click on the downward pointing arrow to the right of the file. Please note that if you click on the title of the PowerPoint files rather than download them using the arrow, you may be able to view the text and images on the slides but the links and animations won't work correctly. The bottom file is an html file and needs to be downloaded before you can use it - again click on the arrow.
Rebecca Galley,
Jan 11, 2013, 5:44 AM
Diana Laurillard,
Dec 2, 2012, 5:12 AM
Feb 1, 2013, 3:20 AM
Feb 1, 2013, 3:16 AM
Feb 1, 2013, 3:15 AM
Feb 1, 2013, 3:15 AM
Feb 1, 2013, 3:27 AM
Week 5 pattern v2
Diana Laurillard,
Dec 1, 2012, 10:21 AM