CASE STUDY
Creating loyal subscribers through the accounts page
Crafting an effective account page is not as easy as it sounds. But like a charming concierge, it will create loyal users.
The first dilemma this feature will give you is the fact that it is not accessed very often. So when you are prioritizing which feature you put on your roadmap, especially if your product is at a nascent stage, you wouldn't expect this page to give you that growth boost.
However, as Kompas.id rapidly expands, this feature screams to be looked after. There are more account linking and integrations coming in and it's just not fair to your users when you don't have the ease to manage it. But how do you create one that people will use when they need it?
However, as Kompas.id rapidly expands, this feature screams to be looked after. There are more account linking and integrations coming in and it's just not fair to your users when you don't have the ease to manage it. But how do you create one that people will use when they need it?
Timeframe: 2020
Role: Lead product manager
Role: Lead product manager
Scope: Account & subscription management
Impact: 20% access increase to page and subscription length awareness
Image: The amount of information that needs to be presented is overwhelming
Discovery
One of our main pieces of research for this project was to use card sorting. Our ecommerce site has created multiple campaigns using vouchers and coupons (yeah, what's the difference, right?), as well as the many types of products we have: memberships, e-books, and tickets.
We decided to go the full digital route at this time since it was in the middle of the Covid-19 pandemic. There are a few platforms that lets us do this, but we chose Proven by Users for price and simplicity.
Image left: Similarity matrix shows another aspect of the research, showing the percentage of time that a menu item is grouped with another
Image right: Tree dendogram result view from the card sorting created four major groups for our menu item
There are a few guidelines about card sorting that differs from user interviews. Card sorting needs at least 3 times the participants of user interviews to be valid, so we invited 19 of our users for this test.
From this closed card sorting, we found five major groups that users feel belong together. The tree dendrogram does not show the whole story, so you might need to dive deeper into the data or have a follow-up interview to make sense of the data.
Breaking it up into iterations
Being a newspaper, subscription-based news site, book publisher, and event management company means that our customers use Kompas.id for a variety of reasons. To tackle all these functions is both arduous and means our users would feel the benefit at a much later date. So our development strategy is to create an MVP and plan for continuous iterations.
The variety of information and settings needed to be available for users leads us to create a birds-eye-view dashboard first, showing them the most important information based on their initial touchpoints.
Based on our research, the second, third, etc. iterations, we plan on integrating:
Design process
Save for the card sorting, codesigning this feature proves to be the most valuable process that we need to get the project running. The involvement of the marketing team (e-commerce and strategic marketing), technology team, gave clarity and expedited in shaping the product before the actual design process. We focused on how we could increase loyalty as the long-term target of the user-service product.
Photo: One of the many codesign sessions with folks at marketing and technology
Once a few hypothesis were formed, we quickly created user flows for the few primary functions of the accounts page. User profile updates were straightforward, whereas the transaction flow were more complex since we're dealing with both digital as well as physical products.
Image left: Final sitemap that included a few next iterations that we'd like to create
Image right: User flows for transactions and order page were the most complex
Design process
Once we created a wireframe for the project, we were eager to quickly validate our designs. We used usability hub to do a quick usability testing with five users that access the accounts page regularly. In doing this, we hope that they have our current product in mind, so that we do not need a baseline metrics for this test.
Image left: Usability hub for simple navigation or first click tests. Also some follow-up questions to explore the participants' thinking
Image right: Result from the usability testing show a few failed navigations
Mockups and prototype
There were a few critical insights from the usability testing, that needs to be addressed in this iterations.
1. Order status on the accounts dashboard and transaction menu failed miserably. As this directly impacts conversions, we decided to use lighter colours to better expose the labels.
2. Subscription details were also one of the feature that failed the usability test. We changed the copy and position for this hyperlink to improve discoverability.
Here is the final version for a few of our pages.
The accounts dashboard page
This page is the first page that the user lands on after clicking the accounts menu from our app header. The page shows both the users' most important information, but also the business most important objectives. The balance gives the customer maximum value while getting us closer to our business metrics.
Orders and transaction page
Account details and user profile page
Next steps
As noted earlier, this feature will not suddenly give us our much needed growth bump, but in the long run it will definitely increase retention rate. Just like a charming concierge, we are confident that with a carefully crafted accounts page, customers will be pleased to stay with us longer.
By the way, we are very pleased to use UXPIN for this project. The amount of interactions the app provided for our prototype means we could have tested a whole range of other goals on the customer. Alas, a lab usability testing did not happen this time around. Until next time!
The team
• Research: Ria Chandra
• Design: Reza Fikri Aulia, Maria Karina Putri, Clara Sonya Aritonang
• Technology: Didit Banuardi N, Yosef Yudha Wijaya
• Marketing: Tifany Syifakarnia
Thanks for the visit!
If you enjoyed it consider giving a like, you don't need to login
