Interface and Architecture


Background
As your Team begins to design a program, two areas of concern must constantly be considered and balanced against each other. The Interface is a way of reminding everyone that this material is being developed for a person to use, personally and individually. If we do not remember the personal nature of our audience we will not enable each person to understand the message as fully as we might hope. The Architecture represents the message that we seek to build that will help the recipient to live and thrive in new ways. Chapter 3 is one of the longest chapters and covers a broad spectrum of ideas.

To begin working with PowerPoint, the attached list of keyboard shortcuts might prove useful. Keyboard Shortcuts.

You may wish to review the multimedia checklist and flow chart showing the progress of developing a multimedia project in Chapter One. Multimedia Checklist. The process chart, process chart.png, may help one see how the project flows. (We go only as far as Narration and Multimedia, however, in this course.)

Building the Storyboard
Be sure you understand how to do a simple storyboard, as presented in Chapter Two -- pay particularly close attention to "Why Storyboard?" (page 46, Kindle Location 637) and Types of Storyboards (page 47, Kindle Location 649). Essentially, a storyboard is a plan. There are many ways to plan. Good quality, useful multimedia projects either will require several people working on them, or one person working over a fairly long period of time, because good quality work in a variety of media takes time. In either case, a good plan is essential to keep everyone working together productively, and to keep a task on course (without drifting, scope creep, etc.) over time.

The text lays out several options for storyboarding with a possible implication that any approach might work equally well. Broadly speaking that may be true, but my experience suggests there are two parallel lines of development in a large multimedia project, both of which need planning and maintenance as the project develops. As shown in Figures 2.16 and 2.17 the navigation of a project must be considered up front in the development of the project so that everyone has a good idea of what the "big picture" is for the project.

Just as important, though, is the text storyboarding, as shown in Figure 2.22, that helps track what the narrative will be and what media elements will be needed with some description of those media elements. With this text storyboard it makes possible different team members to work on different screens at the same time and still maintain a cohesive effort. Also, if working solo, one can work on screens out of sequence that generally helps expedite the overall project so that "easier to visualize" slides can be done rapidly and one can come back to the more difficult slides with a different perspective after doing the slides around it.

Chapter Three begins with an explanation of what makes up a good Graphic User Interface (GUI - pronounced "gooey").

Navigation Tools and Action Buttons
On page 64 (Kindle Location 789) tutorials are referenced concerning using Action Settings and Navigation that have been uploaded to this site for your use. Thomas Toth's quote on page 68 (Kindle Location 818) sums up the importance of these action settings and navigation strategies well:
"Interface design has nothing to do with instructional design but has everything to do with effective e-learning. Proper placement of buttons, navigational aids, and screen tools can make or break your e-learning project, no matter how effective the instructional design."

Eye Movement and Placement of Items
The points made in this section are important, but may not be well conveyed in comparing Figures 3.12 and 3.13 for the "Z" design concept. Be sure to understand Figure 3.14 in terms of where the most important information should be placed on the screen, generally. Obviously, there will be needs for variation on individual screens if one is to maintain interest, however. Figures 3.15-18 each make good points and should be studies carefully for what each conveys.

Building the GUI
There are two very similar descriptions of how to work with slide masters that vary mainly in the version of PowerPoint used. Unfortunately there isn't a version specifically for PowerPoint 2010, so one may have to make some adjustments if not using PowerPoint 2007 or earlier versions of PowerPoint. A simple PowerPoint program is provided to use for the application of one's experiments with the slide master technology. Creating Slide Master 2007. Creating Slide Master (Older versions). Sample PowerPoint file.

GUI Examples
The first example of a Slide Master is shown and described in Figures 3.23 and 3.24. The format used in Figures 3.25-27 is a little more complicated, so the following video should help one understand what is going on there. (You may need to enlarge the video.) Tabbed GUI

Architecture
The last section of Chapter 3 talks about components of an e-learning module, rather than the overall visual display. In this way, the emphasis is on the overall presentation of an e-learning package. Since it is talking about beginning or introductory components, then items that typically go at the "end" of all components, like glossaries and site maps, one could begin to see e-learning in a more sequential presentation mode than usually is the case. Do not be fooled! Within the bookends of structure an e-learning program will wind about very liberally. :-)

Performance Record
Using the skills gained in this week's reading and exercises above, prepare a background template for a topic concerned with teaching or something you teach. You do not have to fill in the content beyond the title and headings for the topic that you would use to establish a menu of activities or points of exploration within that topic. You may use tabs across the top or side, or put your subdivisions in a menu down the side.

Be sure to consider the use of:
  • colors that
    • complement one another aesthetically
    • provide adequate contrast to ensure text is readable.
  • graphic patterns or images to
    • identify screen elements (titling, menu, content and navigation features, especially)
    • contribute to the overall layout of the screen using the "Z" concept
  • an overall appearance that works with the topic set forth.

Work with your partner to discuss these points and to receive feedback on your ideas, but each person is responsible for uploading a small PowerPoint file with one's own work. Your discussion under ACTS for this week should address why you chose the colors, patterns/images, and overall appearance you have for this activity. Be sure to include points from discussion of these issues with your partner.

Architecture-Navigation Background Template