Rethinking the Mobile Experience for Apryse’s WebViewer SDK
Problem
Inconsistent mobile experiences across tools caused user confusion and hindered utilization of similar features. The abundance of interface inconsistencies posed challenges for effective user engagement.
Solution
After thorough research and heuristic evaluation, we concluded that targeting specific mobile components would enhance design, development, and user experience.
Outcome
Despite not being rolled out yet, our internal team has provided positive feedback on the offered solutions and the ease of implementing fixes, eliminating the need for tool-specific adjustments.
Outlines - FullscreenOutlines - Half ScreenAdd New Outline - Half ScreenPage View - Half ScreenPage View - Full Screen
1
Overview
Summary
In this case study, we sought to improve the mobile experience for our PDF SDK product. We then conducted survey of current users and a deep heuristic evaluation on our PDF SDK product in mobile as well as our mobile PDF products in Android/iOS.

After, we compared the experience in all three platforms and found that the design of the panels, popup modals, and tool use indicators in the mobile view could be improved to make it more user-friendly.
Objectives
  • Conduct a full investigation of the tools and features available in our WebViewer SDK in mobile view and our PDF mobile product, Xodo, on Android and iOS
  • Create a chart that includes screenshots of all the flows to allow us to easily see what is missing or better in the other platforms
  • Carefully examine each component used of the user interface and determine which ones were not meeting the needs of our users or could be improved in some way
Key Challenges
    • Not being able to directly talk to end users.
      • It was up to the developers to figure out how to best handle these inconsistencies and ensure that the mobile experience was as seamless and intuitive as possible.Not being able to directly talk to end users.
    • Lack of focus on the mobile experience in the past resulted in inconsistencies in the flows and experiences across different platforms.
      • It was up to the developers to figure out how to best handle these inconsistencies and ensure that the mobile experience was as seamless and intuitive as possible.Not being able to directly talk to end users.
    • The potential need to change the flow of multiple tools to make them work better in mobile.
      • This could have resulted in a significant amount of work for both designers and developers, potentially increasing the scope of the project beyond what was feasible.
Possible Solutions
To address these challenges, we relied on heuristic evaluation, market analysis, and a few questions in surveys we conducted before about their platform usage. We also carefully considered the trade-offs involved in making changes to the flow of multiple tools, weighing the potential benefits against the potential drawbacks and costs.

Ultimately, we were able to identify and implement changes that improved the mobile experience without significantly increasing the scope of the project.
2
Research Methodologies
Heuristic evaluation
Prior to embarking on the project, we conducted a thorough evaluation of our tools to pinpoint the most critical problem and determine our primary focus. To streamline our thoughts, we created a chart with screenshots, questions, and issues, enabling us to organize our analysis efficiently.
    • Platforms studied
      • To ensure consistency across all our applications, we made a decision to examine the mobile responsiveness of our WebViewer showcase, as well as our Xodo app on both Android and iOS platforms.
    • What we looked for
      • Tool usability issues in a severity scale of urgent, high, medium, and low priority to make sure we were prioritizing the redesign of the worst tools first.
      • What components that this tool was using.
      • Which platform that this tool existed in and whether or not we needed to bring it over to all three platforms.
    • Main takeaway
      • Upon observation, we discovered that several tools categorized as "urgent" shared a common component. In light of this insight, we concluded that it would be more beneficial to maintain the existing flow utilized by these tools while focusing on improving the usability of the specific component causing mobile responsiveness issues.
      • By doing so, we aim to address the urgent concerns without disrupting the overall workflow and user experience of these tools.
Market analysis
We were intrigued to explore how our major competitors approached mobile responsiveness and how they tackled the challenges we were encountering in our own application.
    • Industry standard
      • In order to gain valuable insights into how our main competitors in the SDK space approach mobile experiences, we conducted an extensive market analysis.
      • What we discovered was that they faced similar challenges as us, primarily prioritizing desktop and tablet views while neglecting the user-friendliness of their mobile offerings.
    • Results
      • Upon analyzing these findings, we arrived at a strategic decision: by following the lead of our own PDF editing app, Xodo, we can effectively address two issues at once.
      • By aligning all our products more closely with Xodo's approach, we can enhance the user-friendliness of our mobile experiences while creating a cohesive ecosystem that benefits our customers across the board.
