Pro Yearly is on sale from $80 to $50! »

User Onboarding Teardown

E33f044700aa7eb3b5aca6a602704fdb?s=47 James Sowers
August 20, 2014

User Onboarding Teardown

A quick overview of the user onboarding process used at UserOnboard.com. Meta much?

E33f044700aa7eb3b5aca6a602704fdb?s=128

James Sowers

August 20, 2014
Tweet

Transcript

  1. How User Onboard Onboards New Users

  2. First, let’s look at what’s above the fold…

  3. Not much. But that’s not necessarily a bad thing.

  4. 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.
  5. 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.
  6. 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?
  7. None
  8. Latest Teardowns

  9. Embedded Post Goes Here Latest Teardowns

  10. Why make me leave the homepage to view a sample

    of your work? Side note: Loved the interview, Sam!
  11. Let’s continue…

  12. Let’s continue…

  13. How?

  14. How? How?

  15. 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?
  16. And that’s basically it. But wait, what’s below the fold?

  17. Sweet! More content! Erm. Shouldn’t this stuff be above the

    fold?
  18. 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?
  19. 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.
  20. Anyways, let’s see what else we’ve got.

  21. 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.
  22. 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.
  23. 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.
  24. Side Note: This feels out of place here. Like it

    was tucked in between these two CTAs at the last minute.
  25. Finally, tucked away in a dusty corner of the User

    Onboarding homepage, we find the lowly email newsletter sign-up.
  26. 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.
  27. Ok, Smart Guy. If you’re so smart. How would you

    design the homepage?
  28. Well, I’ll show you.

  29. First, let’s review. CURRENT HOMEPAGE

  30. CURRENT HOMEPAGE Unclear Navigation Links

  31. CURRENT HOMEPAGE Unclear Navigation Links Poor Use of Space for

    “Showcase”
  32. CURRENT HOMEPAGE Unclear Navigation Links Poor Use of Space for

    “Showcase” What’s the priority? Sales or Subscribers?
  33. CURRENT HOMEPAGE Unclear Navigation Links Poor Use of Space for

    “Showcase” “Out of Nowhere” Blog What’s the priority? Sales or Subscribers?
  34. 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.
  35. Now, here’s my version.

  36. 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.”
  37. UO.COM REDESIGN

  38. Cleared Up The Uncertainty UO.COM REDESIGN

  39. Cleared Up The Uncertainty Dedicated Page For Blog UO.COM REDESIGN

  40. Cleared Up The Uncertainty Embedded Content With Option To Explore

    Further Dedicated Page For Blog UO.COM REDESIGN
  41. 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
  42. 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
  43. That’s all, Folks. Hope you enjoyed the show as much

    as I enjoyed making it!