UX Research, UX Design, Visual Design


User onboarding is critical in helping new customers successfully adapt to a product. Currently, TUNE’s innovative but extremely complex mobile marketing products provide minimal onboarding assistance for new users. This results in high drop off rates and new customers choosing competitor products. Our team set out to tackle this onboarding problem using the design process. We performed extensive research and competitive analysis to test a combination of new and existing onboarding patterns. Informed by this research and testing, we created a new set of patterns that would solve our sponsor’s specific onboarding issues. When implemented, these new patterns will not only help new users find the product’s core value faster but also lower the number of rudimentary questions that support team and sales engineers need to answer. Overall, this will help acquire new customers, retain existing customers and increased revenue.

Tools Used: UX Pin, Principle, Illustrator, Google Analytics, Heap Analytics

Team Size: 4





The first step was to study the following documents in detail to understand the current state, problems and roadblocks users face when navigating TUNE Marketing Console and HasOffers, two of TUNE’s most competitive products:

  • Onboarding audit of TUNE products
  • Heuristic Evaluation
  • Answer Dash – online tool that provides instant contextual answers
  • Google Analytics
  • YouTube videos and TUNE Academy
  • Industry onboarding pattern research


The data has been modified due to NDA.

The next step was to interview the support team and account managers who are the first point of contact with the customers and find out concerns of the employees when they onboard for the first time.


 &Onboarding Pattern and Usage


We did extensive academic research on different onboarding patterns and what other successful organizations were doing. We summarized our research into following patters:

  • No onboarding, dive right in: This approach throws the user directly into the tool and is useful for simpler apps that immediately provide value.
  • Tour: A tour is a set of instructional steps embedded in a slide show that take you through the main features of an app.
  • Annotations and tips: Annotations and overlays are displayed after first login and direct the user toward initial steps required to get started
  • Setup Wizard: A wizard takes you through each step required to setup a tool in a sequential manner.
  • Sample Projects: For complicated tools, sample projects are a good way to let users play around and understand it better.
  • Video Tutorials: A video describing how the tool is valuable to the user.


Design Process


The biggest challenge for us was to make minimal changes to the current design. We came up with few different ways in which we can add overlays so that the existing designs does not have to be changed.



After multiple iterations we have finally delivered a set of 4 different onboarding designs:



  • Tours: This will be used as a first step to give first time users a quick overview of all the steps that they will encounter throughout the process. This will reveal the products core value upfront and pave the path for user to efficiently generate business insights on revenue in the shortest amount of time.


Screen Shot 2016-05-25 at 5.33.48 PM

  • Wizard: This will provide constant progress indication to reduce confusion and help save time and effort of key human resources at TUNE. The user is presented with information about the steps that exist, progress through the process and which steps are completed.


Wizard Only at the Bottom


  • Annotations: This will provide contextual handholding and detailed explanations about each crucial step to bridge the existing knowledge gaps between TUNE’s customers and their products.


  • Cards: Will appear over the text and will be used to give detailed instructions.






Related Projects