User surveys
Prior to starting this project, we conducted a survey by reaching out to all of our clients through an email and asking them to fill out a survey to help us decide whether or not revamping our mobile experience was worth it. We received approximately 40 responses, which provided valuable insight into our decision-making process.
Questions & results*:
    • How do your users access your web offering?
      • The most common platform presentation among clients is desktop only or desktop, mobile, and tablet.
      • The second most popular platform is desktop and mobile.
      • The least popular is desktop and tablet.
      • There are no clients using just mobile, tablet, or other platforms.
    • What percentage of your users are mobile/tablet users?
      • On average, less than half of a client's user base uses mobile or tablet.
      • However, one client reported that almost all of their user base uses mobile or tablet, while another client stated that none of their user base uses mobile or tablet.
    • Are you embedding WebViewer in a native mobile app?
      • Over half of the clients said no, while the rest said yes
The survey results indicated that a significant number of users were already utilizing the WebViewer in our mobile experience. Although this number was less than half of the users that participated in this survey, we believed that improving the overall mobile experience would encourage more clients to use it. Additionally, we wanted to support our clients who had a high percentage of mobile users or native mobile apps to maintain their business with us.
*To protect company privacy, the results do not include numerical data values.
3
Findings
Main takeaway
In our study of the mobile experience for our PDF SDK product, we found that the experience across different platforms was similar, but not identical. While this is not necessarily a bad thing, we identified some areas where the design of the panels and popup modals in the mobile view could be improved to enhance the user experience.
Key issues
One of the key issues we identified in our study of the mobile experience for our PDF SDK product was the design of the panels. We found that the current design of the panels was not user-friendly and disrupted the flow of the user's actions. In particular, the full-screen panels made it difficult for users to interact directly with the PDF pages, which hindered their ability to use the product effectively.

In addition to the design of the panels, we also identified some issues with the popup modals in our PDF SDK product. We found that these modals were sometimes too large, which obscured important information on the PDF. This did not affect the functionality of the tools, but it could be frustrating for users who were trying to view the PDF content.
How to tackle these issues
One of the key issues we identified in our study of the mobile experience for our PDF SDK product was the design of the panels. We found that the current design of the panels was not user-friendly and disrupted the flow of the user's actions. In particular, the full-screen panels made it difficult for users to interact directly with the PDF pages, which hindered their ability to use the product effectively.

In addition to the design of the panels, we also identified some issues with the popup modals in our PDF SDK product. We found that these modals were sometimes too large, which obscured important information on the PDF. This did not affect the functionality of the tools, but it could be frustrating for users who were trying to view the PDF content.
4
New Component Designs
Panel solution
To address this issue, we conducted market analysis of other mobile apps and observed how they used panels. We found that many of these apps used a panel that was defaulted to a half-screen view, allowing the user to expand and unexpand it as needed.

This gave users the flexibility to interact with the PDF pages without sacrificing the ability to access the panel's tools and features. Based on this observation, we decided to implement a similar design for our PDF SDK product, creating a panel that could be expanded and unexpanded as needed. This improved the user experience and allowed users to interact with the PDF pages more easily.
Click the image to scroll through all wireframes
Design solutions for other components currently in progress
While we have completed the design updates for the panels and toolbar in the mobile view, there are still other areas of the mobile experience that we plan to address.

The project was temporarily delayed due to prioritization of other projects, but we are committed to continuing our work to further improve the mobile experience for our PDF SDK product. We will continue to design updates based on our findings, with the goal of creating a seamless and intuitive user experience on mobile devices.
5
Impacts
Internal feedback
The results of our study of the mobile experience for our PDF SDK product were positive to the internal PDFTron team. Not all of the features have been fully fleshed out and designed yet, but we are hoping that clients and end users will find the mobile experience more enjoyable.

As a result of the improvements we made to the mobile experience for our PDF SDK product, we expect to see a number of positive outcomes. End users are likely to have a better experience using the product, which could increase their satisfaction and loyalty. This could lead to increased usage and engagement with our PDF SDK, as well as positive word-of-mouth and recommendations from satisfied customers.

Additionally, the improved user experience and enhanced functionality of the mobile experience could help to differentiate our PDF SDK from competitors, providing a competitive advantage and helping to drive growth and success for the business. Overall, the changes we made are likely to have a positive impact on the user experience and the success of our PDF SDK product.
Conclusion
In conclusion, the redesign of the PDF SDK's outline and bookmark feature was a success. By conducting user research, market analysis, and implementing user-centered design solutions, we were able to create an updated design that was more intuitive and user-friendly. We also included new functionality to improve the user experience.

The collaboration across the design team and product management team was integral to this revamp, as it allowed us to create a solution that worked well for everyone. The result was an increase in customer satisfaction and loyalty, as well as a competitive advantage for our business. Overall, this project demonstrates the value of user research and user-centered design in creating successful and effective software solutions.