App Redesign: Nitro PDF Pro - iPad & iPhone

product
iOS

Nitro PDF Pro - iPad & iPhone is a PDF editing mobile application. We redesigned the app to establish brand consistency across Nitro’s product offering, improve overall ease-of-use, align to new UX standards including Apple’s component system, and set up app infrastructure for future feature development.

I was responsible for the UX design from start to finish. I worked closely with Product Management, Engineering, QA, and Research Operations to complete this project.

key collaborators

angel vu, francisco cantu, oleh sulya, mona brahmbhatt

App Analysis

  • Outdated branding
  • Low hierarchy and unclear relationship between tools
  • Custom icons slows down process on creating new icons
  • Toolbar layout restricts new feature additions
  • Not best utilizing Apple components
Nitro PDF Pro - iPad and iPhone before redesign

before redesign

Research

We conducted a survey with our existing Mac and iOS users to understand their app needs. We also conducted simple competitive research, looking at applications providing similar value. Results and takeaways were documented for the team’s use for the redesign as well as for future product development.

Snapshot of survey results board

iOS research feedback board

Project Objectives

  • Establish brand consistency across Nitro’s product offering
  • Improve overall ease-of-use
  • Align to new UX standards, including Apple’s component system
  • Set up app infrastructure to allow for future feature development

Iteration & Prototyping

I explored many ideas trying both small and big changes. This opened up conversations on how UI choices impacted the user's journey. I continued to iterate until the team was in agreement that we were supporting the best user experience, allowing users to accomplish their tasks efficiently, as well as representing the Nitro brand authentically and being achievable to develop in the time frame given.

iOS drafts and iterations

I created a simple prototype to display how the app will feel once built, especially showcasing movement. This prototype was shared to stakeholders to gain confidence in the redesign and to receive any high level concerns with the direction and progress of the project.

iOS prototype screenshot

Componentizing & Development Prep

I created a component system to help with design consistency and speed up the process for building more complex views. I utilized an atomic approach, starting with small elements and identifying larger patterns to componentize.

Snapshot of components

Components screenshot

Each major workflow in the app was detailed in a step-by-step view for both iPad and iPhone layouts. This created clear documentation for development and was referenced during QA.

User flow detailed for development

QA & Internal Feedback

We had a dedicated QA team as well as internal beta testers to ensure the quality of the product. We utilized TestFlight for beta testing and pulled testers from various orgs in the company including: Product & Engineering, Marketing, Customer Success, and Finance. Feedback, bugs, and requests were logged into JIRA and then prioritized and actioned for the initial release. Transparency and access to the product before release ensured confidence in the project outcome.

Introducing the new app!

The app was released with positive sentiment. We received agreement from the larger team that we delivered on aligning to brand identity and common design language across apps. The release saw a 96% adoption rate. In addition, there was little to no negative feedback received by our Customer Success team regarding the redesign.

Nitro PDF Pro - iPad & iPhone new design device mockup
Before
old Nitro PDF Pro - iPad and iPhone UIold Nitro PDF Pro - iPad and iPhone UIold Nitro PDF Pro - iPad and iPhone UIold Nitro PDF Pro - iPad and iPhone UIold Nitro PDF Pro - iPad and iPhone UIold Nitro PDF Pro - iPad and iPhone UIold Nitro PDF Pro - iPad and iPhone UIold Nitro PDF Pro - iPad and iPhone UI
After
new Nitro PDF Pro - iPad and iPhone UInew Nitro PDF Pro - iPad and iPhone UInew Nitro PDF Pro - iPad and iPhone UInew Nitro PDF Pro - iPad and iPhone UInew Nitro PDF Pro - iPad and iPhone UInew Nitro PDF Pro - iPad and iPhone UInew Nitro PDF Pro - iPad and iPhone UInew Nitro PDF Pro - iPad and iPhone UI