160 likes | 319 Vues
Product Design:. Interactivity Design . Starter. Objectives:. To examine the ways of making a product interactive To start designing the interactive features of your multimedia product. Introduction. How will you make your multimedia product interactive?
E N D
Product Design: Interactivity Design Starter
Objectives: • To examine the ways of making a product interactive • To start designing the interactive features of your multimedia product.
Introduction • How will you make your multimedia product interactive? • The product needs to be run using standard browser software • It will need to behave like a website (even though it’s a multimedia product!!) • You will be using Dreamweaver, a web authoring package
What methods are available? INTERACTIVITY
Buttons • Natural & intuitive • Children know that buttons are to be pressed • Wide range of designs • Can be grouped together • Can ne arranged in a pattern
Buttons... 2 • Dreamweaver provides an array of buttons... • ...and these are also animated with sound effects.
Buttons... • You may also like to design some of your own that are more suitable for the target user...
Hot Spots • Hot Spots • Areas defined in a graphic or picture, that contain a hyperlink. • They do not show up in browsers – you can only tell they are there when your mouse pointer changes as you move over it • http://www.platform-end.co.uk/html/musicians.html
Image Maps • Similar to a hot spot • A graphic with a number of hotspots • They present the user with a range of choices • They are not always obvious and force the user to explore the webpage • http://www.image-maps.com/united_states.php?state=Florida
Text Link • Simply a piece of text (a sentence or a word) that forms a hyperlink to another part of the product • Most people are familiar with this concept • Try to use a word or sentence that describes what the link does... Like this.... • Take me to the next page
Rollovers • A rollover image is made up of two images. • The top image is displayed when the page loads, but as you roll your mouse over the image, it changes to show another image • Good for drawing a users attention to something • Examples
Menus • A list of choices presented to the user • If the product is complex, you may need a series of menus • Drop down menus are common • In multimedia products, the menus are often a group of buttons along the edge of a page.
User response methods • A way of collecting information from the user • Text boxes • The user can type in text • This can be adapted depending on how much text you need • List boxes • Presents the user with a lost of boxes • Useful for limited responses • Radio buttons • Can be “selected” • Boolean values, they are either selected or not • Only one can be selected at a time • Check boxes • Similar to radio buttons, but you can select more than one at a time • http://www.amazon.co.uk/
What you need to add to your Product Design: • Menu system • Buttons/rollover buttons • Hotspots/Image Maps • Text links • User response methods • We have to remember that this is offline!