Lilobot is a chatbot that supports high school graduates with their college enrollment process by addressing the problem of "summer melt," where many accepted students decide not to go to college. Lilobot is a research project part of the UCI Design and Partnership Lab.
Role
Designer - UI/UX Design, User Research
Team
Karla Avalos, Minh Nguyen, Isabel Pham
Advised by June Ahn, Jenny Han, and Ha Nguyen
Problem
"Summer melt is a common problem, especially among low-income students. Many high-school graduates who have been accepted to college and say they plan to enroll are knocked off-course if they do not obtain sufficient financial aid, miss administrative deadlines, or lack support from family and friends." - Harvard University Strategic Data Project
How might we design an chatbot that can provide high school students a support system to help them during the challenging transition to college?
Solution
We attempt to address summer melt using natural language processing to create Lilobot, an AI chatbot that can address a wide range of questions that students may have during the enrollment process. It has been trained with specific college information, allowing it to offer reminders and provide informative responses. Lilo also has features that help students think about their emotional worries and can potentially connect them with experienced college mentors.
Design Explorations
We initially focused on creating sketches and low-fidelity wireframes for a task management dashboard that would help students track their enrollment-related tasks for college.
However, as we got a better understanding of summer melt and how to design for AI, we realized we had to consider the socio-emotional aspect of the college journey. Our new goal was to focus on helping students figure out their college identity, while also creating a sense of community to help students understand they are not going through this journey alone.
With this new perspective, we went back to the drawing board to reimagine our initial sketches, transforming them into a more holistic and reflective journey towards college. Sketches were very important in our feedback process because it allowed us to give an idea of our vision without the need for full commitment in this design direction, allowing for more flexibility.
User Flow
During the process of revising our initial sketches, we took the opportunity to develop a well-defined user flow that solidified our ideas.
The user flow diagrams helped to envision a new path for Lilo; one where the user is given the option of going through the chat, tasks, or reflection process in their own order. This helps navigate away from task-oriented chatbots and helps users go at their own pace without overwhelming them.
Low Fidelity Wireframes
In our updated wireframes, we created a digital road trip concept that takes students on a journey towards college. The road trip consists of multiple stops, each representing a different task aimed at alleviating worries and providing valuable information about college life.
Mid Fidelity Wireframes
After several rounds of feedback we created mid fidelity wireframes, using the design system as a guide on the visual aspects, and the low fidelity wireframes to ensure all the essential content is addressed.
At the start of the trip, students will be asked to reflect on what they are excited about and any concerns they might have regarding college. This input will be used to generate a personalized roadmap tailored to their specific needs and goals.
At each stop along the road trip, students will have the opportunity to engage in a chat with Lilo, where they can seek guidance, ask questions, or express any concerns they may have. These interactions with Lilo will provide valuable support and information to the students.
After visiting each stop, students will be encouraged to reflect once again. This reflection process allows students to track their progress, gain confidence, and address any lingering concerns throughout their journey. In addition, using the information from this reflection, Lilo can update student’s roadmaps to fit their new concerns.
Challenges
Throughout the design process, we were initially blocked by the idea of traditional AI chatbots and task checklists. This led to us losing touch with the emotional aspects that Lilo initially was aimed to have at its forefront.
After realizing this, we focused more on Lilo’s emotional chat sections and reflective portions of the site. We focused on redesigning the tasks as another resource that students can access, rather than a mandatory action item.
Reflection
While designing, our design team would consistently seek feedback from our team, however, we were not clear about what type of feedback we were looking for. During these feedback sessions, we came up with many new ideas and directions to improve Lilo. This caused us to not have a clear direction and left us iterating on our sketches and low-fidelity designs longer than expected. For future projects, we hope to establish a clear direction and goal earlier on in the process and be specific about what type of feedback we are seeking as a design team.