Major Project 2 - EduBuddy

⭐ 3/2/2026 - 28/3/2026 (Week 1 - Week 7)

🎀 Yan Zhi Xuan | 0369425

💜 Major Project 2 | Bachelor of Design (Hons) in Creative Media | Taylor's University

📚 EduBuddy

TABLE OF CONTENTS /ᐠ - ˕ •マ ⋆｡°✩

1. Work Progress

5. Feedback

6. Reflections

1. Work Progress ⊹ ࣪ ˖₊˚⋆˙⟡

Week 1

Items Discussed with Supervisor

During our first consultation, we presented our Major Project 1 Figma prototype to our supervisor, Mr Razif. The session focused on reviewing the overall project direction, identifying areas for improvement, and refining the core feature of the app. We also discussed how the user flow and feature priorities could be further developed to strengthen the concept.

Our Actions

1. MVP Flow Refinement

The prototype was restructured to focus on the core question:
“How quickly and effectively can a user find a study buddy and start studying?”

Key improvements:

Simplified onboarding (subject, availability, learning style only)
Streamlined Study Buddy matching system (subject, time, preference)
Clear study session flow:
- Join study room
- Use timer (Pomodoro/countdown)
- View buddy presence
Basic accountability tracking (sessions completed)

Non-core features such as avatar customisation and gamification were moved to future work to maintain focus.

2. Wireframe Planning & Feature Prioritisation

Reduced onboarding steps to improve usability
Redesigned Home Page to highlight “Find a Study Buddy”
Focused MVP on 1-to-1 matching flow
Study Room simplified to essential tools:
- Timer
- Chat
- Buddy presence
Advanced features (whiteboard, screenshare, gamification) marked as future enhancements

3. Art Direction Development

Explored and tested multiple colour palette options in Figma
Defined initial visual direction aligned with app concept
Considered overall design consistency including typography and UI style

Fig. 1.1 Art Direstions of EduBuddy.

4. Micro-Animation & Sound Exploration

Experimented with micro-animations using Adobe After Effects
Tested visual motion elements for integration into Figma prototypes
Began exploring sound design to enhance interaction feedback

Fig. 1.2 I edited logo animation in AE and exported to Capcut to edit the sound effects.

Week 1 focused on realigning the project with its core objective—helping users quickly find and study with compatible study buddies. Based on supervisor feedback, the team successfully refined the MVP, simplified user flows, and began establishing the app’s visual and interaction design direction.

Week 2

Items Discussed with Supervisor

In Week 2, we reviewed our previous progress with Mr Razif and presented updates on both design and interaction aspects. This included our initial animation experiments created in After Effects, as well as our first attempt at low-fidelity (lo-fi) prototypes. We also sought feedback on the app’s animation direction, logo style, and splash screen visuals.

Our Actions

1. User Flow & Wireframe Refinement

We focused on improving the structure and clarity of the app’s user journey by refining our initial low-fidelity wireframes and progressing towards high-fidelity design.

Key developments:

Improved onboarding flow:
- Landing page, introduction, login/sign-up
- User details (study field, time, style, etc.)
- Student ID generation
Enhanced Home Page:
- AI Match system with saved preferences
- Recommended study buddies and group previews
Study Page features:
- Study timer and subject tracking
- Avatar-based personal study room
- Active buddies and group sessions
- Functional tools (whiteboard, call, AI summary, Spotify integration)

Non-core pages such as Chat and Avatar customisation were identified as secondary features and deprioritised to maintain focus on the MVP.

2. Study Room Visual Development

We focused on designing the visual experience of the Study Room to align with our app’s concept and art direction.

Key progress:

Created initial study room sketches using Procreate
Transferred and reconstructed illustrations in Adobe Illustrator
Refined shapes and layout for cleaner, scalable visuals
Finalised the colour palette to ensure consistency across the interface

Fig. 1.3 Study Room in Adobe Illustrator.

Fig. 1.4 Study Room in Adobe Illustrator.

3. Animation Exploration

We continued experimenting with animations using After Effects
We tested visual styles for the logo and splash screen
We explored ways to integrate motion into the user interface without disrupting usability

Week 2 focused on refinement and visual development. With positive feedback on our design consistency and animation quality, we progressed from low-fidelity to more polished wireframes while strengthening the user flow. At the same time, we further developed visual elements such as the Study Room and overall art direction to support a cohesive user experience.

Week 3

