Product design · App Store · 2022

Adonit One Onboarding Visuals

Taking initiative during a high-pressure sprint to conceptualise App Store onboarding screens for a stylus-companion productivity app.

Role
Onboarding visuals (marketing assistant)
Tools
Photoshop, Illustrator
Client
Adonit
Status
Available on the App Store
Context

Good contributions don't always come from your job title.

During a high-pressure sprint, the team needed onboarding screens for the App Store. As a marketing assistant, I took the initiative to support our lead designer by conceptualising the initial visuals. This wasn't my official role, but I saw an opportunity to contribute and learn.

Research

I studied common UI patterns in App Store onboarding to understand what works, then translated those patterns into concepts for the main page, audio-to-text, and translation screens.

  • Background. Soft gradients or abstract shapes add visual interest without distraction.
  • Text. A single headline followed by one or two short lines, or just a bold description.
  • Image. The screen is often cropped to two-thirds to enlarge key features, with pull-outs to spotlight them.
UI pattern analysis wireframes
Pattern analysis, breaking onboarding screens into background, text, and image zones.
Design

Each screen uses a soft gradient background with circular line accents to add depth while keeping the focus on key interactions. A cropped device frame spotlights featured functions, with core actions, record, pause, translate, edit, visually elevated through pop-out effects. Typography stays minimal and direct, using brand colours for a cohesive, stylus-friendly interface.

Adonit One main page concept Adonit One audio-to-text concept Adonit One translate concept
My concepts, main overview, audio-to-text, and translation.
Final design (by lead designer)

The final visuals were refined by the lead designer with a cleaner layout, full device frames, and a plain dark background accented by red rings, aligning with Adonit's brand colours. The UI elements I highlighted were retained, just integrated into a sleeker, marketing-oriented style.

Adonit One final design 1 Adonit One final design 2 Adonit One final design 3
The shipped onboarding, my highlighted UI elements kept, execution refined.
Reflection

This project taught me that good contributions don't always come from your job title. By taking initiative and doing the research upfront, I provided concepts that actually influenced the final design.

It also showed me the value of understanding brand guidelines. I wasn't just making something that looked nice, I was making something that fit Adonit's existing visual language. That constraint made the work stronger.

You might also be interested
M30
MAP2030: Five Years In
Sustainability film
RB
The Role of the Board
Explainer film
AP
Adonit Product Photography
Studio product shots
← Back to studioAll work ↗