Problem
We needed a way to introduce our users to the new app. We had three items that users would need to take action on during that intro experience. These were: select login method, accept notifications and set up a security profile picture. We also had to take them into other flows to complete the task and then return back to the FTUX screen. It was an opportunity to introduce something new into our design language.

Action
I researched other first time user experiences and determined what information we needed to convey to the users and the minimum requirements. From there I created three screens. Because this was a new feature on a new app, I took the lead and created a new subset of our illustrative icons. Next, was utilizing a full color screen. I started with our brand color palette and made adjustments for accessibility to ensure we had strong color contrasts.

Results
Initially, the number of people uploading a photo or accepting push notifications was low. Once the FTUX was implemented the numbers increased exponentially. These new larger sized graphics, where the phone breaks the circle, would become our standard graphic type on new experiences we intended to highlight within the app. We also identified additional use cases for a FTUX type of experience and added those scenarios to our design library and documentation.

Skills

  • Design systems
  • Design strategy
  • UX design
  • Illustration
  • UI design
  • Wireframes
  • Prototypes