Items Discussed with Supervisor

During Week 3, no formal consultation was conducted due to the Chinese New Year holiday. As a result, we focused on self-directed progress and internal team discussions to ensure the project continued moving forward.

Our Actions

1. High-Fidelity Wireframe Development

We transitioned from low-fidelity to high-fidelity wireframes, focusing on improving the overall structure and usability of the app.

Key improvements:

Refined and upgraded low-fidelity wireframes into high-fidelity designs
Simplified the onboarding process to allow faster user registration and matching
Improved the user flow for a smoother and more efficient experience
Adjusted the navigation bar to 4 main sections to better organise core features of EduBuddy

Fig. 1.5 Figma Prototype Development.

2. Wireframe Organisation & Planning

We focused on restructuring and planning improvements across all pages to ensure consistency and clarity.

Key actions:

Planned and prioritised changes for each page
Reorganised the overall structure of the app’s wireframes
Assigned tasks clearly within the team to ensure efficient progress
Identified key areas that required further refinement

Fig. 1.6 Wireframe Organisation Plans.

3. User Testing Preparation

We began preparing for the next phase of the project by developing user testing interview questions.

Focus areas:

Understanding user experience with the current prototype
Identifying usability issues in navigation and flow
Gathering feedback on the Study Buddy matching concept

Fig. 1.7 Interview Questions (First Attempt).

Week 3 focused on self-management and major design progression despite the lack of supervisor feedback. We successfully transitioned to high-fidelity prototypes, restructured the wireframes, and improved the overall user flow. Additionally, we strengthened our planning and preparation for upcoming user testing, ensuring the project remains on track.

Week 4

Items Discussed with Supervisor

In Week 4, we consulted with Ms Noranis and presented our latest progress, including updated wireframes, MVP and USP direction, and our drafted user testing interview questions. We also discussed how our core features could be further strengthened and differentiated.

Our Actions

1. User Testing Preparation

We refined and structured our user testing interview questions to better evaluate usability, clarity, and overall experience.

Key improvements:

Developed a clear testing script (introduction, task-based testing, and closing)
Designed task-based scenarios:
- Sign up and profile setup
- Find a study buddy
- Join a study session
Identified observation points such as:
- User understanding of flow and features
- Clarity of AI matching questions
- Interaction with study room tools (timer, whiteboard, music)
Included post-task discussions and structured questions to gather deeper insights on usability, motivation, and improvements

Fig. 1.7 Interview Questions (Final).

Click HERE to read more.

2. High-Fidelity Wireframe Improvements

We continued refining the high-fidelity prototype to improve usability and visual consistency.

Key updates:

Adjusted overall UI layout and structure
Improved clarity of navigation and feature hierarchy
Enhanced onboarding and sign-up flow with better visual feedback
Ensured consistency across different pages

Fig. 1.8 Hi-fi Prototype Improvemnent Development.

3. Animation & Interaction Design

We experimented with animations to enhance user engagement while maintaining usability.

Key explorations:

Text animations during sign-up process
Gradient transitions and background motion
Logo transition on landing page
Subtle animations for onboarding screens

These animations were designed to create a more engaging and dynamic user experience without distracting from core functionality.

Fig. 1.9 Animation Components.

4. User Flow Development

We constructed an updated user flow chart to reflect the refined structure of the app.

Key focus:

Clearer mapping of user journey from onboarding to study session
Better alignment between MVP flow and USP features
Improved logical flow between key pages and interactions

Fig. 1.10 User Flow Chart (First Attempt).

Week 4 focused on strengthening our USP and preparing for user testing. Based on feedback, we shifted our attention towards enhancing the group study experience while continuing to refine our high-fidelity prototype. At the same time, we developed structured user testing methods to gather meaningful insights, ensuring the next phase of the project is both user-driven and well-informed.

Week 5

Items Discussed with Supervisor

In Week 5, we presented our user testing results, updated high-fidelity prototype, and improvements made to the user flow and USP features. We discussed key usability issues identified during testing and how these insights could guide further refinements.

Our Actions

1. User Flow & UX Improvements

Based on testing insights, we refined the overall user experience to improve clarity and efficiency.

Key improvements:

Simplified onboarding steps to reduce confusion
Improved visibility of main CTA (Find a Study Buddy)
Enhanced navigation flow between Home, Matching, and Study Room
Reduced unnecessary elements that distracted from core tasks

