Slides Customization Enrichment
Product Designer
User Research, Information Architecture, Usability Testing, Accessibility Notation, Interface Design, Prototyping
Oct 2023 - Dec 2023
1 Project Manager
5 UX Designer
Figma, Notion, Pen & Paper
DrLambda.ai is a versatile knowledge remix engine designed to easily convert PDFs, webpages, and YouTube content into various preferred formats.
Dr. Lambda’s slides creation feature is particularly useful for users including researchers, educators, students, consultants, and office professionals, offering a convenient solution for content transformation.
What are the problems?
Despite having advanced AI-generated text content, the current slide templates from Dr. Lambda.ai lack sophistication and customization in design.
Additionally, with only two templates available, users face restricted options for visually enhancing their slides, indicating a need for a broader range of more sophisticated and customizable design options.
Our goal is to enable users to customize slide templates based on their individual preferences and to facilitate the sharing of these personalized designs within the community.
In addition, we also aimed at ensuring users’ creation process for these slide templates is in harmony with the users' mental models, essentially making the design intuitive and user-friendly.
As a UX Researcher/ Designer, I take the lead the interface design process and established a design system that spearheaded among all features provided by Dr Lambda.ai.
During the research phase, I conducted in-depth user research with potential users, designed and tested the prototypes to optimize the user experience and ensure seamless integration with existing platforms.
We revamped the current visual design, and proposed a smoother user experience leveraging artificial intelligence to improve the slide customization capabilities of DrLambda.ai, resulting in an enhanced user experience when developing presentations.
Project Timeline
Find Problems
01.
What problems do people have for the current website?
To answer this question, we chose to send out questionnaires using google forms to collect users feedback for current website. This method gives us a general overview of problems that users might have.
What problems do people have for the current website?
To answer this question, we chose to send out questionnaires using google forms to collect users feedback for current website. This method gives us a general overview of problems that users might have.
02.
What are our users’ exact needs?
Considering the user need of different stakeholders, we want to dive into their daily scenario. Therefore, we chose to conduct the in-depth interview to find out the pain-points.
What are our users’ exact needs?
Considering the user need of different stakeholders, we want to dive into their daily scenario. Therefore, we chose to conduct the in-depth interview to find out the pain-points.
03.
What is a good help page design?
We analyzed 26 public access help pages encompassing search engines, collaborative digital platforms, and higher education institutions to uncover the best practices and areas for improvement.
What is a good help page design?
We analyzed 26 public access help pages encompassing search engines, collaborative digital platforms, and higher education institutions to uncover the best practices and areas for improvement.
01
Quantitative Research - 44 Questionnaire responses
In the questionnaire, we ask questions regarding the user's preferences for device selection, frequency of use, and opinions on the current design and features. More importantly, gathering general feedback on which sections of the page are used most will help us prioritize small sections in future redesign.
Here are the summarized results from the questionnaire:
75%
Users often navigates the site through the “Search” function.
.
63.7%
Users think the visual design can be improved.
52.3%
Users find it difficult to locate desired information.
86.4%
Users access the page through Laptops.
Sample questions we asked:
Summarized Insights learned from the Questionnaire:
Search Feature Enhancement
Enhance the functionality and visibility of the ‘Search’ feature.
Information Hierarchy Redesign
Reorganize the IA and prioritize sections based on questionnaire results.
Visual design Improvement
Redesign the visual of the whole website and align with NYU color system
02
Qualitative Research - 20 User Interviews
In summary, we interviewed various stakeholders to identify their specific needs. We asked detailed questions related to the search function and the current information architecture to receive in-depth feedbacks from the users.
11
studentsStudents are the main user who navigate through the help website for resources .
.
4
AdministratorsEvery administrator updates their own content to the website themselves.
3
ResidentsResidents work in different labs and introduce the lab to student on the website.
2
FacultiesFaculties link the resources and information from the website to their syllabus.
Summarized Design Actions based on our interview notes:
Enhance Information Hierarchy
01. Information Architecture
There are a lot of repetitive sub-tabs under each section. The side menu is cluttered with too many links, making the navigation complex and difficult to use.
02. Layout and Hierarchy
The current layout design making it difficult for users to discern the importance and organization of content.
Improve
User Experience
The help page layout is attractive and not user-friendly. 03. Visual Designs
04. Terminology Issues
The terminology of sections is not accurate.
Enrich
Functionality
05. Search Bar
Students find it challenging to access the search bar.
06. Resources
For first year students, it would be helpful to have a better designed floor map.
Define Problems
Based on our research insights, we used the HMW statement to help us clarify our direction and actions.
We have two HMW statements as they focused on different directions.
01. How might we optimize the ITP/IMA help page to improve users' information navigation efficiency and quickly get what they want?
02. How might we enhance the accessibility in design to ensure inclusivity for all users?
Enhance Information Hierarchy
We reorganized the new Information Architecture, removed repetitive sub-tabs, and rephrased the terminology used for different sections to ensure clarity and efficiency for users.
Current Information Architecture
New Information Architecture
Digital Accessibility Approach
With guidance from Jodi Arlyn Goldberg, we redesigned with a focus on accessibility. 6 major accessibility issues were being identified through the consultation with the NYU digital accessibility team. To address the current accessibility issues, we delved into the problems themselves to find a coordinated solution.
NYU has adopted the World Wide Web Consortium’s Web Content Accessibility Guidelines (WCAG) 2.0, Level AA as its standard for digital accessibility.
Accessibility Issues
Missing alt text
Embedded links in the header
Embedded links in the header
Color contrast problem
Pdfs should be accessible pdfs
Pdfs should be accessible pdfs
Heading rank problem
Tab order should match the visual order
Tab order should match the visual order
Design and Validation
We created different types of wireframes and conducted a small scale usability testing to validate the most efficient user flow, after we selected our wireframes, I led the interface design process and established a design system that proposes a more efficient workflow.
Wireframes
We reached out to 10 interviewees from the user interview process.
Then, we conducted usability testing in-person to observe how our users interacted with the working low-fidelity prototypes.
After the usability testing, we decided to choose option 1 because it presents all the information efficiently in one place, and the length of the website is the shortest, which helps the users navigate quickly compared to the other two options.
Option 1
Option 2
Option 3
Design Systems
I created the design systems to align with other NYU Tisch websites. The font and color choices mainly follow the NYU design system, and the format is learned from Microsoft Teams UI.
In December, our team pitched this redesign proposal to our product manager Scott, the pitch is very successful, and we turned this volunteer project into a on-campus position for further improvements and implementations.
Final Design Overview