Improving A Mobile Comic Reader App

In May 2019, I started as a User Experience Designer at STELA and worked on improving their comic reader mobile application. This application allows STELA subscribers to browse and read a library of original comics and mBooks.
Role: UX Designer, UX Researcher
Tools: Sketch, Invision, Zeplin, SurveyMonkey
Methods: Wireframing, prototyping, user interviews, surveys
Duration: 3 months (May 2019 - September 2019)
An array of mobile phone mockups containing high-fidelity wireframes designs of a comic reader app

The Problem

To get a better sense of the problem at hand, I started off by meeting with stakeholders including the CEO, Marketing Lead, and Product Director among others.

At this meeting I learned about STELA's business goals of increasing subscriber retention and subscriber conversion.

  • Conversion: Getting free users to subscribe
  • Retention: Getting subscribers to renew and continue their subscriptions

Business Goal:
Increase subscriber retention and conversion through the upcoming app update.


However, I also learned from the meeting that while STELA had some idea of who their audience was from previous market research, they had not conducted any formal research as to who their app users were.

Before designing new app features, I wanted a better understanding of our customer base so that I could identify opportunities in the app where we could better serve them while meeting our business goals. Together with the stakeholders, I devised a research goal.

Research Goal:
Refine our understanding of STELA users so that we may create personas to inform future design and development efforts.

My Role

I worked as the sole UX designer on this project and worked on coming up with and designing new features as well as iterating on existing ones for a future update to STELA's mobile app.

I also was in charge of conducting all UX research and held some project manager responsibilities as well, creating a Project Requirement Document (PRD) to outline the features that I worked on.

I started the project in May of 2019 and stopped in August of 2019, before I could see my designs developed and have the chance to evaluate and iterate upon them.

My design process for this project is shown below.

Research

Considering the timeline I was given and the ground I wanted to cover in learning as much as possible about our users, I felt that an online survey and phone interviews would be the best research methods for the job.

A survey would be a quick and efficient way to collect a large amount of quantitative data on user demographics, habits, and experiences with STELA and competitor apps. During the survey, I could also ask participants if they would be interested in a follow-up phone interview, which would allow me to collect qualitative data and learn about their thoughts, behavior, and experiences with our app on a more detailed level.

The user research plan proposal that I presented to stakeholders for feedback

I created the survey using SurveyMonkey and had it peer-reviewed by one of the writers at STELA. I also conducted a pilot test by sending the survey out internally. After a couple of revisions, I emailed the survey out to over 300 of our current subscribers.

Unfortunately, I realized I was being much too optimistic about the response rate and only received a total of 5 survey responses and 1 phone interview participant. This was disappointing, as it did not come even close to the sample size that I needed for my survey and phone interviews to be “statistically significant.”

Despite the shortage of data, I had to move forward and make do with what I had. I still was able to learn some interesting things about the people that answered.

Below are some insights from the online survey.

Findings from the survey

2 of the survey respondents indicated interest in participating in a follow-up phone interview, however I was only able to connect and schedule an interview with 1 of them.

I still was able to uncover some valuable insights about their app usage that informed some of my design decisions later on.

Insights from the phone interview

Persona

I then combined the data I collected from the surveys and interview to create a proto-persona, Casey, and made some educated assumptions for some of their pain points and goals which I’ve marked with asterisks.

Although the sample size I reached wasn’t enough to form a confident representation of our users, this persona helped provide me with a jumping off point for my designs.

I would also be able to evaluate whatever assumptions I made, and the designs that arose from them, with usability tests, app analytics, and KPI measurements later on.

Generating Solutions

I had my persona now and with Casey’s goals and pain points in mind, it was time to brainstorm app features that could leverage what I learned so that I could aim to increase subscriber retention and conversion of users like Casey.

A potential user pain point that I identified through the persona was that users like Casey rarely use the app past reading their favorite series and sometimes feel a subscription is not justified, which is an assumption I made based on the unsubscribing and resubscribing behavior that was discovered during the phone interview. In thinking over this problem, I created a hypothesis that I felt would address it.

My hypothesis is:
By increasing the amount of time users spend engaged with the app, they will feel justified in spending for a subscription and subscriber retention will increase.


