SBN Onboarding Redesign
Redesigning onboarding for a business software suite so new users can understand account setup, app availability, and in-product guidance without relying on outside assistance.
View Final Design
Make first-time setup clearer for users with different levels of technical confidence.
Problem
New users were failing to complete onboarding at a high rate. The existing process relied on an email with written setup instructions, and many clients with limited technical experience dropped off before completing account creation or logging in for the first time.
Design direction
I redesigned the onboarding experience around clearer app states, persistent in-product guidance, and contextual help so users could understand what was available to them and learn critical tasks directly inside the product.
Map
Review the existing onboarding journey and identify where users lose confidence or drop off.
Sketch
Explore ways to combine app status, onboarding help, and tutorial access.
Decide
Select the strongest direction with stakeholders and storyboard the full flow.
Prototype
Build the onboarding flow with configured, unavailable, and guided-tour states.
Validate
Test with five participants and refine the experience based on observed friction.
A quick look at the onboarding concept
Find where first-time users lose clarity and confidence
I went through the onboarding process end to end and combined that walkthrough with stakeholder interviews to understand where users were dropping off and what support was missing once they entered the product.
Low technical confidence
Nearly half of new users had limited technical confidence, making self-directed setup feel risky rather than empowering.
App status was unclear
Users could not easily distinguish which apps were configured for their account and which were unavailable.
No in-product fallback
There was no tour or help system, so users who became stuck had little recourse beyond contacting support.
Key opportunity
Move onboarding support into the product itself so users can understand account state and access help in context rather than relying on one-time instructions outside the application.
Explore how onboarding help should appear inside the product
The homepage became the critical screen because users needed to understand each app before deciding what to do next. Early sketches explored how app descriptions, setup status, and tutorial access could work together.
Option A · Contextual app help
Tutorial options and configuration status appeared in a contextual panel after selecting an app icon. Help remained tied to the product the user was trying to use.
Option B · Getting Started hub
Tutorial options appeared in a standalone Getting Started area on the landing page. This made help more prominent but less connected to an individual app.
Choose persistent, contextual guidance
After reviewing both directions with stakeholders, we selected Option A. Tying help to each app meant guidance would remain available whenever the user needed it instead of disappearing after a one-time welcome experience.
Selected direction
Use the homepage as the orientation layer, then let users open app-specific guidance that explains status, available actions, and the next step.
Build the onboarding flow with multiple account states
I created a prototype in Sketch covering configured apps, unconfigured apps, greyed-out unavailable apps, and a three-step guided tour. The visual direction stayed close to the existing SBN website so the onboarding experience felt like part of the same product.
Test whether new users could understand the experience without prompting
I conducted moderated, in-person usability testing with five participants who represented a range of technical comfort and were new to business software tools.
What worked
Participants understood the app-specific guidance, found the guided tour easy to follow, and immediately recognized greyed-out icons as unavailable apps.
What needed refinement
The app modal felt visually heavy, and the guided tour ended without a clear completion signal. The refinement focused on making guidance feel lighter and giving users a clearer sense of progress and completion.
Make guided help feel lighter and easier to follow
Before: The selected-app guidance felt visually heavy, and the end of the tour did not clearly signal that onboarding was complete.
After: The tour experience was simplified around clear guidance, visible progress, and a distinct completion state so users could move through onboarding with more confidence.
Additional iteration · Signal completion
Participants expected confirmation when they reached the end of the guided tour. I added a success state as the final step so users could clearly tell that onboarding was complete and understand what to do next.
Small missing cues can create disproportionately large onboarding friction.
The most valuable part of this project was seeing how usability testing exposed gaps that felt minor during design but mattered significantly in practice. A lighter guidance experience and a clear success state reduced uncertainty without requiring a major change to the overall flow.
If the product continued development, the next priority would be personalizing the homepage to reflect each user's actual app configuration on first login so available and unavailable states are communicated immediately.