MoBeGo - Emberex

Selected Case Studies

mobego heromobego hero

Product
Highly interactive behavior-based self-monitoring and scoring web app that aids in data-based decision making.

Project Roles
Visual Design, UI & UX Implementation,
Illustration, Development,
Quality Assurance

THE CHALLENGE
The MoBeGo teams at the University of Iowa and Vanderbilt University partnered with Emberex to modernize and enhance their existing app. While several contemporary updates were necessary, the primary challenges stemmed from key limitations of the original app: it allowed monitoring of only one student at a time, was restricted to a single device—requiring constant teacher-student handoffs—and was designed exclusively for iPad use. The team needed a complete transformation: a multi-user, multi-device, multi-platform solution combined with a design overhaul that included engaging features like student avatars and gamification elements.

THE PROCESS
The MoBeGo project began with extensive discovery work, during which we helped the team identify the features required in their new app, the type of app best suited to their needs (native, web app, or PWA), and features that could be considered for future versions. For budgetary reasons, we initially approached this as a design-only project to present stakeholders with a clear vision for the future of the intervention. At Emberex, we have a strong track record of helping partner researchers secure additional funding once decision-makers see a well-defined design plan. Shortly after the designs were finalized, we received approval to proceed with development.

avatar selection slide

AVATARS ANYONE?

Anyone building an app for young people— or anyone who’s interacted with young people—knows they want avatars! We leveraged an open-source library called Kyute to create a diverse range of characters for students and teachers to choose from. Additionally, we added custom functionality to allow users to personalize their avatar’s skin tone.

example avatars
MOBEGO-interactice-student-expMOBEGO-interactice-student-exp

FUN AND INTERACTIVE STUDENT EXPERIENCE
At Emberex, most of our work is for students, but we don’t always get the opportunity to design apps with students as the primary users. This project gave us that chance. The student user experience is intentionally simple: log in and wait until it’s time to score yourself. We provided users with a sleek dashboard where they can track the behaviors they are working on, view their recent scores, and see the badges they’ve earned. The scoring experience is colorful and straightforward, offering quick feedback from teachers through emojis and badges. By integrating emojis, badges, and the ability to create avatars, the app becomes highly engaging for its young users, increasing their likelihood of behavioral success.

admin dashboard screen

ADMINISTRATION

An app wouldn’t be complete without an administrative component. We designed intuitive and visually appealing screens for administrators, enabling them to efficiently add school districts, schools, teachers, and student users. As always, providing researchers with insights into app usage and progress is essential. To meet this need, we implemented a sleek and easy-to-interpret dashboard that allows super-admin users to view data at any level.

other admin screens

THE RESULTS
MoBeGo now features a visually appealing, easy-to-use, interactive progressive web app that enables teachers and students to collaborate effectively to improve school life.

TECHNOLOGY
Node.js, React, PostgreSQL, SocketIO