Fig. 1.11 Home Page Development.

2. USP Feature Enhancement (Study Room & Group Experience)

We focused on strengthening our Unique Selling Point—the interactive study environment.

Key updates:

Improved layout and hierarchy of Study Room features
Made tools like timer, whiteboard, and music more noticeable and intuitive
Enhanced the sense of buddy presence and interaction
Refined group and chat experience to better support collaborative studying

Fig. 1.12 Study Page Development.

3. Visual & Interaction Refinement

We continued polishing the overall look and feel of the app.

Key updates:

Improved consistency in UI design and typography
Refined animations for smoother transitions
Enhanced micro-interactions to provide better feedback during user actions

Fig. 1.13 Adobe Illustrator Work Progress.

Fig. 1.14 Nav Bar Redesign.

Fig. 1.15 Figma Development.

Week 5 focused on user testing analysis and iterative improvement. By evaluating real user feedback, we identified key usability issues and refined both the user flow and core features. We also strengthened our USP by enhancing the Study Room experience, ensuring the app is more intuitive, engaging, and aligned with user needs.

Week 6

Items Discussed with Supervisor

In Week 6, we presented our latest animations and updated Figma prototype to Mr Razif and Mr Ronald. We also shared our presentation slides for feedback, focusing on both design quality and content structure.

Our Actions

1. Presentation Development

We worked on completing and refining our final presentation materials.

Key progress:

Completed Canva presentation slides
Structured content into:
- Final Product Showcase
- Problem & Solution
- Target Users
- MVP Features & User Flow
- Design Process & Iterations
- Technical & Creative Highlights
- User Value
- Reflection & Future Development
Prepared and finalised the presentation script
Updated project management documentation

Fig. 1.16 Slides Development.

2. Wireframe & UI Refinement

We made final adjustments to improve clarity, usability, and consistency across the app.

Fig. 1.17 Home Page Development.

Home Page Improvements:

Highlighted “Find Study Buddy” as the main CTA using gradient emphasis
Added shortcuts to key features (buddies, timer, AI chat/Edi)
Simplified the AI matching flow for better usability

Fig. 1.18 Study Page Development.

Study Page Improvements:

Separated Study Timer and Group/Buddies into different tabs
Added key features:
- Whiteboard
- End session function
- AI-generated study summary
Improved layout consistency and feature organisation

3. Prototype, Graphics & Animation Enhancement

We further refined the prototype and enhanced visual interactions.

Key developments:

Improved overall design consistency and usability in Figma prototype
Integrated animations and micro-interactions into key flows
Developed high-value feature concepts:
- AI Chat Page (“Keep Chatting” feature)
- Study Room Page (“Play with Spotify” feature)
Designed Edi (AI assistant) expressions to create a more engaging experience

Fig. 1.19 Graphics Enhancement.

Fig. 1.20 Visuals Enhancement.

Fig. 1.21 Prototypes Enhancement.

4. Monetisation & Feature Exploration

We explored potential business strategies to enhance user value.

Key ideas:

Introduced premium plans and micro-transactions
Proposed Spotify add-on feature (RM5) to enhance study experience
Considered reward-based systems (e.g. redeemable vouchers) to improve engagement and retention
Linked design decisions to business value (ARPU & retention strategy)

Fig. 1.22 Chat (AI mode) Page Development.

Fig. 1.23 Play with Spotify Feature.

Week 6 focused on final refinements and presentation preparation. With strong feedback on our design quality, we shifted our attention to improving research justification, user value, and overall consistency. We enhanced both the prototype and presentation, ensuring that our design decisions are not only visually strong but also strategically and conceptually grounded.

Week 7

Items Discussed with Supervisor

In Week 7, we conducted our final presentation in class and received final feedback on our presentation slides from Mr Ronald. The session focused on validating our design decisions and strengthening the justification behind our core concept.

Our Actions

1. Presentation Refinement

We made final improvements to our presentation slides to strengthen clarity and credibility.

Key updates:

Added off-camera study room concept as a key solution in EduBuddy
Included research references to support the effectiveness of avatar-based / non-video study environments
Improved explanation of how this approach supports focus and accountability

Fig. 1.24 Slides Content Refinement.

2. Walkthrough Video Production

We created and refined walkthrough videos to showcase the app experience clearly.

Key process:

Screen-recorded smooth navigation of each user flow
Organised flows with visual cover screens
Trimmed unnecessary sections for better clarity
Recorded and adjusted voiceover with background audio

