Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
User Onboarding Teardown
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
James Sowers
August 20, 2014
Design
0
130
User Onboarding Teardown
A quick overview of the user onboarding process used at UserOnboard.com. Meta much?
James Sowers
August 20, 2014
Tweet
Share
Other Decks in Design
See All in Design
大きな変化の中で、わたしが向き合ったこと #もがく中堅デザイナー
bengo4com
1
1.4k
これからの「Webデザイン」の話をしよう~デザイナーの私が考えるブロックテーマへの対応で変わりゆくデザインの価値~
ds35mm
0
550
Shaolin_Showdown
solmetts
0
290
プラットフォームに馴染むモバイルアプリデザイン / Mobile App UI Design Lunch LT
pixyzehn
0
130
組織の右腕として共創する ー デザインと経営の二つの視点から見えた、新しい支援のかたち/ Designship2025_Nishimura
root_recruit
0
280
デザイナーとエンジニアで 同じ山に登ろう
moco1013
0
140
Correspondence:共に生成していく過程
akiramotomura
0
190
Spacemarket Brand Guide
spacemarket
2
160
ユーザー像を「みてね」らしく可視化する 家族アルバムみてねUXリサーチチームの取り組み
mixi_design
PRO
3
730
【pmconf2025】PdMの頭の中を見える化する体験構造図
kamechi7222222
1
1.9k
「余白」と「欲望」を味方につける ——AI時代のデザインエンジニアリングと「越境」の作法 #KNOTS2026
koyaman
1
1.3k
AIエージェントが対話的なUIを返す!MCP−UIで変わるユーザ体験
daitasu
1
140
Featured
See All Featured
Practical Orchestrator
shlominoach
191
11k
Digital Ethics as a Driver of Design Innovation
axbom
PRO
1
180
It's Worth the Effort
3n
188
29k
Game over? The fight for quality and originality in the time of robots
wayneb77
1
120
How to build a perfect <img>
jonoalderson
1
4.9k
Paper Plane
katiecoart
PRO
0
46k
Build The Right Thing And Hit Your Dates
maggiecrowley
39
3k
Documentation Writing (for coders)
carmenintech
77
5.3k
HU Berlin: Industrial-Strength Natural Language Processing with spaCy and Prodigy
inesmontani
PRO
0
220
The Illustrated Guide to Node.js - THAT Conference 2024
reverentgeek
0
260
The SEO identity crisis: Don't let AI make you average
varn
0
290
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
162
16k
Transcript
How User Onboard Onboards New Users
First, let’s look at what’s above the fold…
Not much. But that’s not necessarily a bad thing.
Navigation makes the choices obvious, but what does ‘Training’ mean?
Hint: It’s actually a landing page for a book Sam wrote. Not a training course or consulting service. Hmm.
So, we’re left with ‘Teardowns’ and ‘Contact.’ I don’t know
Sam yet, so I have nothing to contact him about. Let’s explore teardowns.
Ah! Prominently displayed here. Very nice. But maybe it would
be better to embed the most recent one and use some kind of CTA to get to more teardowns?
None
Latest Teardowns
Embedded Post Goes Here Latest Teardowns
Why make me leave the homepage to view a sample
of your work? Side note: Loved the interview, Sam!
Let’s continue…
Let’s continue…
How?
How? How?
This copy could use another pass. Describe how user onboarding
improves success rates and how I can learn from other web apps. Hint: By reviewing the teardowns, of course! CTA must be made more clear. How? How?
And that’s basically it. But wait, what’s below the fold?
Sweet! More content! Erm. Shouldn’t this stuff be above the
fold?
Sweet! More content! Erm. Shouldn’t this stuff be above the
fold? Answer: It depends. You have to prioritize your CTAs. Is it more important to grow your email list or sell copies of your book?
Sweet! More content! Erm. Shouldn’t this stuff be above the
fold? Whatever it is, pair it with the sample teardowns (sources of credibility & trust) and get it above the fold.
Anyways, let’s see what else we’ve got.
Believe it or not, this button goes to the ‘Training’
page referenced in the main navigation! To me, training = courses or consulting. Book = consumable product.
Believe it or not, this button goes to the ‘Training’
page referenced in the main navigation! To me, training = courses or consulting. Book = consumable product. Maybe there is a better, more intuitive term that could be used in the navigation? “Get The Book” could be an option.
What is this?! Blog posts? I saw no mention of
a blog in the navigation! Might be worth adding if it’s an important part of showing your expertise and generating book sales.
Side Note: This feels out of place here. Like it
was tucked in between these two CTAs at the last minute.
Finally, tucked away in a dusty corner of the User
Onboarding homepage, we find the lowly email newsletter sign-up.
If it’s important, emphasize it, make the button larger and
get it above the fold. If not, maybe it’s worth a text link in the main body copy that directs to MailChimp/Aweber/Whatever.
Ok, Smart Guy. If you’re so smart. How would you
design the homepage?
Well, I’ll show you.
First, let’s review. CURRENT HOMEPAGE
CURRENT HOMEPAGE Unclear Navigation Links
CURRENT HOMEPAGE Unclear Navigation Links Poor Use of Space for
“Showcase”
CURRENT HOMEPAGE Unclear Navigation Links Poor Use of Space for
“Showcase” What’s the priority? Sales or Subscribers?
CURRENT HOMEPAGE Unclear Navigation Links Poor Use of Space for
“Showcase” “Out of Nowhere” Blog What’s the priority? Sales or Subscribers?
CURRENT HOMEPAGE Unclear Navigation Links Poor Use of Space for
“Showcase” “Out of Nowhere” Blog What’s the priority? Sales or Subscribers? Poor placement. Feels like an afterthought.
Now, here’s my version.
Now, here’s my version. Disclaimer: I’m not a designer. This
was my haphazard take on the redesign with Pixlr and about 30 mins of free time. We’ll call it a “wireframe.”
UO.COM REDESIGN
Cleared Up The Uncertainty UO.COM REDESIGN
Cleared Up The Uncertainty Dedicated Page For Blog UO.COM REDESIGN
Cleared Up The Uncertainty Embedded Content With Option To Explore
Further Dedicated Page For Blog UO.COM REDESIGN
Cleared Up The Uncertainty Embedded Content With Option To Explore
Further Dedicated Page For Blog Email Sign-up Form At Or Above The Fold UO.COM REDESIGN
Cleared Up The Uncertainty Embedded Content With Option To Explore
Further Dedicated Page For Blog Email Sign-up Form At Or Above The Fold Information About Book On Homepage UO.COM REDESIGN
That’s all, Folks. Hope you enjoyed the show as much
as I enjoyed making it!