Compass by Infosavvy
an AI-powered student success platform
Compass is an AI-powered student success platform developed for InfoSavvy, designed to reduce information overload and support academic achievement.
I led the UX/UI design for a web-based MVP that helps students get personalized answers to academic and campus-related questions via a real-time AI assistant. The platform also empowers academic advisors and administrators with an analytics dashboard to track student engagement, identify support gaps, and evaluate the AI’s performance.
My goal was to create a product that felt as intuitive as chatting with a mentor, but as scalable as an AI platform needs to be.
Deliverables:
Web Platform, Desktop & Mobile UI, Design System, Logo
Web Platform, Desktop & Mobile UI, Design System, Logo
Project Type:
Full End-to-End Product Design
Full End-to-End Product Design
Team:
Product Designer (me), CEO
Product Designer (me), CEO
Business Goal
To help universities scale student support and reduce advisor workload by introducing an AI assistant that efficiently handles routine academic and administrative queries.
USER IMPACT Goal
To give students instant, personalized answers and guidance—making campus resources easier to access, while helping advisors focus on higher-impact support.
Design Process
01 / Research & Ideation
Starting with the brief, I identified three core user groups: students, academic advisors, and university administrators. Each had distinct needs—quick answers, reduced support workload, and visibility into platform performance. I used these insights to frame the experience around accessibility, clarity, and adaptability across user types.
Starting with the brief, I identified three core user groups: students, academic advisors, and university administrators. Each had distinct needs—quick answers, reduced support workload, and visibility into platform performance. I used these insights to frame the experience around accessibility, clarity, and adaptability across user types.
02 / Brand Development
Before product design began, I created a full brand identity for Compass. Through multiple iterations of logo concepts, we explored visual metaphors around direction, guidance, and intelligence. The final mark reflects both academic precision and technological forward-thinking. I built a flexible brand system including typography, color palette, and iconography to ensure consistency across the UI and marketing.
Before product design began, I created a full brand identity for Compass. Through multiple iterations of logo concepts, we explored visual metaphors around direction, guidance, and intelligence. The final mark reflects both academic precision and technological forward-thinking. I built a flexible brand system including typography, color palette, and iconography to ensure consistency across the UI and marketing.
03 / Flow Mapping
User journeys were tailored to streamline tasks for each persona. Students log in, ask the AI questions, revisit chat history, and receive personalized recommendations. Advisors access dashboards with query analytics, escalation tracking, and student interaction trends. These flows ensured clarity and purpose across the experience.
User journeys were tailored to streamline tasks for each persona. Students log in, ask the AI questions, revisit chat history, and receive personalized recommendations. Advisors access dashboards with query analytics, escalation tracking, and student interaction trends. These flows ensured clarity and purpose across the experience.
04 / Wireframes
I created wireframes for key interfaces, including the AI chat window, analytics dashboard, user profiles, and help center. A modular layout allowed for both current needs and future expansion. Quick iteration cycles helped validate hierarchy, screen behavior, and content prioritization.
I created wireframes for key interfaces, including the AI chat window, analytics dashboard, user profiles, and help center. A modular layout allowed for both current needs and future expansion. Quick iteration cycles helped validate hierarchy, screen behavior, and content prioritization.
05 / UI Designs
I applied the newly developed brand system to high-fidelity mockups, emphasizing clean structure, institutional trust, and a welcoming tone. Design elements like typing indicators, chat history cards, and analytics heatmaps were built with clarity and accessibility top of mind. Responsive design ensured usability across desktops, tablets, and mobile.
I applied the newly developed brand system to high-fidelity mockups, emphasizing clean structure, institutional trust, and a welcoming tone. Design elements like typing indicators, chat history cards, and analytics heatmaps were built with clarity and accessibility top of mind. Responsive design ensured usability across desktops, tablets, and mobile.
06 / Implementation & Growth
I worked closely with the development team to hand off a complete design system and clickable prototype. All components were built in Figma using reusable patterns to ensure efficiency in implementation via React. Testing and iteration focused on ensuring logical AI interactions and intuitive navigation.
I worked closely with the development team to hand off a complete design system and clickable prototype. All components were built in Figma using reusable patterns to ensure efficiency in implementation via React. Testing and iteration focused on ensuring logical AI interactions and intuitive navigation.
NEXT STEPS
In future phases, we plan to integrate SSO login, class sign-up functionality, and enhanced AI customization options for universities. These updates will deepen personalization, simplify event access, and improve institutional flexibility.
Round-UP
Designing Compass gave me the opportunity to create not only a smart digital tool, but a brand experience rooted in clarity and connection. From logo to launch, I helped shape a product that empowers students to get the answers they need—and enables universities to better serve them at scale.
