Lunch n’ Learn
User Experience workshop with Kean
1. UX myths & best practice
2. Introduction to Axure
3. Wireframes & prototypes
4. UX resources
What we will cover
1. UX MYTHS & BEST PRACTICE
1. Everyone stand up
2. Place hands on head if you think a
statement is true, hands down if
false
3. If you’re wrong, you’re out
4. Last one standing wins a prize
How to play
Hamburger menus
1. People actively
use the
hamburger menu
Hamburger menus explained
Navigation in sight, is in
mind
• Menu’s are like your work desk,
you don’t put things that are
important and that you will need to
use frequently in your draws.
• Hamburger menus decrease
engagement
Sentence case
2. Sentence case is
easier to read
Sentence case
The quick brown
fox jumps over the
lazy dog
Upper case
THE QUICK BROWN
FOX JUMPS OVER
THE LAZY DOG
Title case
The Quick Brown
Fox Jumps Over
The Lazy Dog
Research shows sentence
case increases legibility
• Faster to read
• For consistency - title case has
more rules & exceptions to
remember
• Sentence case exceptions
obviously exist for names, titles
etc.
Sentence case explained
Title case example on Apple iOS
Sentence case
Navigation labels
3. Icons make
better navigation
than text labels
The best navigation is a
text label
• Provides obvious ‘information
scent’ so the user knows what to
expect
• Icons are hard to memorise, text
labels are easy to read
Navigation explained
The Fold
4. People are most
engaged above the
fold
The highest engaged
content is at the fold and
below
• Consider placement of important
content on fold
• Design should encourage user
to scroll
The fold explained
Forms
5. Drop downs
decrease usability
Radio buttons improve
discoverability and
interaction times
• Show options in plain sight
• Steppers are intuitive and
increase speed
Forms explained
Mobile radio buttons
Scroll behaviour
6. People scroll
more than click
Scrolling is a more natural
behaviour
• Scrolling is a continuation,
clicking is a decision
• Most people start scrolling
people the page has finished
loading
Scroll behaviour explained
Carousels
7. Content in a
carousel will be
most prominent
Carousels: where content
goes to die
• ‘Banner blindness’ causes
people to ignore carousels
• Carousels hide content and are
inaccessible for people with
disabilities
• Better to have a longer page
and stack content then use a
carousel
Carousels explained
2. INTRODUCTION TO AXURE
1. Create wireframes for an iPhone app
2. Turn wireframes into prototype
3. Test on phone
Wireframe and Prototyping Demo
E-commerce user journey
HomeProduct listing
page
Product detail
page
Shopping
cart
4. UX RESOURCES
Want to learn more?
Free UX resources
• Axure training & support
http://www.axure.com/support
• Nielsen Norman Group (evidence based UX)
https://www.nngroup.com/
• AdaptivePath
http://adaptivepath.org/
THANK YOU
Appendix
UX myths & best practice
1. Hamburger menus & navigation
“Hamburger menus hurt UX metrics” https://www.nngroup.com/articles/hamburger-menus/
“Spotify ditches hamburger menu” https://techcrunch.com/2016/05/03/spotify-ditches-the-controversial-hamburger-menu-in-ios-app-redesign/
“Obvious always wins” http://www.lukew.com/ff/entry.asp?1945
2. Sentence case
“Making a case for letter case” https://medium.com/@jsaito/making-a-case-for-letter-case-19d09f653c98#.89wl8vtjo
“Sentence or title case for usability” http://usabilitynews.bcs.org/content/conWebDoc/41752
3. Icons and navigation labels
“Usability testing of icons” https://www.nngroup.com/articles/icon-testing/
4. Above & below the fold
“The fold manifesto” https://www.nngroup.com/articles/page-fold-manifesto/
“There is no fold” http://www.lukew.com/ff/entry.asp?1946
5. Scrolling
“Scroll behabiour across the web” http://blog.chartbeat.com/2013/08/12/scroll-behavior-across-the-web/
“Everybody scrolls” http://www.hugeinc.com/ideas/perspective/everybody-scrolls
“What know is wrong” http://time.com/12933/what-you-think-you-know-about-the-web-is-wrong/
6. Dropdowns
“Why dropdown lists are bad” https://medium.com/apegroup-texts/why-drop-down-lists-are-bad-for-the-user-experience-eeda5cbbd315#.rw3j9tdkb
“Dropdowns should be the UI of last resort” http://www.lukew.com/ff/entry.asp?1950
7. Carousels
“Carousel interaction stats” https://erikrunyon.com/2013/07/carousel-interaction-stats/
“Case against carousels” https://www.smashingmagazine.com/2015/02/carousel-usage-exploration-on-mobile-e-commerce-websites/