CLASSMATES APP

IMPROVING THE SOCIAL EXPERIENCE OF UNIVERSITY STUDENTS THROUGH A MOBILE APP

PROTOTYPING
UX DESIGN
ILLUSTRATION
GRAPHIC DESIGN
APP DESIGN
UI DESIGN

While University is supposed to be a place for learning and education, it is also supposed to be one for socialising. However, guerrilla research into the perceptions of students at Murdoch University has brought to light the fact that many students seem to find it difficult to connect with other students from their classes. This project aimed to change that through a mobile app designed for students.

It was through interviewing students that this social problem was discovered, and through observation of students’ interactions in classes over a few years, these findings were supported, and the prevalence of this issue made clear (as the majority of those interviewed noted this as being a problem). In order to address this issue and improve the interactions between students (especially those in the same classes), an app was to be created. This app needed to be easy to use, and actively facilitate online and in-person social interaction between classmates, and thus improve their social experience at university.

After defining the problem and clarifying who the app was being designed for in the research stage, a solution to the problem needed to be devised. This required the creation of a system map, from which the basic structure of the app was determined. The system map involved plotting the key interaction points for users in a visual flowchart in order to identify the overarching pathways users could take within the app.

A kano model was then used to ascertain how beneficial the proposed app features would be for users. Doing so highlighted the critical features and which features were unimportant or even undesirable. While all the proposed app features were included in the ClassMates app, this process revealed that the inclusion of certain features (like audio calls and video calls) was not of huge importance, allowing more time to be spent on designing the highly desirable features (like study groups, direct messaging and class forums).

Building from the system map and findings from the kano model, 3 taskflows were developed: logging in, messaging, and interacting with classes. Each of these taskflows mapped the critical pathways of users, indicating where there were decision points and what sort of decision needed to be made. This formed the basis for the navigation in the app and allowed a smooth transition into the next stage: wireframing.

The taskflows were adapted into wireflows to illustrate the screens users would be presented with in each of the pathways. This required the creation of wireframes which took the basic navigation determined from the taskflows and refined this into a logical and interactive user interface. Doing so allowed the real-life experience of using the app to be simulated without having to invest time and money into building it first.

The wireframes were used to create a low-fidelity prototype which was used with a small sample of users to test the early app design. This testing involved users completing a series of tasks using the think aloud prototcol, which revealed users’ thought processes, allowing any problems with the app’s design to be identified early, and avoiding having to go back and make fundamental changes at the later stages of development.

The results from the user testing were analysed and compiled into a Usability Testing Report which uncovered what aspects of the app worked well, and which did not. Through a task analysis, it became clear that users found creating new direct messages to be a confusing task. As a result the UI was redesigned in this area of the app to provide a smoother experience for users.

After user testing and iteration, various aspects of the app were changed and improved. These changes were only found to be needed through user testing but were highly important to providing users with the best experience possible.

Graphic of a hand holding a phone.Graphic of two people texting over the phone from separate locations.Graphic of a person texting with various emojis and symbols around them.Graphic of a person using their phone to scan something on another person's phone.Graphic of a phone with emojis, symbols, text bubbles and comments floating above it.Graphic of 3 people sitting around a table, studying.
GRAPHICS CREATED FOR THE APP

To create the final high-fidelity prototype for the ClassMates app, a number of images were needed throughout the app. These had to be conceptualised and designed in a way that clearly communicated the idea, adhered to an art style which fit with the fun aesthetic of the ClassMates of the app, and appealed to the target audience. The above gallery shows a few of the images created for the app.

CORE FEATURES

This process resulted in the creation of the ClassMates app. The final design of the ClassMates app includes a variety of features that allow students to get to know their classmates better and more easily connect with them.