designing for next steps: a forward moving web experience
DESCRIPTION
Getting a visitor to your website is only half the battle. How do you keep them? A lot of attention is put on the "action" items on a homepage, but it's more likely a visitor is landing on an interior page from a Web search or link. Every visual element, content or cue makes an impression with your visitor and influences what next step they take. The last thing you want to do is leave your visitor at a dead end or continuously force them to use the back button. With each page having a defined next step it gives your visitor a forward moving Web experience. The idea is more than just bigger and brighter action buttons. No matter how large you make them your visitors are not going to click if they don't care. Your goal is the design an experience to make your visitors care.TRANSCRIPT
![Page 1: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/1.jpg)
@nickdenardis #CASEV
![Page 2: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/2.jpg)
@nickdenardis #CASEV
Designing for next steps(a forward moving Web experience)
![Page 3: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/3.jpg)
@nickdenardis #CASEV
@nickdenardis
![Page 4: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/4.jpg)
@nickdenardis #CASEV
Associate Director of Web Communications Wayne State Universityhp://wayne.edu/
Host of EDU Checkuphp://educheckup.com/
Curator of EDU Snippitshp://edusnippits.com/
![Page 5: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/5.jpg)
@nickdenardis #CASEV
Information Architecture
“the art and science of organizing and labeling websites, intranets, online communities and
software to support usability.” - Information Architecture Institute
![Page 6: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/6.jpg)
@nickdenardis #CASEV
![Page 7: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/7.jpg)
@nickdenardis #CASEV
![Page 8: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/8.jpg)
@nickdenardis #CASEV
![Page 9: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/9.jpg)
@nickdenardis #CASEV
User Experience“a person's perceptions and responses that result from the use or anticipated use of a
product, system or service"- ISO 9241-210
![Page 10: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/10.jpg)
@nickdenardis #CASEV
Good Design != Good UX
![Page 11: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/11.jpg)
@nickdenardis #CASEV
“To understand any individual screen, you must understand the chain of events that led to a user
going there…”
~ Des Traynor
![Page 12: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/12.jpg)
@nickdenardis #CASEV
![Page 13: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/13.jpg)
@nickdenardis #CASEV
![Page 14: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/14.jpg)
@nickdenardis #CASEV
school.edu/page.asp?id=1245or
go.school.edu/grad-programs
![Page 15: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/15.jpg)
@nickdenardis #CASEV
Good UX = Good Design
![Page 16: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/16.jpg)
@nickdenardis #CASEV
1. Junk2. 3. 4.
![Page 17: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/17.jpg)
@nickdenardis #CASEV
Care.
![Page 18: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/18.jpg)
@nickdenardis #CASEV
First Impressions
![Page 19: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/19.jpg)
@nickdenardis #CASEV
![Page 20: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/20.jpg)
@nickdenardis #CASEV
![Page 21: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/21.jpg)
@nickdenardis #CASEV
Can I trust this page?
Is the information up to date?
Can I use this page as a resource in the future?
What do they want me to do on this page?
![Page 22: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/22.jpg)
@nickdenardis #CASEV
![Page 23: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/23.jpg)
@nickdenardis #CASEV
![Page 24: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/24.jpg)
@nickdenardis #CASEV
![Page 25: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/25.jpg)
@nickdenardis #CASEV
![Page 26: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/26.jpg)
@nickdenardis #CASEV
![Page 27: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/27.jpg)
@nickdenardis #CASEV
![Page 28: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/28.jpg)
@nickdenardis #CASEV
![Page 29: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/29.jpg)
@nickdenardis #CASEV
![Page 30: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/30.jpg)
@nickdenardis #CASEV
![Page 31: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/31.jpg)
@nickdenardis #CASEV
![Page 32: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/32.jpg)
@nickdenardis #CASEV
1. Junk2. Good3. 4.
![Page 33: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/33.jpg)
@nickdenardis #CASEV
Test early, test often.
![Page 34: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/34.jpg)
@nickdenardis #CASEV
![Page 35: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/35.jpg)
@nickdenardis #CASEV
![Page 36: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/36.jpg)
@nickdenardis #CASEV
![Page 37: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/37.jpg)
@nickdenardis #CASEV
![Page 38: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/38.jpg)
@nickdenardis #CASEV
![Page 39: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/39.jpg)
@nickdenardis #CASEV
![Page 40: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/40.jpg)
@nickdenardis #CASEV
![Page 41: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/41.jpg)
@nickdenardis #CASEV
Woopra
![Page 42: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/42.jpg)
@nickdenardis #CASEV
Silos get in the way of your users
![Page 43: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/43.jpg)
@nickdenardis #CASEV
![Page 44: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/44.jpg)
@nickdenardis #CASEV
![Page 45: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/45.jpg)
@nickdenardis #CASEV
![Page 46: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/46.jpg)
@nickdenardis #CASEV
![Page 47: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/47.jpg)
@nickdenardis #CASEV
<script type="text/javascript"> var _gaq = _gaq || []; _gaq.push( ['_setAccount', 'UA-xxxxxxxx-1'], ['_trackPageview'], ['b._setAccount', 'UA-xxxxxxxx-1'], ['b._trackPageview'] );
(function() { var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s); })(); </script>
![Page 48: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/48.jpg)
@nickdenardis #CASEV
![Page 49: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/49.jpg)
@nickdenardis #CASEV
![Page 50: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/50.jpg)
@nickdenardis #CASEV
![Page 51: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/51.jpg)
@nickdenardis #CASEV
![Page 52: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/52.jpg)
@nickdenardis #CASEV
1. Junk2. Good3. Great4.
![Page 53: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/53.jpg)
@nickdenardis #CASEV
Use a human proxy
![Page 54: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/54.jpg)
@nickdenardis #CASEV
![Page 55: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/55.jpg)
@nickdenardis #CASEV
![Page 56: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/56.jpg)
@nickdenardis #CASEV
![Page 57: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/57.jpg)
@nickdenardis #CASEV
![Page 58: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/58.jpg)
@nickdenardis #CASEV
We have limited time
![Page 59: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/59.jpg)
@nickdenardis #CASEV
ClickTale
![Page 60: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/60.jpg)
@nickdenardis #CASEV
People suck atreading online
![Page 61: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/61.jpg)
@nickdenardis #CASEV
![Page 62: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/62.jpg)
@nickdenardis #CASEV
![Page 63: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/63.jpg)
@nickdenardis #CASEV
![Page 64: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/64.jpg)
@nickdenardis #CASEV
1. Junk2. Good3. Great4. Rememberable
![Page 65: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/65.jpg)
@nickdenardis #CASEV
#littlebigdetailshttp://littlebigdetails.com/
![Page 66: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/66.jpg)
@nickdenardis #CASEV
Error messages matter
![Page 67: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/67.jpg)
@nickdenardis #CASEV
![Page 68: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/68.jpg)
@nickdenardis #CASEV
Reduce the barrierto completion
![Page 69: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/69.jpg)
@nickdenardis #CASEV
![Page 70: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/70.jpg)
@nickdenardis #CASEV
![Page 71: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/71.jpg)
@nickdenardis #CASEV
![Page 72: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/72.jpg)
@nickdenardis #CASEV
![Page 73: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/73.jpg)
@nickdenardis #CASEV
![Page 74: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/74.jpg)
@nickdenardis #CASEV
Creepy!
![Page 75: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/75.jpg)
@nickdenardis #CASEV
Details matter(pixels don’t)
![Page 76: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/76.jpg)
@nickdenardis #CASEV
![Page 77: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/77.jpg)
@nickdenardis #CASEV
![Page 78: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/78.jpg)
@nickdenardis #CASEV
![Page 79: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/79.jpg)
@nickdenardis #CASEV
![Page 80: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/80.jpg)
@nickdenardis #CASEV
![Page 81: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/81.jpg)
@nickdenardis #CASEV
![Page 82: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/82.jpg)
@nickdenardis #CASEV
![Page 83: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/83.jpg)
@nickdenardis #CASEV
![Page 84: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/84.jpg)
@nickdenardis #CASEV
![Page 85: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/85.jpg)
@nickdenardis #CASEV
![Page 86: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/86.jpg)
@nickdenardis #CASEV
1. JunkGet a baseline understanding of your visitors
2. GoodEntice them to get just one step further
3. GreatWalk along their journey
4. RememberableAdding a few #lilebigdetails
![Page 87: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/87.jpg)
@nickdenardis #CASEV
Resources• google.com/analytics
• slickplan.com
• intercom.io
• woopra.com
• clicktale.com
• freegeoip.net
• lilebigdetails.com
![Page 88: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/88.jpg)
@nickdenardis #CASEV
https://speakerdeck.com/u/nickdenardis
Thank You
![Page 89: Designing for next steps: A forward moving Web experience](https://reader033.vdocument.in/reader033/viewer/2022051412/54c66e284a7959e6368b469c/html5/thumbnails/89.jpg)
@nickdenardis #CASEV