1 / 16

Product Design:

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?

cosmo
Download Presentation

Product Design:

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Product Design: Interactivity Design Starter

  2. Objectives: • To examine the ways of making a product interactive • To start designing the interactive features of your multimedia product.

  3. 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

  4. What methods are available? INTERACTIVITY

  5. 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

  6. Buttons... 2 • Dreamweaver provides an array of buttons... • ...and these are also animated with sound effects.

  7. Buttons... • You may also like to design some of your own that are more suitable for the target user...

  8. 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

  9. 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

  10. 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

  11. 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

  12. 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.

  13. 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/

  14. 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!

More Related