Download - Consistency - ID for Devz at Hacker Dojo
![Page 1: Consistency - ID for Devz at Hacker Dojo](https://reader033.vdocuments.mx/reader033/viewer/2022052820/54c58af94a79599d708b4572/html5/thumbnails/1.jpg)
ConsistencyHow consistency can inspire users to stay longer on your App and to explore more
ID for Devz at Hacker Dojo
Nilo Sarraf
November 2010
![Page 2: Consistency - ID for Devz at Hacker Dojo](https://reader033.vdocuments.mx/reader033/viewer/2022052820/54c58af94a79599d708b4572/html5/thumbnails/2.jpg)
Why Consistency is Gooood
• Less cognitive efforts on learning your App• Less cognitive resources wasted • Increased positive user experience• Happy users!• Users are more likely to come back• Users will spend more time ‘exploring’ your
App
![Page 3: Consistency - ID for Devz at Hacker Dojo](https://reader033.vdocuments.mx/reader033/viewer/2022052820/54c58af94a79599d708b4572/html5/thumbnails/3.jpg)
Two Types of Consistencies
1. Internal Consistency - Within you App• Two identical elements have the same behaviors
and consequences• Internal knowledge within the App
2. External Consistency - Without you App• Elements in your App follow the ‘conventional’
user interface norms• Internal knowledge of the App in comparison to
the external knowledge• Forward Transfer
![Page 4: Consistency - ID for Devz at Hacker Dojo](https://reader033.vdocuments.mx/reader033/viewer/2022052820/54c58af94a79599d708b4572/html5/thumbnails/4.jpg)
Internal Consistency• When two identical elements have the same behaviors and
consequences• Internal knowledge within the App• Limited user cognitive resources is spent
– Learning processes minimized
• Users more willing to explore your App– You are using what users already know– Predictable and learnable Apps– More cognitive resources is spent on exploring your App, as opposed to
learning at the element levels
• Happy users who keep consistently coming back!
NOTE: More important to implement Internal rather than External Consistency
![Page 5: Consistency - ID for Devz at Hacker Dojo](https://reader033.vdocuments.mx/reader033/viewer/2022052820/54c58af94a79599d708b4572/html5/thumbnails/5.jpg)
Consistent Internal Behavior
• Customization– Google Chrome behaves the same even if the
user is allowed to customize
QuickTime™ and a decompressor
are needed to see this picture.
![Page 6: Consistency - ID for Devz at Hacker Dojo](https://reader033.vdocuments.mx/reader033/viewer/2022052820/54c58af94a79599d708b4572/html5/thumbnails/6.jpg)
No Internal Consistency?
• Users will spend time and energy on learning, as opposed to exploring your App
• Frustrated users• Higher percentage of users are likely to leave
your App within amount of short time
![Page 7: Consistency - ID for Devz at Hacker Dojo](https://reader033.vdocuments.mx/reader033/viewer/2022052820/54c58af94a79599d708b4572/html5/thumbnails/7.jpg)
Can You Identify the Links?
![Page 8: Consistency - ID for Devz at Hacker Dojo](https://reader033.vdocuments.mx/reader033/viewer/2022052820/54c58af94a79599d708b4572/html5/thumbnails/8.jpg)
Can You Identify the Links?
LinksLink
Links
Links
![Page 9: Consistency - ID for Devz at Hacker Dojo](https://reader033.vdocuments.mx/reader033/viewer/2022052820/54c58af94a79599d708b4572/html5/thumbnails/9.jpg)
QuickTime™ and a decompressor
are needed to see this picture.
QuickTime™ and a decompressor
are needed to see this picture.
QuickTime™ and a decompressor
are needed to see this picture.
“Consistency makes the interface familiar and predictable.”
(The Windows User Interface Guidelines for Software Design, Microsoft Press)
QuickTime™ and a decompressor
are needed to see this picture.
![Page 10: Consistency - ID for Devz at Hacker Dojo](https://reader033.vdocuments.mx/reader033/viewer/2022052820/54c58af94a79599d708b4572/html5/thumbnails/10.jpg)
These Two Lists, on the Same CD APP, Operate Totally Differently
QuickTime™ and a decompressor
are needed to see this picture.
Play ListCD Track List
![Page 11: Consistency - ID for Devz at Hacker Dojo](https://reader033.vdocuments.mx/reader033/viewer/2022052820/54c58af94a79599d708b4572/html5/thumbnails/11.jpg)
External Consistency
• To be consistent with the ‘conventional norms’
• Forward Transfer – Sounds too dry and not as creative?– The reality is that users want to be able to
recognize various element on your App– Users prefer to explore Apps rather than trying to
learn them all over again
![Page 12: Consistency - ID for Devz at Hacker Dojo](https://reader033.vdocuments.mx/reader033/viewer/2022052820/54c58af94a79599d708b4572/html5/thumbnails/12.jpg)
Icons… FOR EVER!!!
QuickTime™ and a decompressorare needed to see this picture.
QuickTime™ and a decompressor
are needed to see this picture.
QuickTime™ and a decompressorare needed to see this picture.
![Page 13: Consistency - ID for Devz at Hacker Dojo](https://reader033.vdocuments.mx/reader033/viewer/2022052820/54c58af94a79599d708b4572/html5/thumbnails/13.jpg)
Identifying Areas Where You Can Be Consistent
• Elements• Design• Content• Interaction
![Page 14: Consistency - ID for Devz at Hacker Dojo](https://reader033.vdocuments.mx/reader033/viewer/2022052820/54c58af94a79599d708b4572/html5/thumbnails/14.jpg)
Elements
• Footer, side bar, and navigation• Changed look and feel of the site• But the elements are ALWAYS consistently on the same spot
QuickTime™ and a decompressor
are needed to see this picture.
![Page 15: Consistency - ID for Devz at Hacker Dojo](https://reader033.vdocuments.mx/reader033/viewer/2022052820/54c58af94a79599d708b4572/html5/thumbnails/15.jpg)
Design• “Its OK to experiment but keep the design consistent.”• Users remember details • Allow for customization?
![Page 16: Consistency - ID for Devz at Hacker Dojo](https://reader033.vdocuments.mx/reader033/viewer/2022052820/54c58af94a79599d708b4572/html5/thumbnails/16.jpg)
Consistent Design•Consistent UI
•Consistent look and feel across platforms
QuickTime™ and a decompressor
are needed to see this picture.
iPhone App
Android App
![Page 17: Consistency - ID for Devz at Hacker Dojo](https://reader033.vdocuments.mx/reader033/viewer/2022052820/54c58af94a79599d708b4572/html5/thumbnails/17.jpg)
Content
• Consistent in tone, mood, quality, and quantity
• Users get used to the tone – Funny, laid back, adventures, fantasy, serious,
playful… You choose!– Keep the same tense: past or present
• Users get used to the posting ‘schedule’
![Page 18: Consistency - ID for Devz at Hacker Dojo](https://reader033.vdocuments.mx/reader033/viewer/2022052820/54c58af94a79599d708b4572/html5/thumbnails/18.jpg)
Consistent Content
QuickTime™ and a decompressor
are needed to see this picture.
•Hot Devz
•Consistent tone, mood, quantity, quality, and scheduling
![Page 19: Consistency - ID for Devz at Hacker Dojo](https://reader033.vdocuments.mx/reader033/viewer/2022052820/54c58af94a79599d708b4572/html5/thumbnails/19.jpg)
Interaction
• Users choose to interact with your App differently but the interaction still needs to be consistent – Links open in new or existing windows– Displaying pictures– Drag and drops
• Radio buttons that work as check boxes
![Page 20: Consistency - ID for Devz at Hacker Dojo](https://reader033.vdocuments.mx/reader033/viewer/2022052820/54c58af94a79599d708b4572/html5/thumbnails/20.jpg)
Consistent Interaction
QuickTime™ and a decompressor
are needed to see this picture.
•Tony’s tips for iPhone users
•Follows Safari’s bookmark model
•Forward Transfer
Tony’s App
Safari’s App
![Page 21: Consistency - ID for Devz at Hacker Dojo](https://reader033.vdocuments.mx/reader033/viewer/2022052820/54c58af94a79599d708b4572/html5/thumbnails/21.jpg)
Finally: Just Remember These!
• It’s OK to make your own controls but don’t have them behave differently than the conventional existing controls
• If something looks the SAME, it should behave the SAME
• If something looks DIFFERENT, it should behave DIFFERENT
![Page 22: Consistency - ID for Devz at Hacker Dojo](https://reader033.vdocuments.mx/reader033/viewer/2022052820/54c58af94a79599d708b4572/html5/thumbnails/22.jpg)
QuickTime™ and a decompressor
are needed to see this picture.
![Page 23: Consistency - ID for Devz at Hacker Dojo](https://reader033.vdocuments.mx/reader033/viewer/2022052820/54c58af94a79599d708b4572/html5/thumbnails/23.jpg)
References
• UI Usability– http://claudiorikower.com/blog/2009/12/usability-principles-consistency-and-
standards/
• UX Booth– http://www.uxbooth.com/blog/consistency-key-to-a-better-user-experience/
• Pure Caffeine– http://www.purecaffeine.com/2009/12/consistency-youre-just-being-obsessi
ve-compulsive/
• iPhone App UI– http://www.flickr.com/photos/papernapkin/sets/72157622312444768/