So, How Might We increase user engagement with the app?

A few ideas came to mind...

  • Improved series recommendations
  • Gamification
  • Social features

Improving the series recommendation feature was something that I was already working on with our data scientist. Of the remaining two options, I felt that social features was the safest bet. Not only did the user that I interviewed express interest in having social features within the app, but it seemed like much less of an assumption than gamification. Also, from conducting a competitor analysis, I noticed that most other comic apps like Webtoon or Tapas had social features.

My next question though was what kind of social features should I design?

A brainstorm of pros and cons for different social feature options

While all of these features had their strengths and weaknesses, I ultimately chose to move forward with exploring a Comments section feature.

It would allow users to directly talk with one another and the comments would be public and viewable by all users, which could also indicate to prospective subscribers that there is an active community within the app. I would also be able to utilize existing information architecture and flow by placing a comments section in every series chapter, rather than having to create completely new pages to house something like direct messages or a forum.

I shared my thought process to my manager and he gave me the okay to proceed.

User Flow

To get an idea of how I could approach the comments section flow, I took a look at the other comic and social media apps that the interview participant mentioned using to see how those apps handled it. Then I created a user flow for how I envisioned the comments section in STELA would work.

A brainstorm of pros and cons for different social feature options

Key features of the comments section include

  • Separate comments section for every series chapter
  • Like, reply to, or report comments
  • Comment replies are organized into two-tier threads
  • View, block, or report user profiles

Feedback

After sending out my proposed user flow and a Project Requirements Document detailing my vision for the comments section, I was met with some feedback that caught me by surprise.

The Engineering Lead felt that what I was proposing for the comments section was too complicated to implement for the next update and requested that I look into removing the replies and user profiles.

As a gut reaction, I disagreed. I felt that not including these features would strongly impact the user experience and hinder engagement within the comments section.

I ended up bringing this up with my manager to get his take on the situation, and he made some very valid points by checking my assumptions. He told me that at this stage, without any evidence to justify a feature, it’s safer to ship the simplest version of the feature that you can to gauge user's reactions and whether it is a feature worth pursuing.

Looking at it this way made it click for me, and I realized that I was being too attached to my personal vision of how the comments section should function. I decided to compromised on the design by removing replies and profiles and saving them to hopefully revisit at a later date.

A revised, simplified version of the Comments Section.

After a final review of my designs with the company stakeholders, I prepared my wireframes for handoff to the UI designer and development team. I arranged my wireframes to demonstrate the flow that a user would take to accomplish various actions within the app. I also annotated the screens to call out buttons and interactive features, how they are triggered, and the feedback that results from triggering them.

These "wireflows" were an effective way to communicate my designs and their details to my coworkers. I also created interactive prototypes in Invision to accompany my wireflows.

Notifications Page

Below are additional wireflows that I created for the Notifications Page feature.

Reflection

As the sole UX Designer at STELA, I stepped out of my comfort zone by taking on a variety of research, design, and project management responsibilities. I learned a lot about working independently by having to own and present my work to company stakeholders and team members daily. I also tried to involve my coworkers in my design process when I could, and was able to gain helpful insight and critique on my work as a result.

If I Had More Time...

If I had more time to work on this project, there are a couple of things I would want to explore further. First, I would want to revisit the online survey and phone interviews. This time around, I would hope to gather more data on STELA users by exploring additional avenues of outreach such as in-app surveys or casting a wider net and not solely recruiting current subscribers. More data would also help confirm whether my findings and assumptions about the users hold true on a larger scale or not.

I would also want to devote time to evaluating my designs. I left STELA before I had a chance to test my final designs or see them actualized by the development team. Conducting user testing and analyzing KPI's and metrics such as increases in conversion and retention, increases in time spent in the app, and comments section engagement after my designs have been implemented would be invaluable in determining how to move forward with the design of the STELA app.

What I Learned

Working at STELA challenged me to grow in many ways as a user experience designer. Here are some key takeaways from time there:

  • Ask more questions
  • Plan for the worst
  • Start small
  • No silos, more collaboration

Thank you for reading!