resume
all projects

2023Gamification, AR

JoboGo

A mobile game application that uses augmented reality and geolocation technology to create playful interactions in the real-life metaverse, helping young people discover their career paths through engaging, location-based challenges.

Published on Jan 2023, updated on 10th Aug 2024

JoboGo AR career game screens
Role
Lead UX Researcher & UI/UX Designer - Conducted participatory design, user research, prototyping, and usability testing
Duration
Multi-phase study with 7 co-design sessions, 12 participants, 3 prototype iterations
Tools
Figma, MAXQDA, Miro, AR frameworks, Mobile GPS, Machine Learning algorithms
Methods
Interviews, observations, usability testing, expert reviews, cognitive walkthroughs, co-design
12
participants aged 19-35
7
co-design sessions
3
prototype iterations
overview

Overview

In today’s rapidly evolving job market, many young people struggle to find careers aligned with their interests. This research addresses critical gaps in career exploration through innovative technology.

research

Research questions & user personas

User personas: through research with 12 participants aged 19-35, we identified key personas representing our target users.
process

Design process & methodology

  1. Sessions 1-2: Pre-study phase

    Participants: P1-P4 (4 HCI students). Methods: Semi-structured interviews, idea generation. Duration: 1-2 hours each. Outcome: Identified user needs, attitudes toward games/jobs, initial concept development.

  2. Sessions 3-5: V1.0 appropriation

    Participants: P1-P4. Methods: Usability testing, observation, interviews. Prototype: Campus-specific GPS questions. Outcome: Feedback on visual design, real-world interaction, identified need for location flexibility.

  3. Session 6: First evaluation

    Participants: P5-P9 (Fresh perspectives). Methods: Usability testing, think-aloud protocol. Key finding: 800+ meters is uncomfortable for users - reduced to 500m maximum.

  4. Session 7: V2.0 mid-appropriation

    Participants: P10-P11. Methods: Usability testing, cognitive walkthrough. Major changes: Added 6 career genres, AR integration, social features, gamification elements.

Concept evolution: designing playful interactions for the real-life metaverse
Wireframe development: load, welcome, profile, dashboard, account and wallet pages
Wireframe development: games center, challenge, game genres and game pages
ui design

UI design & visual system

Designed in Figma with dark green as primary color representing growth, new beginnings, and abundance. Color-coded career categories for easy navigation.

UI design & visual system: on-boarding, challenge, dashboard, game center, game genres and AR mode
Registration & profile setup: Google/Apple login, sign up, recovery, profile creation, PIN/fingerprint setup
Dashboard & navigation: Super Mario-inspired loading, main dashboard with all features, notification/accessibility/security pages
game genres

Game genres: career categories

Based on Nebraska Career Education Model - 6 color-coded career fields:

  • Engineering

    Color: Green. Energy, Manufacturing, Architecture, Transportation

  • Health Service

    Color: Pink. Biotechnology, Diagnostics, Health Informatics, Therapeutic Services

  • Business Management

    Color: Brown. Marketing, Hospitality, Administration, Finance

  • Human Services

    Color: Red. Government, Law, Education, Public Safety

  • Natural Resources & Agriculture

    Color: Blue. Agribusiness, Animal Systems, Environmental Resources, Food Processing

  • Arts & Communication

    Color: Purple. Audio/Video, Graphic Design, Broadcasting, Performing Arts, IT

Game genres selection screen: 6 color-coded career category cards with descriptions
Health Service category gameplay: Hospital location finding → Health-related questions → AR card discovery
features

Key features & functionality

  • AR location discovery

    Use phone camera to find virtual question cards placed in real-world locations within 500m radius

  • Geolocation technology

    GPS identifies relevant industry locations (hospitals, studios, offices) and generates contextual questions

  • Time-based scoring

    Points awarded based on discovery speed, accuracy, and independence (max points for no-help completion)

  • Gamification system

    Daily challenges, friend competitions, leaderboards (global/regional/personal), achievement badges

Leaderboard & social features: Global, Regional, Personal levels with messaging functionality
Challenge system: Daily missions (High: 40pts, Mid: 20pts, Low: 10pts) + Friend challenges (60pts)
findings

Research findings & impact

  • Location flexibility

    Removed fixed location selection - users now find questions anywhere, making game accessible globally

  • AR enhancement

    Camera-based AR card finding increased engagement and “game feel” significantly

  • Social motivation

    Friend challenges and leaderboards drove sustained engagement and competition

  • Visual feedback

    Spider diagrams effectively communicated strengths; users requested more detailed analytics

  • Onboarding critical

    6-page tutorial reduced confusion and increased feature discovery

outcomes

Participatory design outcomes

  • Co-design with HCI students

    Ensured technical feasibility and game design best practices

  • Industry expert input

    Validated question relevance and realism across all 6 career fields

  • Iterative testing with fresh participants (P5-P9)

    Provided unbiased feedback each phase

  • Living Lab approach

    Captured authentic usage scenarios and environmental factors

Video presentation of JoboGo