We also uploaded the videos to YouTube and Google Drive for accessibility and sharing.

Fig. 1.25 Walkthrough Video Editing.

3. Final Prototype & User Flow Completion

We finalised our high-fidelity prototype and ensured all flows were complete and functional.

Key outcomes:

Completed hi-fi prototype with animations in Figma
Updated and refined the user flow chart to reflect the final structure
Ensured consistency across all screens and interactions

Fig. 1.26 Final Flows.

4. Final User Testing

We conducted a final round of user testing to validate our design.

Key findings:

Edi (AI assistant) improved engagement and reduced the “serious” academic feel
The all-in-one study environment (music + timer + whiteboard) reduced distractions from app-switching
AI-generated summaries were seen as highly valuable and practical by users

Fig. 1.27 Final Stage of User Testing.

Click HERE to read more.

5. Documentation & Content Creation

We completed final documentation and prepared deliverables for submission and showcase.

Key outputs:

Finalised blog content for Major Project 2
Prepared content for KreatifBeats website showcase
Compiled all working files (After Effects, Illustrator, Figma) into a structured Google Drive folder

Fig. 1.28 Kreatif Beats Content Creation.

Click HERE to read more.

Week 7 marked the finalisation and presentation stage of the project. We refined our presentation with stronger research support, completed our prototype and documentation, and validated our design through final user testing. Overall, we ensured that EduBuddy is not only visually engaging but also conceptually grounded and user-focused.

Final Submissions

1. Project Managment Doc: Link

2. Project Execution: Link

3. Project Presentation: Link

4. Final Project - Walkthrough Videos: Link

Project Presentation

Fig. 1.29 Group 41 EduBuddy by Yan Zhi Xuan & Lim Yu Xuen

Final Outcome - Full Walkthrough Video

Fig. 1.30 Full Walkthrough Video with Explanation.

Final Outcome - Hi-fi Prototypes with Animations

Fig. 1.31 Prototypes in Figma.

5. FEEDBACK ⊹ ࣪ ˖₊˚⋆˙⟡

Week 1

Mr Razif: Focus on our main feature, which is the Study Buddies function. The MVP (Minimum Viable Product) needs to be adjusted to better align with the main feature. Customisation features should be considered secondary, prioritising the core objective is more important.

Week 2

Mr Razif: The animation quality is good, a strong attempt at producing animation using After Effects. The chosen colour palette and typography are appropriate and consistent. Continue refining and improving the overall user flow.

Week 3

No feedback was received this week due to the Chinese New Year holiday.

Week 4

Mr Razif: USP (Unique Selling Point) should be our groups and chat page where there are features like characters, rooms, music, whiteboard. This stood out the most and we should focus on further improving it from here. Onboarding and registration is very straightforward, but time to focus on the USP. Could think of expanding it to the desktop version for study session calls like the recommended website sent in teams chat. Figure out what to look for in interviewee answers.

Week 5

Mr Razif: Focus on expanding the study page, including the features we mentioned. MVP can just end at joining a study session as that’s the main priority of our app (don’t make it too long). On the study page we could include status to help differentiate if your study buddies are studying now or offline. The cyan colour and blue text contrast could be better.

Week 6

Mr Razif: Grayscale users who are offline in group previews. Make sure the graphics and elements in each page are consistent (like boxes, gradients, corner radius…)

Mr Ronald:

Aesthetics and design overall is above expectations.
Need to improve on research as there's no references in our slides.
Wants to know why we decided on the room design in our study page instead of video calling, need to know if that’s is based on research it works for our users (study buddy itself is because of body doubling).
Monetization is not benefiting the users, it's just ads that can be targeted towards students. But it could be adjusted to study for 60 mins, and receive a free starbucks voucher. Redeem coins for vouchers?
Flow should be in 2, New users and Returning users. New users focus on the onboarding process, returning is why users would return to our app?
Include references in slides.
UI feedback: dropdown menu on onboarding to work, include timer in homepage under ui/ux button, face expression changes on edi for study page (smile, wow, start to sweat).
Buttons don't have to look like buttons.

Week 7

Mr Ronald:

Should have references on “off-camera” method replacing video calls.
Does the above method help students just as much as video calls help students stay accountable and motivated?

3. REFLECTIONS /ᐠ - ˕ •マ

Search This Blog

Yan Zhi Xuan (0369425)