CollegeBot
Empowering Education with AI-Powered Assistance
B2B
+280% User Registration Rate
Scroll down to explore
uteach.com
My role
UX/UI Design, UX Research, Strategy, Product Management, Marketing
TEAM
TARGET AUDIENCE
Instructors and Students in Higher Education Institutions
TIMELINE
Sep - Dec 2024 - Ongoing
The Opportunity
BACKGROUND
Community and public colleges face educational inequality, with 1 advisor for 1000 students and repetitive professor workloads.
WHY IS IT IMPORTANT?
Elite AI tools exist but are inaccessible to underserved colleges, deepening the information gap.
WHAT WE DO
We created Collegebot to provide 24/7 support, simplify teaching, and improve student engagement.
to
> 1000 students
1
Advisor
50 students
1
Professor
150 students
80 students
...
Students are Underserved
Professors are Understaffed
AI Tools are inaccessible
Impact
My Role
As the Founding and Lead Product Designer for CollegeBot.AI, I drove the end-to-end design from 0 to 1, leading research, strategy, development, and launch. By shaping core features through wireframing, prototyping, user testing, and A/B testing.
Improvement
Boost in User registration by 280% and user satisfaction by 65%. These results directly contributed to CollegeBot.AI securing $3M in funding and expanding adoption to 10+ public schools.
280%
User Registration rate
65%
User Satisfaction rate
Solution At A Glimpse
Our Solution
We have created an AI advising bot for these underrepresented students and stressful professors!
How We Get There
Design Process
Collegebot was initially designed to be an all-in-one SaaS AI tool for public campuses. However, feedback from actual operations revealed suboptimal performance. After joining as the Lead Product Designer, I conducted a series of research and iterations, ultimately redefining the platform to focus on the AI Course Assistant as its core service.
What have worked well in the market?
As Collegebot aims to provide AI-powered solutions for education, I conducted competitive research on similar platforms, focusing on how they streamline workflows for instructors, simplify student interactions, and protect user data.
We identified valuable features that our competitors leverage to enhance educational support and foster engagement, such as Customizable AI Agents, Real-time Data Feedback, Privacy Protection, Visualized Data Insights, Simplified Document Analysis, and AI Tools for Students. These features guided our approach to designing a solution that prioritizes both usability and functionality for instructors and students.
01
Real-Time Feedback
Provide instructors with immediate course and student insights for quick adjustments.
02
Integrated Metrics Dashboard
Highlight key metrics to aid efficient decision-making.
03
Personalized AI Tools
Enable customization for tailored teaching and learning experiences.
Stakeholders Interview and Persona
To gain deeper insights into the needs of students and professors in the education process, we invited Professor Ricky C. from SJSU to share the main challenges he faces during teaching. Additionally, we conducted a survey to collect feedback from 103 students from community and public colleges.
Instructor
Student
Explore the pain points in daily learning and teaching routines.
Identify key issues where students need real-time academic support.
Define the functional requirements and UX design scope for Collegebot.
What We Learn From
The two primary personas have distinct perspectives when analyzing data, allowing them to enhance their decision-making capabilities in their respective work routines.
“I want to save time on repetitive tasks and gain insights into my students’ performance.”
Instructor
Job Duties:
Design and deliver course materials.
Manage student questions and academic records.
Assess student progress and tailor teaching strategies.
User Goal:
Reduce time spent on repetitive queries.
Monitor student engagement and performance.
Use CollegeBot to enhance teaching efficiency.
“I want quick access to academic resources and support to stay on top of my studies.”
Student
Job Duties:
Attend classes and complete assignments.
Engage in extracurricular activities and part-time work.
Seek help for academic and career guidance.
User Goal:
Get timely support for academic queries.
Discover campus events and opportunities.
Use CollegeBot to streamline academic and career planning.
Design Rationale: Building an AI-driven Educational Ecosystem
To address the distinct needs of instructors and students, our IA structure was shaped by the following insights:
Challenges in Designing an AI Course Assistant:
How to improve?
#1: Diverse User Needs
Instructors and students have distinct needs and workflows. Instructors focus on managing courses and gaining actionable insights, while students prioritize quick access to academic and career resources.
👉
🌟 User-Centric Design
Tailor features to meet each group's unique requirements, ensuring seamless integration and user satisfaction.
#2: Fragmented Data Insights
Without integrated metrics, both students and instructors struggle to identify trends or make data-driven decisions.
👉
🌟 Real-Time Dashboards
Provide real-time dashboards summarizing key data to enhance decision-making and improve workflow efficiency.
#3: Limited Personalization
Generic tools fail to adapt to individual courses or users, reducing engagement and usability.
👉
🌟 Customizable AI Tools
Implement customizable AI tools, enabling tailored experiences for both teaching and learning contexts.
#4: Complex Workflows
Unintuitive workflows make it challenging for users to navigate tools or complete tasks efficiently.
👉
🌟 Streamlined Processes
Design streamlined processes with clear hierarchies to simplify user interactions and improve productivity.
Information Architecture
Empower Teaching and Learning, Foster Engagement, Enhance Productivity, and Personalize Experiences for Instructors and Students
Ideation
Design iterations
Design iterations focused on refining product logic, addressing stakeholder feedback, and enhancing usability with a phased approach.
MVP version: To ensure a quick launch, the first version focuses on establishing product logic while reusing the existing UI design. The MVP was completed in 48 hours and tested with professors to gather feedback. This approach allows the development team to implement core functionalities while the marketing team pitches the product to expand adoption across more schools and increase user numbers.
Adjustments after Stakeholder Feedback:
1st Iteration: Minor changes based on the MVP version, primarily monitoring backend data without altering the user flow.
2nd Iteration: Adjustments to the product user flow, creation of a design system, and adoption of a more streamlined UI that aligns with WCAG standards and accessibility requirements.
01
Major Iteration 01:
To create an intuitive and efficient Instructor User Flow.
Iteration 01 : Asynchronous Creation Logic
Developer
We can't let users create a knowledge base (add course materials) without assistant chatbot data already recorded. The database won’t locate the data, so creating the assistant chatbot and the knowledge base has to be separate steps.
User (Instructor)
Can you make creating the assistant chatbot as simple as possible? We don’t want to feel like it’s complicated.
Alright, how about we split this into three steps? First, users create the assistant chatbot. Second, they input the knowledge base. Finally, they test the assistant chatbot.
Me (Product Designer)
wireframe
1st Iteration
MVP version
1
2
3
❌ All creation steps completed at once — Users find it convenient, but the development logic doesn't work.
✅ While adhering to development logic: Allow asynchronous creation of the robot and training files, with clear prompts for users on the required steps:
Create the robot; 2. Record the knowledge base; 3. Test the robot.
2nd Iteration
✅ Inform users about the background file upload process, reassuring them that they can navigate away and perform other tasks without interrupting the upload progress.
Iteration 02 : Managing the Student Invitation Process
User (Instructor)
When I finish creating a course assistant, I sometimes forget to share the access code with students. I wish there was more than one way to share the assistant with students, making it easier to manage enrollments.
Product Manager
For the MVP, let's keep the development timeline short and prioritize a quick launch.
We implemented both suggestions! In version 1.0, we added a preview feature where instructors can easily find and share the access code to prevent any issues. For version 2.0, we plan to add a dedicated interface for managing student enrollments, making the process seamless for instructors.
Me (Product Designer)
wireframe
1st Iteration
MVP version
❌ After creating the assistant chatbot, the pop-up for copying and sharing the access code sometimes gets overlooked by instructors, causing delays in sharing it with students.
✅ Instructors can now conveniently copy the access code from the preview chatbot card after creation, ensuring they can still share the course with students anytime.
2nd Iteration
✅ A dedicated 'Add Students' page allows instructors to manually add student emails or upload an Excel list for enrollment. Instructors can also delete students or resend invitations as needed, covering all possible use cases.
Iteration 03 : Managing the Training Material Interface
User (Instructor)
When I want to add learning materials for the assistant, I’m forced to re-enter the course creation flow. I don’t want to see other irrelevant information or waste time on unnecessary steps.
Product Manager
The MVP version should focus on reducing development time and ensuring a quick launch.
The current version does not impact functionality but compromises user experience. From the perspective of fast delivery in MVP, the next version (2.0) will introduce a dedicated interface for adding learning materials to improve the user experience.
Me (Product Designer)
wireframe
MVP version
❌ Instructors need to skip through the entire assistant creation process to add or modify materials, and they must republish to update the assistant.
2nd Iteration
✅ Added an interface for adding and modifying training materials, allowing users to update and train the assistant in real time.
✅ There are two file names: the original file name and an editable file name. – This allows professors to customize names for easier differentiation, considering cases where file names are inconsistent or duplicate but contain different content.
02
Major Iteration 02:
To create an integrated and intuitive Students’ User Flow.
Iteration 01 : Course-Specific History Records
User (Student)
The history threads show everything, but there’s no distinction between different courses, making it difficult to locate the specific history for a particular course.
Product Manager
Students need to access specific history threads as part of their learning logs and knowledge storage. This feature helps establish user reliance on the Collegebot.ai.
In version 1.0, we added a 'Course Filter' for history records. Entering a specific course will automatically display its corresponding history.
In version 2.0, there will no longer be a global history message list. Each course will have its own dedicated history section.
Me (Product Designer)
wireframe
1st Iteration
MVP version
❌ All course assistant history messages are listed under a single "history" section, making it difficult for students to locate the specific thread for their course.
✅ Add a course filter to the history records. When entering the corresponding course assistant, the history will automatically switch to the relevant course.
✅ Clearer hierarchical structure:
Search → Course Assistant → Corresponding History Records.
2nd Iteration
Based on feedback from both Instructors and students :
We gathered suggestions for improving the next iteration by creating a design system that focuses on a simplified, more accessible UI aligned with WCAG standards.
In addition to improving core functionalities and interactive components, we focused on enhancing visual details✨ to deliver a polished design that strengthens branding✨ and keeps users engaged in exploring and interacting seamlessly✨.
More to explore
Web Application Design | SaaS
Orby AI Process Dashboard Redesign
Redesign Saas Process Automation Dashboard to improve operational efficiency and task completion rate
Read Case Study
B2B
Document AI
Mobile Application Design | Fintech
Ark7 Learn and Reward System
Design end-to-end learning and rewards system to enhance user engagement and order completion rate
Read Case Study
B2C
+53% Order Completion Rate
Carplay Application Design | HMI
JourneyLink V2V Carplay System
A HMI system that forging seamless connections among long-distance multi-vehicle roadtrips
Read Case Study
HMI
80% task success rate
Let's Connect!
Feel free to get in touch with me here ↓
jenniferzeng5562@gmail.com
Instagram →
Crafted with love
by Jennifer Zeng in New York City © 2024