.png)
.png)
T O B E G I N W I T H ...
Currently, our workflow involves several steps, including inputting a topic, generating outlines, choosing detailed options (paid), generating slides, audio (paid), and videos (paid). However, our research indicates that some users find the current flow confusing, while others desire a more comprehensive experience without immediate payment. Unfortunately, our current AI costs pose a challenge in providing extended experiences without compromising on expenses.
We aim to redesign our workflow to enhance user understanding of available functionalities and increase overall satisfaction with the DrLambda experience by:
1. Provide users with insights into more advanced functions without incurring additional server costs.
2. Improve the conversion rate 📈 from free users to paid subscribers.
How Might We...
effectively guide and demonstrate the value of paid features to new creators/users at an earlier stage in their experience?
(Refined) How Might We...
enhance the value demonstration for unpaid users and streamline the workflow for both paid and unpaid users to minimize confusion and friction, thus boosting the conversion rate?
S H O R T - T E R M
1. Simplify and provide visually clear subscription and credit system
2. User-friendly workflow with easy navigation and step rvisiting
3. New dashboard for project organization
4. Presenter view feature on the website
L O N G - T E R M
1. Updated and adaptable design system
2. More template options and smart template using AI
3. Editing tool for customizing
4. AI-autogenerated slides with images
5. AI assistant for user support and problem resolution
6. AI-generate & regenerate text/image
7. AI video generation based on slides' contents
increase in subscription conversion
increase in returning users
increase in task completion time
So, how did we get there?
.png)
Users feel swamped by information overload on each step & page.
The page's packed with so much info, making it difficult to know where to focus my attention.
Users want the ability to customize, adapt, and maintain control over their workflow and input/output processes.
lf the slide I generate can combine with my template, it would make my life much easier.
Users are confused about how the pricing for each feature operates.
The screen displays a requirement for 10 credits, but I hadn't seen any mention of credits before. How many credits are required to create pages again?
Users need to download the slides and leave the website to present them using another application.
I feel like the entire process of downloading these PDF slides and presenting them elsewhere adds a lot of extra work.
✅Accessible Guides
Nearly all competitors provide essential guides, including 'Getting Started' and 'Help' documentation, conveniently located within both the dashboard and slide editing interface.
✅Transparent Credit Systems
The majority of competitors maintain clear credit transparency, offering complimentary trials of their advanced artificial intelligence tools as part of their initial AI credit allocation.
✅Versatile Compatibility
Seamless integration with leading third-party apps such as Figma and GIPHY.
To gain deeper insights into our users and their experiences within our design framework, we developed a persona and a user journey map.
B E F O R E
❌Projects' information is not clearly presented
1. Projects aren't organized
2. Lack of credits information
A F T E R
Learn old/new projects at a glance
1. All projects organized by date/last viewed/recently viewed/starred
2. Folders for users better organize their projects
3. "Grid" or "List" project view according to user's preference
B E F O R E
❌Information overload in one page
1. Topic, audience, language, files, and link options are all included in one small panel, which might overwhelm user
2. GPT 3.5 and 4 switch button is not obvious
A F T E R
Streamlined overall workflow
1. We dissected the steps from "summary" to "summary" + "files" ensuring each step is dedicated to specific tasks, thereby preventing information overload for users
2. "Tone" option allow user to choose how they want their presentation tone be like
B E F O R E
❌Unclear information and hard to navigate
1. Clearer information hierarchy and more intuitive user actions needed
A F T E R
Visual decluttering on responsive page information
1. Options for user manually input outlines OR AI generate outlines
2. A responsive overview section to each slide
3. "Regenerate" funtion
B E F O R E
❌Fixed template without options for users
A F T E R
Multiple template options based on users' needs
🟦 Academic/business/casual templates
AI-Powered Template Creation
🟦 Integrating comprehensive AI capabilities at every touchpoint, ensuring a seamless and fully-enhanced customization experience
B E F O R E
Customization Gap, lack of user autonomy
❌A lack of personalization in the AI-generated options, failing to match individual user preferences quickly
❌Without "regenerate" option
A F T E R
Expanding the feature due to heavy user reliance, design to build user trust and navigational efficiency
1. AI-assisted images generation
2. AI-assisted content and styling editing: Providing efficient and practical AI-assisted content editing and styling for better slide content customization
3. "Edit layouts" features based on users' needs
B E F O R E
❌Without presentation mode
❌The "Scripts" page was separated from slides
A F T E R
Presenter view
🟦 We introduced a presenter view in the feature workflow, enabling users to present their slides directly without the need to download or navigate away from Dr. Lambda's website.
💡We extracted colors (primary and secondary colors) from DrLambda's logo and build the design system based on that.
💡We also introduced the Power Buttons: Incorporated into the design system, these buttons feature gradient colors and highlight AI-related features throughout the website. Their design helps Dr. Lambda demonstrate its technological prowess and value, especially to users new to AI and the platform.
D E V E L O P M E N T O F F E A T U R E 0 1
💡We refined the steps in the stepper for enhanced visual clarity
D E V E L O P M E N T O F F E A T U R E 0 1
💡We dissected the steps according to information architecture and user feedback, ensuring each step is dedicated to specific tasks, thereby preventing information overload for users.
D E V E L O P M E N T O F F E A T U R E 0 1
💡Streamline the content on each page to avoid overwhelming users and make the key points stand out.
D E V E L O P M E N T O F F E A T U R E 0 2
💡We designed a new subscription pop-up window that helps enhance user experience by:
1. Allowing users to access subscription plans without interrupting their workflow
2. Providing a clearer visual hierarchy for easier comprehension
3. Including a credit calculator to help new users understand and efficiently use their limited free credits
D E V E L O P M E N T O F F E A T U R E 0 2
💡Add missing subscription frequencies. Explain "Credit" and its breakdown briefly.
💡Implement the brand color more strategically to achieve a cleaner interface.
D E V E L O P M E N T O F F E A T U R E 0 2
D E V E L O P M E N T O F F E A T U R E 0 3
💡Following user feedback and extensive usability testing, we introduced the Regeneration Buttons for AI-generated images, text content, templates and scripts:
💡Regeneration Buttons enable users to refresh their AI-generated content without extra charges or using additional credits.
💡Also, users are given the choice between an AI-guided template creation session for a more personalized approach, or selecting directly from a curated library for speed and convenience.
" High usage of the generative feature per element raises operational costs, posing a challenge for the sustainability of our subscription-based model..."
D E V E L O P M E N T O F F E A T U R E 0 3
💡We consider this feature fundamental for enhancing the user experience on AI-generated content (AIGC) platforms. Convincing the business teams of the necessity of this feature, despite its additional cost, was a key milestone in prioritizing the user experience.
💡Its effective, user-friendly bulk editing capability positions Dr.Lambda favorably in the competitive market, aligning with goals of user retention and attracting new clientele.
D E V E L O P M E N T O F F E A T U R E 0 4
💡We introduced a presenter view in the feature workflow, enabling users to present their slides directly without the need to download or navigate away from Dr. Lambda's website.
" We do not wish to introduce an additional step for users to select the time length, as the script feature is not the primary focus of our target."
.png)
D E V E L O P M E N T O F F E A T U R E 0 4
💡We accepted the advice and eliminated the additional step of allowing users to choose the time length of the scripts. We then delved into brainstorming the presenter view with scripts to enhance the effectiveness/value of the script component.
.png)
D E V E L O P M E N T O F F E A T U R E 0 4
💡The presenter view, featuring a timer, slides, and scripts, enables users to better align each script with the corresponding slide, while the timer provides additional assistance in managing their presentation timing.
UX design is not a smooth process. Every twist – be it pushback, evolving scopes, or compressed timelines – is a chance to grow. Through this project, I learned how to expect the unexpected and adapt swiftly.
As a designer, it's important to remember that I'm not only designing for now but also for the future. This project taught me to think long-term, considering the broader impact and future growth potential of every design decision.
Design is indeed a journey, and it's perfectly fine to have quick-fix solutions for immediate needs alongside long-term strategies that may take years to unfold. But strong rationales behind every decision are crucial. It helped me defend designs and create more constructive communication.
User feedback highlighted the importance of not overlooking technical pain points in designing the AI experience, as these are intrinsically linked and collectively shape the desired user experience.
T O B E G I N W I T H ...
Retirement can be a challenging period for many individuals, leading to feelings of a lack of accomplishment, belonging, and life structure. Although demographic changes have led to longer post-retirement periods, the extended lifespan does not guarantee increased quality of life, as older adults may experience increased loneliness, loss of purpose, and adverse health outcomes. This study developed a gamified app EncoreLife, featuring collaborative local activities, digital social interactions, and a reminder system, aiming to foster social connections and establish daily life structures for older adults transitioning to retirement.
Our goal with EncoreLife is to improve the quality of life for new retirees during this transition period. Through in-depth interviews and literature reviews, we identified that retirees suffer from a lack of meaning in life and increased loneliness.
So, how did we get there?
%201.png)
.png)
.png)
Users feel swamped by information overload on each step & page.
The page's packed with so much info, making it difficult to know where to focus my attention.
Users want the ability to customize, adapt, and maintain control over their workflow and input/output processes.
lf the slide I generate can combine with my template, it would make my life much easier.
Users are confused about how the pricing for each feature operates.
The screen displays a requirement for 10 credits, but I hadn't seen any mention of credits before. How many credits are required to create pages again?
Users need to download the slides and leave the website to present them using another application.
I feel like the entire process of downloading these PDF slides and presenting them elsewhere adds a lot of extra work.
.png)
✅Accessible Guides
Nearly all competitors provide essential guides, including 'Getting Started' and 'Help' documentation, conveniently located within both the dashboard and slide editing interface.
✅Transparent Credit Systems
The majority of competitors maintain clear credit transparency, offering complimentary trials of their advanced artificial intelligence tools as part of their initial AI credit allocation.
✅Versatile Compatibility
Seamless integration with leading third-party apps such as Figma and GIPHY.
T O B E G I N W I T H ...
Quackiverse aims to create an AI-powered, gamified language tutor targeting children aged 6 to 15, focused on cultivating their reading, speaking, and listening abilities in a secondary language. Through personalized avatars, real-world AR interactions, and adaptive game-based learning pathways, this platform aims to make language learning accessible, enjoyable, and flexible.
Quackiverse aims to create an AI-powered, gamified language tutor targeting children aged 6 to 15, focused on cultivating their reading, speaking, and listening abilities in a secondary language. Through personalized avatars, real-world AR interactions, and adaptive game-based learning pathways, this platform aims to make language learning accessible, enjoyable, and flexible.
So, how did we get there?
Users feel swamped by information overload on each step & page.
The page's packed with so much info, making it difficult to know where to focus my attention.
Users want the ability to customize, adapt, and maintain control over their workflow and input/output processes.
lf the slide I generate can combine with my template, it would make my life much easier.
Users are confused about how the pricing for each feature operates.
The screen displays a requirement for 10 credits, but I hadn't seen any mention of credits before. How many credits are required to create pages again?
Users need to download the slides and leave the website to present them using another application.
I feel like the entire process of downloading these PDF slides and presenting them elsewhere adds a lot of extra work.
✅Accessible Guides
Nearly all competitors provide essential guides, including 'Getting Started' and 'Help' documentation, conveniently located within both the dashboard and slide editing interface.
✅Transparent Credit Systems
The majority of competitors maintain clear credit transparency, offering complimentary trials of their advanced artificial intelligence tools as part of their initial AI credit allocation.
✅Versatile Compatibility
Seamless integration with leading third-party apps such as Figma and GIPHY.
T O B E G I N W I T H ...
Launch V6CO's website as a minimum viable product (MVP) that truly represents our mission to revolutionize wellness and home healthcare. This platform will double as an educational resource on wellness and longevity and as a storefront showcasing our pioneering Dr.@home product line. It's essential that the website reflects the team's passion, expertise, and forward-thinking approach, underscoring our commitment to improving the lives of the elderly and those at risk around the world. The site will also highlight our global manufacturing services and emphasize our secure distribution channels, including established partnerships with Costco, CVS, and Walgreens.
The goal for the MVP launch is to establish a robust online presence that:
🎯 Clearly communicates V6CO’s vision and mission to its visitors.
🎯 Showcases our products' detailed information on its use and benefits as well as how they can purchase.
🎯 Serves as an intuitive and accessible point of contact for potential vendors, partners, and customers seeking to join or support our mission.
🎯 Provides valuable content on wellness and preventive health care, highlighting our advocacy for affordable home wellness solutions.
🎯 Generates interest and leads for future product lines and catalyzes a community around home-based wellness care.
🎯 Offers a seamless user experience, despite the limited initial product range, preparing the ground for scaling up with future offerings in 2024 and beyond.
How Might We...
effectively guide and demonstrate the value of paid features to new creators/users at an earlier stage in their experience?
The result was a seamless, scalable website that not only elevates the brand's digital presence but also sets a solid foundation for future product expansions. The launch strategy incorporated a comprehensive marketing toolkit to amplify reach and engagement. Post-launch, the website has demonstrated a tangible increase in customer interaction and potential partner inquiries, validating the success of the MVP as a cornerstone for V6CO’s ongoing digital strategy.
💡As our company specializes in technology-based home wellness products, we aim for a color scheme that is bold yet conveys reliability and innovation, primarily utilizing blue to achieve this effect. Additionally, our logo, V6CO, is inspired by the word 'physical,' which is why green is another prominent color in our design system, symbolizing growth and vitality.
T O B E G I N W I T H ...
Reduce serious fall injuries with the V6CO Guardian Air Vest Over 35 million falls are reported every year, with more than 32,000 deaths. One out of every five falls leads to a severe injury, such as hip fractures, broken bones, or head trauma injury in seniors. The V6CO Guardian Air Vest has been designed to help reduce the number of severe injuries from falls.
Our objective is to develop an interactive app for the Guardian Air Vest that enhances the connection between guardians and their loved ones. By providing this unique feature, we aim to differentiate our product in the market and increase our sales rate.
1. The app will provide guardians with real-time information on the wearer's movement direction and send immediate alerts in the event of a fall, which could potentially lead to a severe accident.
2. By enabling guardians to take prompt action in response to a fall, the app aims to reduce the risk of injury and provide peace of mind, ensuring that they are aware of their loved one's safety at all times.
How Might We...
design an app that enables guardians to more effectively track and assist elderly individuals who are at risk of falling in their everyday lives?
S H O R T - T E R M
1. Simplify and present visually clear information regarding the user's fall status.
2. Track the user's walking route to ensure their location is known.
3. Implement an alarm feature to promptly alert guardians when the user falls, enabling timely assistance and care.
L O N G - T E R M
1. Develop a promotional page to showcase our other related products.
2. Provide users and their guardians with weekly, monthly, and yearly reports to maintain a record of their activity and safety.
increase in sales rate
increase in attracting retailers
C U R R E N T
Resgister/Log in accounts from Guardian/User
C U R R E N T
Device Details with device basic information (for both user and guardian), walking route history, alarm data and device user settings
C U R R E N T
Alarm feature with user's fall history
1. Alarm messages enable guardians to review detailed alarm data by date
2. Users can track the device's action history using the calendar
3. When a fall alarm is received, a call can be made to the connected guardian directly through the app
C U R R E N T
My account page allow user to update their personal information, learn more about the app, as well as provide feedback
💡To align with our product design and our company's color theme, we have chosen blue as our primary color. Additionally, based on research conducted on our target audience, we found that they prefer darker colors with simple page layouts and visuals for easier navigation and use of the app.
So, how did we get there?
Falls are common and costly, especially among Americans age 65 and older. But falls are preventable and do not have to be an inevitable part of aging.
Every second of every day, an older adult (age 65+) suffers a fall in the U.S.—making falls the leading cause of injury and injury death in this age group. One out of four elderly adults will fall each year in the United States, making falls a public health concern, particularly among the aging population.
🙋♀️There is a gap between the vest User and their Guardian...
As the current system does not provide real-time communication or alerts to the guardian in the event of a fall. This lack of immediate notification can delay the response time and potentially worsen the outcome for the user.
To gain deeper insights into our users and their experiences within our design framework, we developed a user journey map.
Based on our research and analysis, we have identified the main features and details that need to be displayed within our app. Our goal is to make the interface as simple and visually clear as possible, ensuring that users can easily access the information they need.
D E V E L O P M E N T O F F E A T U R E 0 1
D E V E L O P M E N T O F F E A T U R E 0 1
💡I refined the layout and icon and made selective cuts of texts for enhanced visual clarity, ensuring that users are not overwhelmed by excessive information in the front page.
D E V E L O P M E N T O F F E A T U R E 0 1
" I like the idea of combining some information together to make the page less text-heavy."
D E V E L O P M E N T O F F E A T U R E 0 2
💡Users can conveniently scan the QR code on the device and connect it to their current account.
" Scanning may encounter issues in low light or when the image is blurry. Adding a manual input option could improve usability.
(Note: Only when device is within distance.)"
D E V E L O P M E N T O F F E A T U R E 0 2
🙋An 'Album' feature has been added, allowing users to manually upload pictures of the device QR code.
D E V E L O P M E N T O F F E A T U R E 0 3
D E V E L O P M E N T O F F E A T U R E 0 3
D E V E L O P M E N T O F F E A T U R E 0 4
" 'Tracking steps' is only possible when the user allows the phone to access their location. Therefore, creating a 'Walking Trajectory Video' can be challenging. We recommend changing it to a simple map displaying the route with a starting point and destination."
D E V E L O P M E N T O F F E A T U R E 0 4
🙋We do think the video might not be necessary, so we have replaced it with a map picture.
T O B E G I N W I T H ...
Currently, our workflow involves several steps, including inputting a topic, generating outlines, choosing detailed options (paid), generating slides, audio (paid), and videos (paid). However, our research indicates that some users find the current flow confusing, while others desire a more comprehensive experience without immediate payment. Unfortunately, our current AI costs pose a challenge in providing extended experiences without compromising on expenses.
We aim to redesign our workflow to enhance user understanding of available functionalities and increase overall satisfaction with the DrLambda experience by:
1. Provide users with insights into more advanced functions without incurring additional server costs.
2. Improve the conversion rate 📈 from free users to paid subscribers.
How Might We...
effectively guide and demonstrate the value of paid features to new creators/users at an earlier stage in their experience?
(Refined) How Might We...
enhance the value demonstration for unpaid users and streamline the workflow for both paid and unpaid users to minimize confusion and friction, thus boosting the conversion rate?
S H O R T - T E R M
1. Simplify and provide visually clear subscription and credit system
2. User-friendly workflow with easy navigation and step revisiting
3. New dashboard for project organization
4. Presenter view feature on the website
L O N G - T E R M
1. Updated and adaptable design system
2. More template options and smart template using AI
3. Editing tool for customizing
4. AI-autogenerated slides with images
5. AI assistant for user support and problem resolution
6. AI-generate & regenerate text/image
7. AI video generation based on slides' contents
increase in subscription conversion
increase in returning users
increase in task completion time
So, how did we get there?
Users feel swamped by information overload on each step & page.
The page's packed with so much info, making it difficult to know where to focus my attention.
Users want the ability to customize, adapt, and maintain control over their workflow and input/output processes.
lf the slide I generate can combine with my template, it would make my life much easier.
Users are confused about how the pricing for each feature operates.
The screen displays a requirement for 10 credits, but I hadn't seen any mention of credits before. How many credits are required to create pages again?
Users need to download the slides and leave the website to present them using another application.
I feel like the entire process of downloading these PDF slides and presenting them elsewhere adds a lot of extra work.
✅Accessible Guides
Nearly all competitors provide essential guides, including 'Getting Started' and 'Help' documentation, conveniently located within both the dashboard and slide editing interface.
✅Transparent Credit Systems
The majority of competitors maintain clear credit transparency, offering complimentary trials of their advanced artificial intelligence tools as part of their initial AI credit allocation.
✅Versatile Compatibility
Seamless integration with leading third-party apps such as Figma and GIPHY.
To gain deeper insights into our users and their experiences within our design framework, we developed a persona and a user journey map.
Following our analysis of the current user experience, we envisioned a new, optimized journey. Our goal was to create a happy path that streamlines the workflow, making it more intuitive, helpful, and user-friendly.
.png)
B E F O R E
❌Projects' iformation is not clearly presented
1. Projects aren't organized
3. Lack of credits information
A F T E R
Learn old/new projects
at a glance
1. All projects organized by date/last viewed/recently viewed/starred
2. Folders for users better organize their projects
3. "Grid" or "List" project view according to user's preference
B E F O R E
❌Information overload
in one page
1. Topic, audience, language, files, and link options are all included in one small panel, which might overwhelm user
2. GPT 3.5 and 4 switch button is not obvious
A F T E R
Streamlined overall workflow
1. We dissected the steps from "summary" to "summary" + "files" ensuring each step is dedicated to specific tasks, thereby preventing information overload for users
2. "Tone" option allow user to choose how they want their presentation tone be like
B E F O R E
❌Unclear information and hard to navigate
1. Clearer information hierarchy and more intuitive user actions needed
A F T E R
Visual decluttering on responsive page information
1. Options for user manually input outlines OR AI generate outlines
2. A responsive overview section to each slide
3. "Regenerate" funtion
B E F O R E
❌Fixed template without options for users
A F T E R
Multiple template options based on users' needs
1. Academic/business/casual templates
AI-Powered Template Creation
1. Integrating comprehensive AI capabilities at every touchpoint, ensuring a seamless and fully-enhanced customization experience
B E F O R E
Customization Gap, lack of user autonomy
❌A lack of personalization in the AI-generated options, failing to match individual user preferences quickly
❌Without "regenerate" option
A F T E R
Expanding the feature due to heavy user reliance, design to build user trust and navigational efficiency
1. AI-assisted images generation
2. AI-assisted content and styling editing: Providing efficient and practical AI-assisted content editing and styling for better slide content customization
3. "Edit layouts" features based on users' needs
B E F O R E
❌Without presentation mode
❌The "Scripts" page was separated from slides
A F T E R
Presenter view
1. We introduced a presenter view in the feature workflow, enabling users to present their slides directly without the need to download or navigate away from Dr. Lambda's website.
💡We extracted colors (primary and secondary colors) from DrLambda's logo and build the design system based on that.
💡We also introduced the Power Buttons: Incorporated into the design system, these buttons feature gradient colors and highlight AI-related features throughout the website. Their design helps Dr. Lambda demonstrate its technological prowess and value, especially to users new to AI and the platform.
D E V E L O P M E N T O F F E A T U R E 0 1
💡We refined the steps in the stepper for enhanced visual clarity
D E V E L O P M E N T O F F E A T U R E 0 1
💡We dissected the steps according to information architecture and user feedback, ensuring each step is dedicated to specific tasks, thereby preventing information overload for users.
D E V E L O P M E N T O F F E A T U R E 0 1
💡Streamline the content on each page to avoid overwhelming users and make the key points stand out.
D E V E L O P M E N T O F F E A T U R E 0 2
💡We designed a new subscription pop-up window that helps enhance user experience by:
1. Allowing users to access subscription plans without interrupting their workflow
2. Providing a clearer visual hierarchy for easier comprehension
3. Including a credit calculator to help new users understand and efficiently use their limited free credits
D E V E L O P M E N T O F F E A T U R E 0 2
💡Add missing subscription frequencies. Explain "Credit" and its breakdown briefly.
💡Implement the brand color more strategically to achieve a cleaner interface.
D E V E L O P M E N T O F F E A T U R E 0 2
D E V E L O P M E N T O F F E A T U R E 0 3
💡Following user feedback and extensive usability testing, we introduced the Regeneration Buttons for AI-generated images, text content, templates and scripts:
💡Regeneration Buttons enable users to refresh their AI-generated content without extra charges or using additional credits.
💡Also, users are given the choice between an AI-guided template creation session for a more personalized approach, or selecting directly from a curated library for speed and convenience.
" High usage of the generative feature per element raises operational costs, posing a challenge for the sustainability of our subscription-based model..."
D E V E L O P M E N T O F F E A T U R E 0 3
💡We consider this feature fundamental for enhancing the user experience on AI-generated content (AIGC) platforms. Convincing the business teams of the necessity of this feature, despite its additional cost, was a key milestone in prioritizing the user experience.
💡Its effective, user-friendly bulk editing capability positions Dr.Lambda favorably in the competitive market, aligning with goals of user retention and attracting new clientele.
D E V E L O P M E N T O F F E A T U R E 0 4
💡We introduced a presenter view in the feature workflow, enabling users to present their slides directly without the need to download or navigate away from Dr. Lambda's website.
" We do not wish to introduce an additional step for users to select the time length, as the script feature is not the primary focus of our target."
D E V E L O P M E N T O F F E A T U R E 0 4
💡We accepted the advice and eliminated the additional step of allowing users to choose the time length of the scripts. We then delved into brainstorming the presenter view with scripts to enhance the effectiveness/value of the script component.
D E V E L O P M E N T O F F E A T U R E 0 4
💡The presenter view, featuring a timer, slides, and scripts, enables users to better align each script with the corresponding slide, while the timer provides additional assistance in managing their presentation timing.
UX design is not a smooth process. Every twist – be it pushback, evolving scopes, or compressed timelines – is a chance to grow. Through this project, I learned how to expect the unexpected and adapt swiftly.
As a designer, it's important to remember that I'm not only designing for now but also for the future. This project taught me to think long-term, considering the broader impact and future growth potential of every design decision.
Design is indeed a journey, and it's perfectly fine to have quick-fix solutions for immediate needs alongside long-term strategies that may take years to unfold. But strong rationales behind every decision are crucial. It helped me defend designs and create more constructive communication.
User feedback highlighted the importance of not overlooking technical pain points in designing the AI experience, as these are intrinsically linked and collectively shape the desired user experience.
T O B E G I N W I T H ...
Currently, our workflow involves several steps, including inputting a topic, generating outlines, choosing detailed options (paid), generating slides, audio (paid), and videos (paid). However, our research indicates that some users find the current flow confusing, while others desire a more comprehensive experience without immediate payment. Unfortunately, our current AI costs pose a challenge in providing extended experiences without compromising on expenses.
We aim to redesign our workflow to enhance user understanding of available functionalities and increase overall satisfaction with the DrLambda experience by:
1. Provide users with insights into more advanced functions without incurring additional server costs.
2. Improve the conversion rate 📈 from free users to paid subscribers.
How Might We...
effectively guide and demonstrate the value of paid features to new creators/users at an earlier stage in their experience?
(Refined) How Might We...
enhance the value demonstration for unpaid users and streamline the workflow for both paid and unpaid users to minimize confusion and friction, thus boosting the conversion rate?
S H O R T - T E R M
1. Simplify and provide visually clear subscription and credit system
2. User-friendly workflow with easy navigation and step rvisiting
3. New dashboard for project organization
4. Presenter view feature on the website
L O N G - T E R M
1. Updated and adaptable design system
2. More template options and smart template using AI
3. Editing tool for customizing
4. AI-autogenerated slides with images
5. AI assistant for user support and problem resolution
6. AI-generate & regenerate text/image
7. AI video generation based on slides' contents
increase in subscription conversion
increase in returning users
increase in task completion time
So, how did we get there?
To gain deeper insights into our users and their experiences within our design framework, we developed a persona and a user journey map.
B E F O R E
❌Projects' information is not clearly presented
1. Projects aren't organized
2. Lack of credits information
A F T E R
Learn old/new projects at a glance
1. All projects organized by date/last viewed/recently viewed/starred
2. Folders for users better organize their projects
3. "Grid" or "List" project view according to user's preference
B E F O R E
❌Information overload in one page
1. Topic, audience, language, files, and link options are all included in one small panel, which might overwhelm user
2. GPT 3.5 and 4 switch button is not obvious
A F T E R
Streamlined overall workflow
1. We dissected the steps from "summary" to "summary" + "files" ensuring each step is dedicated to specific tasks, thereby preventing information overload for users
2. "Tone" option allow user to choose how they want their presentation tone be like
B E F O R E
❌Unclear information and hard to navigate
1. Clearer information hierarchy and more intuitive user actions needed
A F T E R
Visual decluttering on responsive page information
1. Options for user manually input outlines OR AI generate outlines
2. A responsive overview section to each slide
3. "Regenerate" funtion
B E F O R E
❌Fixed template without options for users
A F T E R
Multiple template options based on users' needs
🟦 Academic/business/casual templates
AI-Powered Template Creation
🟦 Integrating comprehensive AI capabilities at every touchpoint, ensuring a seamless and fully-enhanced customization experience
B E F O R E
Customization Gap, lack of user autonomy
❌A lack of personalization in the AI-generated options, failing to match individual user preferences quickly
❌Without "regenerate" option
A F T E R
Expanding the feature due to heavy user reliance, design to build user trust and navigational efficiency
1. AI-assisted images generation
2. AI-assisted content and styling editing: Providing efficient and practical AI-assisted content editing and styling for better slide content customization
3. "Edit layouts" features based on users' needs
B E F O R E
❌Without presentation mode
❌The "Scripts" page was separated from slides
A F T E R
Presenter view
🟦 We introduced a presenter view in the feature workflow, enabling users to present their slides directly without the need to download or navigate away from Dr. Lambda's website.
💡We extracted colors (primary and secondary colors) from DrLambda's logo and build the design system based on that.
💡We also introduced the Power Buttons: Incorporated into the design system, these buttons feature gradient colors and highlight AI-related features throughout the website. Their design helps Dr. Lambda demonstrate its technological prowess and value, especially to users new to AI and the platform.
D E V E L O P M E N T O F F E A T U R E 0 1
💡We refined the steps in the stepper for enhanced visual clarity
D E V E L O P M E N T O F F E A T U R E 0 1
💡We dissected the steps according to information architecture and user feedback, ensuring each step is dedicated to specific tasks, thereby preventing information overload for users.
D E V E L O P M E N T O F F E A T U R E 0 1
💡Streamline the content on each page to avoid overwhelming users and make the key points stand out.
D E V E L O P M E N T O F F E A T U R E 0 2
💡We designed a new subscription pop-up window that helps enhance user experience by:
1. Allowing users to access subscription plans without interrupting their workflow
2. Providing a clearer visual hierarchy for easier comprehension
3. Including a credit calculator to help new users understand and efficiently use their limited free credits
D E V E L O P M E N T O F F E A T U R E 0 2
💡Add missing subscription frequencies. Explain "Credit" and its breakdown briefly.
💡Implement the brand color more strategically to achieve a cleaner interface.
D E V E L O P M E N T O F F E A T U R E 0 2
D E V E L O P M E N T O F F E A T U R E 0 3
💡Following user feedback and extensive usability testing, we introduced the Regeneration Buttons for AI-generated images, text content, templates and scripts:
💡Regeneration Buttons enable users to refresh their AI-generated content without extra charges or using additional credits.
💡Also, users are given the choice between an AI-guided template creation session for a more personalized approach, or selecting directly from a curated library for speed and convenience.
" High usage of the generative feature per element raises operational costs, posing a challenge for the sustainability of our subscription-based model..."
D E V E L O P M E N T O F F E A T U R E 0 3
💡We consider this feature fundamental for enhancing the user experience on AI-generated content (AIGC) platforms. Convincing the business teams of the necessity of this feature, despite its additional cost, was a key milestone in prioritizing the user experience.
💡Its effective, user-friendly bulk editing capability positions Dr.Lambda favorably in the competitive market, aligning with goals of user retention and attracting new clientele.
D E V E L O P M E N T O F F E A T U R E 0 4
💡We introduced a presenter view in the feature workflow, enabling users to present their slides directly without the need to download or navigate away from Dr. Lambda's website.
" We do not wish to introduce an additional step for users to select the time length, as the script feature is not the primary focus of our target."
D E V E L O P M E N T O F F E A T U R E 0 4
💡We accepted the advice and eliminated the additional step of allowing users to choose the time length of the scripts. We then delved into brainstorming the presenter view with scripts to enhance the effectiveness/value of the script component.
D E V E L O P M E N T O F F E A T U R E 0 4
💡The presenter view, featuring a timer, slides, and scripts, enables users to better align each script with the corresponding slide, while the timer provides additional assistance in managing their presentation timing.
UX design is not a smooth process. Every twist – be it pushback, evolving scopes, or compressed timelines – is a chance to grow. Through this project, I learned how to expect the unexpected and adapt swiftly.
As a designer, it's important to remember that I'm not only designing for now but also for the future. This project taught me to think long-term, considering the broader impact and future growth potential of every design decision.
Design is indeed a journey, and it's perfectly fine to have quick-fix solutions for immediate needs alongside long-term strategies that may take years to unfold. But strong rationales behind every decision are crucial. It helped me defend designs and create more constructive communication.
User feedback highlighted the importance of not overlooking technical pain points in designing the AI experience, as these are intrinsically linked and collectively shape the desired user experience.
