Enhancing Lumity: A User-Centered Product Redesign for an Optimized Learning Experience
TEAM
Smridhi Gupta
Nandita Malhotra
Jiten Thakkar
WHAT I DID
Led the team in testing & redesigning 40+ screens with a new design system.
DURATION
September - December 2024 / 3 months
SKILLS
UX Design / Usability Testing / User Research / Systems Design
What is Lumity? 🤔
Lumity is a platform to learn and explore new content with a like minded, growth-oriented community 🌱
Lumity is a platform designed to foster meaningful knowledge sharing within a growth-oriented learning community. It enables users to track their learning progress, share insights, and engage with others’ educational journeys in real time. By cultivating a space for curiosity and continuous learning, Lumity aims to connect lifelong learners through positive and productive interactions.
The challenge
Lumity lacks continued engagement, a consistent interface, and seamless usability, limiting community growth and user retention
Lumity fosters a strong learning community, yet struggles with user acquisition and retention. Inconsistent interface design and a lack of engagement hinder the user experience. To address these challenges, I led the research and redesign process, collaborating closely with Lumity's founder and development team to create a more seamless and engaging platform.
The solution 🌟
Introducing Lumity's new look — your favorite learning companion with a fresh and refined interface
I led the team in redesigning and testing Lumity’s interface to enhance usability, ensure design consistency, and foster user engagement, aligning with Lumity’s goal of meaningful knowledge sharing.
Lumity's redesign focuses on…
Improving the content tracking experience for with a high level of personalization
Increasing the scope of exploring new and diverse types of content
Creating a visually consistent, navigable, and usable interface
So how did I do it? Let’s start from the beginning!
What's the problem?
Lumity's core community is strong, but design inconsistencies hinder user retention and acquisition
We started the project with a kickoff meeting with Lumity's CEO and Founder. In talking to him, we found some questions and problems Lumity's team is currently tackling:
01
How can we establish a clear and consistent design identity that strengthens the overall user experience?
02
How can we foster community building through thoughtfully integrated features that support connection, engagement, and shared learning?
03
How might we increase user retention by leveraging gamification features that motivate continued participation and engagement?
While we were excited to explore new features to support Lumity’s goals, my team's primary goal was strengthening the app’s foundational design—creating a more cohesive, consistent, and usable experience that would support future growth and feature development.
Understanding Lumity
We began by deepening our understanding of Lumity’s product, user base, and core functions to define a clear research direction
Our research began with gaining a comprehensive understanding of Lumity—its purpose, users, and current functionality. To guide this process, we employed the following research methods:
🔗 ECOSYSTEM MAP
Who is involved and how do stakeholders work together?
📱 TECHNICAL ANALYSIS
How does the current application perform?
📊 COMPETITIVE ANALYSIS
How are similar applications designed?
💼 CASE STUDIES
How are applications with similar features designed?
📑 LITERATURE REVIEW
What are other experts’ opinions?
🧑🧑🧒🧒 INTERVIEWS & USABILITY
What are other experts’ opinions?
We created an ecosystem map to understand Lumity’s stakeholders and discovered that users engage with the platform in progressive levels of involvement
After several iterations, we finally arrived at a clear visualization of Lumity's stakeholders. This breakthrough allowed us to gain a deeper understanding of the different user groups within the platform.
Lumity’s users exist in concentric circles of engagement, starting with individual learning. As users grow, they can deepen their involvement—first by engaging with their immediate community, and eventually by contributing as curators and creators on the platform — while continuing to participate in core, individual learning and tracking. These user groups are encircled by Lumity’s design and management team, who support and shape the overall ecosystem.
The ecosystem map proved to us that we need to create a scalable interface that supports users at varying levels of engagement—individual learners, community participants, and content creators—while ensuring smooth transitions between these roles and visibility into growth opportunities within the Lumity ecosystem.
Reviewed expert literature to identify the most effective forms of micro-learning and community-driven learning and how to integrate these into Lumity
We reviewed academic literature on digital micro-learning to implement effective strategies and encourage this behavior in Lumity's users. Our key takeaways included:
01
The content posting workflow should be optimized to support micro-learning, automatically creating a micro-learning template for the user to streamline the process.
02
Enabling easy and rewarding content creation tools encourages high-quality user-generated content, leading to a healthier and more active community.
03
Design should foster meaningful and candid interactions that strengthen interpersonal relationships, build a loyal community, and encourage ongoing participation.
These insights directly influenced our redesign of the "create a new post" workflow, guiding key design decisions aimed at enhancing Lumity’s community engagement.
Understanding the market
Next, we wanted to learn how Lumity's competitors are using design to foster community and encourage learning ✍🏽
To understand how other applications present the exploration and consumption of short-form content, we examined how Lumity's direct and indirect competitors structure their features.
Through this research, we found that many of Lumity's competitors offered more refined and expansive exploration features. As a result, we decided to prioritize enhancing the exploration workflow on Lumity and diversifying how users interact with content.
What do the users think?
Finally, we conducted user interviews and usability tests to identify user goals and pain points within the current interface
Through interviews with current Lumity users, we discovered features that were highly valued, as well as several pain points across the application, which we sorted into different categories, as seen below.
The overarching takeaway from the user interviews was that, while users appreciated Lumity's concept and saw great potential for content sharing and community learning, they highlighted several inconsistencies within the interface. Users unanimously agreed that a visual refresh could significantly enhance the overall experience.
Key insights 🗝️
So what were the most important takeaways from all of our research?
After going through all of our research, we had close to 40+ different insights, derived from the diverse research methods we used. Here are the 4 we prioritized as most important to implement in our redesign:
ECOSYSTEM MAP
Users exist in progressive levels, starting at the individual level, growing to explore the community, and then to actively contributing to the community. Lumity’s features should be scalable and encourage growth.
LITERATURE REVIEW
It is important for us to design Lumity's interface to optimize micro-learning and delivery for users, in the form of posting and viewing content.
TECHNICAL ANALYSIS
Currently, Exploration is limited to user’s specific interests and people. WE shoudl improve interface to provide more options for diverse exploration.
INTERVIEWS & USABILITY TESTING
Simplifying the main and top navigation by clearer prioritization of key features and intuitive labeling would significantly enhance the experience of Lumity.
Moving forward, our new guiding question goes 📍:
How can we design an interface that inspires users to commit to growth and exploration in their learning journeys while ensuring a seamless, engaging, and visually appealing experience?
Let's visualize our ideas 🎨
Mapping user types to features using a product architecture diagram to align needs with functionality
Based on insights from our ecosystem map, we visualized how users at different levels of involvement engage with various features of Lumity. We created a product architecture diagram to map user types to relevant features, linking user needs with the platform's capabilities. This helped us understand how to tailor the experience for different user levels, ensuring that the most relevant features are easily accessible to enhance user engagement and satisfaction.
Fun fact: Our client’s favorite part of the research was this diagram, along with the Ecosystem Map, as they provided a clear, high-level overview of Lumity’s interface and long-term goals.
I refined Lumity's information architecture to improve navigation and help visualize how new features fit into the current app experience
We implemented key changes to the top and bottom navigation of the application. The bottom navigation now features five main menu items: Home, Explore, New Post, Library, and Profile. The top navigation serves as secondary navigation, housing additional page-specific features for improved organization and usability.
Mapped and edited product flows across Lumity to guide our design process
Based on our key takeaways, we prioritized the exploration and creating a post workflows. While we refined most of Lumity's workflows, we aimed to keep them as close to the original design as possible to ease implementation for the Lumity team.
Rapid wireframing and med-fi prototypes before moving to high-fi design
Given the time limit, we conducted a quick round of wireframing to finalize the flow and roughly what each screen looks like before moving to high-fi. We then prototyped our mid-fidelity design to gather user feedback and assess their response to the new interface. We would have liked to test on the hi-fi designs as well, but were unable to do so due to time constraints.
Checking in with stakeholders
Lumity's CEO was excited to see our research and design progress, and looking forward to seeing high-fidelity prototypes
Our client was highly impressed by the depth of our research and how it laid a strong foundation for Lumity’s redesign. He especially appreciated the ecosystem map and product architecture diagram, noting how effectively they captured both Lumity’s goals and user needs. He expressed excitement about seeing how our research would translate into high-fidelity prototypes.
Testing and iterating our designs
Get more feedback on usability and navigation
We showcased out med-fi prototype to 4 users and asked their impressions on and how likely they would use it in their day-to-day. While most users were excited for the new design, we also got some great insights on the overall usability of our new features. Here are key things we changed:
Before
After
A key issue identified was that users struggled to distinguish between different media types, as they appeared visually similar and lacked clear differentiation.
We proposed distinct visuals cues for each media type: article, book, podcast, video. The different shapes help users differentiate between content types at a glance.
Before
After
Users often missed or misunderstood the two tabs on the Homepage and Explore page, leading to confusion and low engagement.
We redesigned the tabbing interface for clearer visual distinction and added a brief description to clarify the purpose of each page.
Before
After
Initially, media in the Free Explore section was organized by categories, but user feedback revealed a preference for a more open, flexible browsing experience.
To create a more engaging browsing experience, we implemented a masonry layout in the Free Explore section and utilizing the distinct visuals for each media type, addressing user desires for a more dynamic and intuitive format.
Creating a UI Kit
Designed components using atomic design principles to align with Lumity's brand identity, ensuring visual consistency across the platform
We created a UI kit with our final elements and components to ensure consistency across Lumity's redesign.
And here they are... our final designs! 📣
Meet Lumity's new look — your favorite learning companion with a fresh and refined interface 🌱💫
Let's start the journey! 🎬
After onboarding, the user land on their homepage, customized to their interests.
Users have the option to view posts on Lumity through the lens of their interests or the people they are following because of the tabbing mechanism on the Homepage.
Filter, save, and explore posts by media type or content tags.
It's time to explore 🔦
The Explore page offers a dynamic browsing experience to help users discover diverse content beyond their usual interests.
Users can discover and save new content through two tabs: Free Explore, which offers media-based browsing, and Community, which highlights posts from the broader Lumity network.
The design encourages content exploration through various pathways—media types, people, or search—supporting flexible discovery aligned with their mental model.
💪🏽 Our redesign provides users a space to explore within a their interests and community, as well as encourage engaging with diverse perspectives by better categorization, curation, and browsing experiences.
Want to post about something you learned? 📝
Our design improves Lumity’s existing post creation workflow, making it more intuitive and streamlined for users to share their learning.
We introduced a more flexible posting experience by allowing users to easily exit the workflow and save drafts, ensuring continuity and reducing friction in content creation.
We integrated the option to add a post directly to a user’s personal library during the posting flow, encouraging organization and personal tracking.
Your personalized library 📚
We introduced two tabs within the Library: one for a user’s personal playlists and another for saved posts, making it easier to organize and revisit content.
By adding a toggle option between grid and list views for both pages, we give users the flexibility to personalize their content display.
The process of adding multiple posts to the same playlist was streamlined, enhancing the effectiveness of personalization for users.
😎 The Library was designed to maximize personalization, encouraging users to track their learning on Lumity, fostering greater commitment to the platform and providing space for continued growth.
Curating your digital identity & personal learning journey 👤
This design aims to encourage users to curate their digital identity on Lumity, serving as a foundation for content consumption and creation within the application.
A new Streaks page was introduced to allow users to track their progress, visualize their learning achievements, and integrate gamification features into Lumity.
⛳️ By encouraging users to curate their digital identity, set personal learning goals, and track achievements, this design fosters a sense of ownership and motivation, enhancing user engagement and commitment to their learning journey on Lumity.
Client reaction and looking forward
There’s still so much more we want to do for Lumity!
Our client was impressed by our redesign, and has already started implementing many of our proposed design changes.
If given more time, we would:
Test our hi-fi designs with users to gather more feedback
Create a more comprehensive design system for Lumity in addition to the UI kit
Find ways to integrate more gamification and monetization strategies into Lumity's interface
Looking back...
Data fuels intentional design 📊
While the primary goal of our project was a foundational redesign of Lumity, we dedicated significant time to research—exploring Lumity's concept, understanding user needs, and conducting usability testing on our designs. This research allowed us to make informed design decisions, prioritize user needs, and effectively justify our choices, which ultimately impressed our client.
Learning to prioritize impactful design when working under time constraints ⏰
Working under a time constraint for this project challenged us to prioritize and focus on the most impactful design changes to create an MVP of our redesign. It pushed us to streamline our process, making decisions quickly while still ensuring that insights from our user research were implemented into the new design. While I feel like we could have created a better and more refined product if we had more time, this experience reinforced the importance of balancing speed with quality and gave me a deeper appreciation for efficiency in design.
Appendix
Presentation
We presented our findings at the end of the project! View our presentation below.
Figma Workspace
We detailed our process and findings in a Figma Workspace — check it out to learn more!