I hope u Guyz find it helpful.

1. Aneesa Rahman

2.  Designing
 Designing structure
 Navigation
 Structural depth
 Hot spot, hyper links, buttons
 Icons
 Designing user interface
 Novice/expert modes
 GUIS
 Graphical approaches
 Audio interface
 Multimedia design case history
 Story boarding a project
 Putting it together
University of Education,Okara campus 2

3.  Design is thinking, choosing, making, and doing.
 It is shaping, smoothing, reworking, polishing, testing,
and editing.
 Talent in graphic arts, video, and music; and ability to
conceptualize logical pathways through information are
all focused to create the real thing.
University of Education, Okara campus 3

4.  approaches to creating an original interactive multimedia
design.
 Detailed storyboard
 Less detailed story board
University of Education,Okara campus 4

5.  The way of arrangement of text, graphic, sound, and
video elements (or objects)
 Great impact on user
University of Education,Okara campus 5

6.  should be started early in the planning phase
 outline the connections or links among various areas of
contents
 Help to organize messages and contents
 A navigation map (or site map) provides a table of contents
as well as a chart of the logical flow of the interactive
interface.
University of Education,Okara campus 6

7.  Linear: Users navigate sequentially, from one frame or bite of
information to another. E.g. Next button
 Hierarchical: Also called “linear with branching,” since users
navigate along the branches of a tree structure that is shaped by
the natural logic of the content. e.g. drop down
University of Education,Okara campus 7

8.  Nonlinear: Users navigate freely through the content of the project,
unbound by predetermined routes. E.g. Wikipedia
 Composite: Users may navigate freely (nonlinearly) but are occasionally
constrained to linear presentations of movies or critical information and/or
to data that is most logically organized in a hierarchy.
University of Education,Okara campus 8

9. STRUCTURAL DEPTH
Depth structure
 represents the complete
navigation map and describes all
the links between all the
components of your project.
Surface structure
 represents the structures
actually realized by a user
while navigating the depth
structure.

10. HOT SPOTS, HYPER LINKS,
BUTTONS
 Multimedia authoring systems allow to make any part of the screen, or
any object, into a hot spot.
 When users click a hot spot at that location, something happens
 Makes multimedia not just interactive, but also exciting
 The hot spot connects the user to another part of the document or
program or to a different program or web site, it is referred to as a link
or hyperlink.
 Meaningful graphic image that you click or “touch” to make something
happen, is Button

11.  constitute a suite of image resources that are linked to and identify an
application, file, volume, or service.
 Can also replace an icon with your own by simply by right-click it;
 select Properties> Customize tab > Change Icon.>Browse your saved
icon and click OK.
 Building and saving icon files is simpler using an icon editor such as
IcoFX or the ICOformat plugin for Photoshop
 you can use a system icon within your project, by capture or grab it off
the screen and place it directly into your project as a bitmap.
 Some Browsers automatically show tiny 16 × 16 pixel icon in the root of
a web site.

12.  You can also add icon in your website by using following tag
 <link rel="icon" type="image/gif“
href="http://www.yourwebsite.com/yourIcon.gif">

13.  The user interface of your multimedia product is a blend of its graphic
elements and its navigation system.
 If your messages and content are disorganized and difficult to find, or
if users become disoriented or bored, your project may fail.
 Poor graphics can cause boredom.
 Poor navigational aids can make viewers feel lost and unconnected to
the content;
 viewers may just give up and quit the program.
 It includes
 Novice/Expert Modes, GUIS ,Graphical approaches and Audio interface

14.  two types of end users: those who are computer literate and those
who are not.
 Creating a user interface that will satisfy both types
 Simplest solution is to provide a modal interface,
 Where the viewer can simply click a Novice/ Expert button and
change the approach of the whole interface to be either more or less
detailed or complex.
 Modal interfaces are common on bulletin boards,
 for example : allowing novices to read menus and select desired
activities, while experts can simply type an activity code directly
into an executable command line and save their time.

15.  In multimedia projects, modal interfaces are avoided because
they tend to confuse the user.
 only a minority of users are expert, and so the majority are
caught in between and frustrated.
 The solution is to build
 your multimedia project to contain plenty of navigational power,
providing access to content and tasks for users at all levels, as
well as a help system to provide some hand-holding and
reassurance.
 Present all this power in easy-to-understand structures and
concepts, and use clear textual cues.
 Above all, keep the interface simple! Even experts will balk at a
complex screen full of tiny buttons and will appreciate having
neat and clean doorways into your project’s content.

16. GUI
 GUI supported by windows and Macintosh (Mac by Apple)
 Simple, consistent, and quickly point-and-click style
 Multimedia authoring systems provide tools to design and implement new
graphical user interface from scratch
 It’s best for button design, visual and audio feedback, and navigation
structure.
 Avoid hidden commands and unusual keystroke
 No instruction manual or special training required
 Do not have to remember keywords/special codes

17. GRAPHICAL APPROACHES
 Graphics are special set of fine art skills requires to design
systems
 graphic artists must well known with rapidly changing
features, techniques, applications, and creative tools
 Artist work e.g. broad design choices, cartoon stick figures
for kid’s game ,illustrations for a medical reference etc.
 graphic artwork must be appropriate for the end user
Things That Work
 Neatly executed contrasts: big/small, bright/dark etc.
 Simple screens with lots of white space
 Eye-grabbers as single brightly colored object on screen
 Shadows and drop shadows
 Shaded objects and text in 2-D and 3-D

18. THINGS TO AVOID
 Busy screens
 Clashes of color or picture with a lot of color contrast
 Squeaks when a button is clicked
 Fancy pattern borders
 Too many numbers, too many words
AUDIO INTERFACES
 Interface include sound elements to affect the audience
 It can be background music, effects for button clicks, effects synced to
animations
 Choose music that fits the content
 Always provide a toggle switch to disable sound
 Always test a project that contains sound with potential users.

19.  This presents an example of the design process for a simple
multimedia project about the construction and launch
 This project was initially crafted in SuperCard (Mac based
only) but it was later ported to Adobe’s Director (window +
Mac)
 It consist of :
 Storyboarding a Project

20.  The most eye-catching photograph was chosen as a background for
the main menu, and,
 the main menu was planned to contain clearly labeled buttons
navigating to linear presentations of each topic area.
 From every screen in the project, users would be able to return to
the main menu.
 Adding a Quit button was necessary, also on the main menu
 Photographs were old color prints that offered poor contrast and
faded colors but Photoshop was available to improve contrast

23.  The photos were placed into the score, and the text was cut
and pasted into fields
 It became clear that users might want to scan rapidly
through the photographs to watch the boat being built,
ignoring the text of the story.
 Images that did not fit into the photo
 This was the third time the navigation changed, proving that
you can continue to hang elements on a menu until the
menu screen is too busy

24.  Firstly, it is terrifically boring to read a 3,000-word story by
scrolling a long text field.
 Second, the photos were too small to be placed alone on a
single screen.
 So it made sense to combine the story line with the images,
 the story about launching the boat would progress from
beginning to end as the boat was slowly built in the pictures.
 The storyboard changed to that shown in Figure 10-12

28.  Multimedia Making It Work (8th Edition) by Tay Vaughan