Reference: Cake Resume and Avatar Persona


Entry Point: Profile

Intro Page

Intro Page


Focus State


Focus State

Question Mode

Result Page

Result Page: Share

Result Page with Mentors recommendation

Mobile Version

FlashCampus: Quiz

Type:

Freelance Project

Year:

2024-2025

Team:

Project

Stacks:

Figma, Linear, Docs

Roles:

UI/UX Designer

Skills:

Gamification Design, Illustration, Human Centric Design, Cross-Team Collaboration,

FlashCampus is a platform for students in Indonesia where they can find internships or other academic opportunities and connect with mentors or seniors to help them secure these opportunities.

Background

FlashCampus is launching an engaging and shareable interactive quiz to help students identify the most suitable country, region, or role for their participation in MBKM (Freedom to Learn – Independent Campus) programs—specifically IISMA (Indonesian International Student Mobility Awards) and MSIB (Certified Internship and Independent Study Program). MBKM is a national initiative by the Indonesian Ministry of Education that encourages students to gain real-world experience through international exchange, internships, and project-based learning.

Through a series of personalized questions, the quiz helps students explore destinations and roles that align with their academic background, skills, and future goals. Whether aiming to study abroad through IISMA or join an industry-leading internship via MSIB, the quiz guides students in selecting the best-fit country or region for their MBKM journey.

Each result includes a personalized call-to-action, encouraging students to connect with mentors who can support them through the preparation and application process. This initiative strengthens FlashCampus’ role as the go-to platform for MBKM guidance, mentorship, and success.

Scroll for more

Problem Statement

  • 🌍 Difficulty in choosing the right path
    Students often struggle to identify which country, region, or role is the best fit for their academic goals and personal aspirations within MBKM programs like IISMA and MSIB—leading to hesitation or misaligned choices.

  • 🤝 Limited access to experienced mentors
    Many students don’t know where to find or how to connect with MBKM alumni or mentors, resulting in a lack of guidance, reduced confidence, and avoidable mistakes during the application or preparation process.

  • 📉 Low awareness and engagement with FlashCampus
    Despite offering valuable support and mentoring services, FlashCampus is still relatively unknown among students, and its current tools lack the interactivity and virality needed to capture attention and drive consistent platform engagement.

Precedent Study

We draw inspiration from two strong precedents: CakeResume’s gamified career quiz, which uses fun, personality-based questions to match users—mainly students and young professionals—with ideal career paths and encourages them to explore job opportunities or build resumes; and MasterYourElement.com’s quiz, a fun games which helps users identify their core personality “fictional element” (like Fire, Water, etc.) to better understand their strengths using emotionally engaging language and minimalist visuals. From these two, FlashCampus can adopt:

  • Targeted user journey – guiding students based on interests, goals, and experiences

  • Personality/interest-based questions – making the quiz relatable and reflective

  • Personalized, archetype-style results – offering memorable country/role matches

  • Clean, mobile-friendly design – ensuring smooth UX across all devices

  • Engaging visual identity – using colors, symbols, and playful layouts

  • Emotionally resonant copy – speaking directly to students’ aspirations

  • Built-in calls-to-action – encouraging users to sign up or connect with mentors

  • High shareability – designing results that users want to post on social media

  • Replay value – making it fun enough to retake or share with friends

Design Solution

Entry Point

The quiz entry point is from the Profile Page, since the whole purpose of the quiz is related to the user's profile. We make the banner as the most prominent element with high contrast background, as this function needs to attract a lot of enggagement.

Intro Page

Positioned within a warm, inviting orange card layout, the screen features a playful collage-style image, a brief description of the quiz’s purpose, and a prominent "Start Quiz" button. A progress bar at the top displays the user's position out of 12 questions, indicating an interactive experience. The clean layout and subtle global-themed background emphasize its international focus, making it clear, engaging, and easy to navigate.

Question Page

In Question Mode, users are presented with a scenario-based question and two clearly labeled answer choices styled as button-like cards. A progress bar at the top, along with a counter, informs users of their position in the quiz, adding a sense of pacing and progress. The layout is centered and minimal, with a warm orange gradient card that draws focus to the content without distractions. Once an answer is selected, the interface shifts to the Focus State, visually confirming the user’s selection. The selected option is highlighted in outlined to show changes from white background. After few miliseconds, the next question will appear.

Design Solution

Result Page

The result page consists of the user's archetype, the recommended exchange destination that suits their character and strengths, a short description, and the characteristics with their respective ratings. There are five possible archetypes: Trailblazer (North America), Sage (Asia), Artisan (Europe), Voyager (Australia), and Luminary (South America). Each archetype highlights a unique personality type — for example, Trailblazers are action-oriented and curious, while Sages are calm and reflective. The design includes visual cues, such as collage-style imagery representing each region, and tags that summarize key traits. Users are also shown a five-star rating system for five core skills: Creativity, Adaptability, Leadership, Communication, and Teamwork, helping them better understand their strengths in relation to global cultural fits.

Share Result Page

The share result page contains the same information as the results page but is formatted in portrait orientation to fit mobile version and mobile apps platforms like Instagram Stories and Snapchat, which are among the most popular social media channels. It can also be shared on other platforms such as X (formerly Twitter). or Tiktok

Result Page with Mentor Recommendation

This page focuses on the archetype and the matched region, along with three suggested mentors who are aligned with the user's recommended exchange destination. These mentors are selected to help guide the user in developing their skills and exploring opportunities that resonate with their personality and regional fit.

Mobile Version

The mobile version adapts the layout into a vertical, scroll-friendly format optimized for smaller screens. Key elements like the archetype, region, and star ratings are stacked for clarity, with buttons and text resized for easy touch interaction. The design ensures readability, ease of use, and is tailored for portrait orientation.