Your SlideShare is downloading. ×
  • Like
Principles of Interaction Design
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Now you can save presentations on your phone or tablet

Available for both IPhone and Android

Text the download link to your phone

Standard text messaging rates apply

Principles of Interaction Design

  • 373 views
Published

An Introduction to the Key Principles of Interaction Design

An Introduction to the Key Principles of Interaction Design

Published in Design , Business , Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
373
On SlideShare
0
From Embeds
0
Number of Embeds
2

Actions

Shares
Downloads
13
Comments
0
Likes
2

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. { PRINCIPLES OF INTERACTION DESIGN } 1 AnIntroductiontotheKey PrinciplesofInteraction Design
  • 2. { PRINCIPLES OF INTERACTION DESIGN } 2 Howdoyoubegintocreatevisualsolutionstosolve complexuserinteractionproblems? Discuss smartdevicescomputersinformationportalphonescontro
  • 3. { PRINCIPLES OF INTERACTION DESIGN } How do interaction designers succeed at creating design solutions that are powerful, effective, func- tionalandaestheticallyappealing? Discuss 3
  • 4. { PRINCIPLES OF INTERACTION DESIGN } 44 Why should an MAstudent consider and apply the PrinciplesofInteractionDesigntotheirworkpattern withinthedesignprocess? Discuss
  • 5. { PRINCIPLES OF INTERACTION DESIGN } 5 WHY USE PRINCIPLES OF INTERACTION DESIGN? DesignPrinciplescanhelpguideadesignerthoughthedesignpro- cess.channelLingcreativethinking,andcanbeusedtoselfeval- uateandcritiquedesignconcepts. ““ Channel
  • 6. { PRINCIPLES OF INTERACTION DESIGN } 6 WHY USE PRINCIPLES OF INTERACTION DESIGN? FacilitatingYOU(thestudent)tobecomeamoreproductiveandef- fective designer and helping you focus on the key features of an effectivedesign. “ “ Productivity
  • 7. { PRINCIPLES OF INTERACTION DESIGN } 7 WHY USE PRINCIPLES OF INTERACTION DESIGN? All the Design principles interact in complex ways, often effecting and conflicting with each other, but helping focus the designer to featuresofeffectivedesign. “ “ Interact note:
  • 8. { PRINCIPLES OF INTERACTION DESIGN } 8 BeforeconsideringwhichprinciplesofInteractionDesigntoapply. Youshouldfirstconsiderthree maininfluences
  • 9. { PRINCIPLES OF INTERACTION DESIGN } 9 CONSIDERATIONS OF INTERACTIVE DESIGN TASK(S)andcontext What Task do you require your target demographic to preform, andinwhatenvironment? Scenario“ “
  • 10. { PRINCIPLES OF INTERACTION DESIGN } 10 CONSIDERATIONS OF INTERACTIVE DESIGN TARGETMARKET Whoisyourtargetdemographic? Personia“ “
  • 11. { PRINCIPLES OF INTERACTION DESIGN } 11 CONSIDERATIONS OF INTERACTIVE DESIGN TECHNOLOGIES What technology do you have at yourdisposal? Construct application “ “
  • 12. { PRINCIPLES OF INTERACTION DESIGN } 12 Therearetwooverarchingprinciples: Comprehensibility Learnability “ “
  • 13. { PRINCIPLES OF INTERACTION DESIGN } 13 COMPREHENSIBILITY An interface design that is easy to comprehend willbeefficientandeffective. core effective“ “
  • 14. { PRINCIPLES OF INTERACTION DESIGN } 14 { PRINCIPLES OF INTERACTION DESIGN } COMPREHENSIBILITY A design’s comprehensibility is highly dependent onthewayinwhichtheinterface communicatesitsfunctionality core communicate“ “
  • 15. { PRINCIPLES OF INTERACTION DESIGN } 15 LEARNABILITY Thelearnabilityofadesignisbasedonit’scompre- hensibility, if the user can’t understand it, theycan’tlearnit. core understand“ “
  • 16. { PRINCIPLES OF INTERACTION DESIGN } 16 ease of Access Mostpeopleareinterestedincompletingtheirtasksanddonotenjoy strugglingwiththetoolstheyneedtouse. 6 rules easeofaccess senseofcontrol securily&safely usercentered
  • 17. { PRINCIPLES OF INTERACTION DESIGN } 17 VISIBILITY Ensurefunctionsarevisibletotheuser,sotheycan seewhatisavailableandwhatthesystemisdoing. ease of Access
  • 18. { PRINCIPLES OF INTERACTION DESIGN } 18 { PRINCIPLES OF INTERACTION DESIGN } VISIBILITY Designers Dilema: Show everything at once, and the result is chaos.Don’tshoweverything,andtheninformationgetslost. ease of Access AndroidInterface
  • 19. { PRINCIPLES OF INTERACTION DESIGN } 19 CONSISTENCY Be consistent in the use of design features and be consistentwithsimilarsystems. ease of Access
  • 20. { PRINCIPLES OF INTERACTION DESIGN } 20 consistentfeatures symbolstypographylayoutcolourinteractionsinstruction
  • 21. { PRINCIPLES OF INTERACTION DESIGN } 21 functional layeringease of use 80/20Rule- 20%ofthefunctionalityisused80%ofthetime. Makethemostcommonorimportantfunctions easiesttofind.Hideorreducingtheprominenceof infrequentlyusedfunctions. hierarchyofcontrols
  • 22. { PRINCIPLES OF INTERACTION DESIGN } 22 hierarchyofcontrols
  • 23. { PRINCIPLES OF INTERACTION DESIGN } 23 simplicity Showtheuseronlywhatisnecessary This Involves limiting the actions that can be per- formedatanyonetime. ease of use
  • 24. { PRINCIPLES OF INTERACTION DESIGN } 24 Bymatchingthesequenceofsteps,layoutofinformationandtermi- nologyusedtothepriorexperiencesoftheuser, youwillreducethe discomfortoflearninganewsystem. familiarityease of Access
  • 25. { PRINCIPLES OF INTERACTION DESIGN } 25 { PRINCIPLES OF INTERACTION DESIGN } ease of Access Wherethisisnotpossiblebecausetheconceptisdistinctlydifferent fromwhathasgonebefore,tryusingsuitablemetaphorstohelpthe userrelate. familiarity
  • 26. { PRINCIPLES OF INTERACTION DESIGN } 26 AFFORDANCE Design your assets so that they areclearwhattheyarefor. Affordance refers to the proper- tiesassetshaveorarepreceived tohave. ease of Access buttonsareforpressing“ “
  • 27. { PRINCIPLES OF INTERACTION DESIGN } 27 sense of control 3 rules easeofaccess senseofcontrol securily&safely usercentered Providetheuserwithasenseofbeenincontrol.
  • 28. { PRINCIPLES OF INTERACTION DESIGN } 28 NAVIGATION Providesupporttoenabletheusertomovearound thepartsofthesystem. sense of control Make the steps of navigation obvious andlodgical.
  • 29. { PRINCIPLES OF INTERACTION DESIGN } 29 CONTROLsense of control A sense of Control is enhanced if there is a clear, logical map- pingbetweenthecontrolsandtheeffecttheyhave. Makeitclearwhoor whatisincontrol “ “
  • 30. { PRINCIPLES OF INTERACTION DESIGN } 30 FEEDBACK Feedback from the system to the users, so they knowwhateffecttheiractionhavehad. Constantandconsistentfeedbackwillenhancethefeelingofusercontrol sense of control Rapidlyfeedback information
  • 31. { PRINCIPLES OF INTERACTION DESIGN } 31 AppBuilder
  • 32. { PRINCIPLES OF INTERACTION DESIGN } 32 securely & safely 2 rules easeofaccess senseofcontrol securily&safely usercentered Howsafelyandsecurlytheusersexperienceis.
  • 33. { PRINCIPLES OF INTERACTION DESIGN } 33 RECOVERY Particularly from mistakes and errors. Enable this quicklyandeffectively. SECURELY & safely Enablerecovery fromactions
  • 34. { PRINCIPLES OF INTERACTION DESIGN } 34 CONSTRAINTSSECURELY & safely physical“ “ RestrictthepossibleactionsthatcanbeperformedthusHelpingpre- ventusersfromselectingincorrectoptions.
  • 35. { PRINCIPLES OF INTERACTION DESIGN } 35 Restrictthepossibleactionsthatcanbe performed thus Helping prevent users fromselectingincorrectoptions. cultural“ “ { PRINCIPLES OF INTERACTION DESIGN } CONSTRAINTSSECURELY & safely
  • 36. { PRINCIPLES OF INTERACTION DESIGN } 36 User Centered 5 rules easeofaccess senseofcontrol securily&safely usercentered Identifingdifferentpeoplesexperiencesandreactingto thosedifferences.
  • 37. { PRINCIPLES OF INTERACTION DESIGN } 37 FLEXIBILITYuser centered Accommodatingpeoplewithdifferentlevelsofexperience. Provide people with the opportunity to change the way things look andbehavesothattheycanpersonalisethesystem. Allowusersmultiple waysofdoingthings
  • 38. { PRINCIPLES OF INTERACTION DESIGN } 38 Photoshopinterface
  • 39. { PRINCIPLES OF INTERACTION DESIGN } 39 cognitive load CognitiveLoadTheorysuggeststhatusercanabsorbandre- taininformationeffectivelyonlyifitisprovidedinsuchawaythatit doesnotoverloadtheirmentalcapacity. Reducetheamountofloadthatisbeing placedupontheusersworkingmemory user centered “ “
  • 40. { PRINCIPLES OF INTERACTION DESIGN } 40 VISUAL DESIGN visualdesignprinciples: whitespace,contrast,similarity,emphasis, proximity,repetition,unity. user centered alignment“ “
  • 41. { PRINCIPLES OF INTERACTION DESIGN } 41 CONVIVIALITYuser centered Interactivesystemsshouldbepolite,friendly andpleasent.Designforpoliteness [instantgratification]-[responsive] [trustworthy] [wellinformed]-[forthcoming]-[clarity]-[quality]
  • 42. { PRINCIPLES OF INTERACTION DESIGN } 42 engagement The product your designing must engage with the targetdemographic. user centered demographic Measurestheextenttowhichauser hasameaningfulexperience.
  • 43. { PRINCIPLES OF INTERACTION DESIGN } 43 engagement Theusershouldfeelliketheyareincontrolofthe experienceatalltimes,theymustconstantlyfeel likethey’reachievingsomething. user centered 25seconds“ “
  • 44. { PRINCIPLES OF INTERACTION DESIGN } 44 1. Identify theindividualprin- ciples of interaction design that where applied, analysis and evaluate the benefits brought to thefinalproduct. 2. Discuss how the different principles complemented and contradicted each. Identify why certain principles were given prominence, while others were omitted. exercise InGroupsofthree,selectanartefactofappliedinteractiondesign: