Jacobin is a renowned media agency offering perspectives on politics, economy, and culture. It currently has printed media and website, but does not have a mobile app. A strategy to build a media app for more user market buy-in was devised. This gives users access to features like save, customization, and push-notification. A freemium product has been well received and has a healthy user base.

An evolution of the UX is now required for monetization. The new free-to-paid conversion experience utilizes an effective and on-brand subscription process.

I devised a project plan with scheduled actionable goals using a modified Design Process. Combining research findings and interview results, I led the project through all aspects of the design system, ultimately created a prototype app to test solutions to Jacobin’s unique business goals.

The duration of this project was 100+ hours within 2 weeks.

The entire project developed while I was on travel. It was an interesting learning curve to run the design process solely through digital tools and on-the-go. It also afforded me the luxury to engage with a broader user base to test the prototype.

Analyzing competing media apps gains us in-depth knowledge of the market landscape and identify UI principles commonly used within the industry. Notable highlights of the heuristics evaluation are as follows:

We did a deep dive into the brand and how it is used throughout different touchpoints and atmospheres. A brandbook was compiled and used as reference for every step of creating the product and experience.

I jotted down ideas that were brewing in my mind along with primary research insights. A mindmap began to take shape, which gives proper attention to the different segments of the product and resolving the relationship of the network holistically. There were meany media realms Jacobin had its hand in — splitting between ‘free’ & ‘premium’ helped establish what features belong in which hemisphere, ultimately streamlining how I would approach crafting this product.

I then laid out the schematics of the app through a sitemap, setting the foundation for each distinct page of the product — essentially becoming the skeleton of the app. This helps us set the stage and realize the proper location for each page.

I diagrammed red routes to visualize essential flows a user might take to achieve specific tasks. Using these flows, I located opportune times at introducing subscription options to the users. Take, for example, the login flow below. Since this is essentially an experience funnel that all users must pass through, placing a CTA at that precise location assures exposing all non-members with premium subscription options.

Alas, distinct pages from the red routes are sketched out into wireframe and then evolved into a wireflow, which allows us to digest what is needed in the design layout of each page and omit anything superfluous.

4 participants were selected for in-person usability testing; the goal was to catch any friction points and to make sure the flow aligns to expectations. Capturing and managing bumps early on, especially before hi-fi mockups, is imperative for impacted project deadlines. Feedback was filtered through affinity mapping and a SWOT analysis.

Notable insights from the first testing are as follows:

+ The aspect ratio of 1/2 of the participants’ devices did not match the prototype, which hid the bottom bar away from the screen, ultimately setting them astray on tasks that were given. I remedied this by providing my own device for in-person moderated testing.

+ 2 participants questioned personalizing the app through a save feature for non-members, which gave me an understanding on the thinking habits of users and their expectations — leading to an A|B testing plan on the next phase of usability tests.

The updated wireflow was rendered into hi-fi mockups and then transformed into a working prototype using Figma.

A test plan and script were composed, which include exploratory questions and tasks to be completed. A two pronged approach was taken during the testing sessions to strengthen the primary research and receive rich, actionable insight from user feedback. I then recruited 5 participants that align with our target demographic and conducted moderated A|B testing for the save feature.

I also harvested quantitative data and misclick heatmaps through 14 unmoderated tests. Below are highlights from those sessions:

The task given is to find the premium community content — housed within Praxis icon of the bottom bar. The heatmap clearly indicates an issue of not knowing what the icon and label represent. This issue required attention to resolve.

100% of participants circumvented the initial premium screen. I question whether or not this particular CTA is a necessary experience.

Key findings from usability tests:

While my role in this project ends here, findings from usability testing gave me a few other conversion tactics to integrate. I would like to study whether the post-login CTA would benefit if it triggers a time duration after login, or if a gentle pop-down is used in lieu of a pop-over, or perhaps if the CTA exposes on second usage of the app instead of initial use. If given the chance, I would update the prototype for another round of usability testing and continue exploring these lower-priority features.