The design problem
How services, provided for students, can be used more effectively?
Case brief
The academy provides students with access to multiple systems and web applications, required for supporting learning activities. It also organises events for students and offers many facilities. Sometimes students have a hard time navigating through multiple platforms and applications, as all provided information located in different sources. Regular practice of keeping track of assignments hand-in dates, checking timetables and lecture materials becoming a hassle.
Target audience: current and future students.
Tasks
- Conduct user research and explore the user pain-points;
- Usability heuristics evaluation;
- Build a working prototype for a mobile app with implemented findings.
Challenges
- Provide easy access for most important information necessary for the study process;
- Create a positive experience and motivate students to complete their assignments in an engaging manner.
Users
To avoid jumping from assumptions straight to ideation, I conducted a survey followed by an interview and usability heuristics.
User research
- Survey and interviews conducted among academy students;
- Usability heuristics.
Insights
- In order to keep track of their assignments, students write down hand-in dates and list of their assignments. Some of them memorise those by heart.
- The current learning platform for students is cluttered and contains too much information. Without having clear navigation and search, it is quite difficult to make most of it. “Too much info in there to get anything useful” states one of the responses in the survey.
Personas
Two user personas were created for this project. Primary persona – current student, and a secondary persona is a future student.
One of the main user stories
As a student I want to check my timetable, so I know what will be my classes. I want to know my classes for current day, for current week and for current month.
Example user scenario
Design process
My work on this project was influenced by the design-thinking process consisting of 6 main stages: empathise, define, ideate, prototype, test, and implement. Following this approach helped me to understand the user needs better and provide them with solutions, that they truly want.
Quickly moving from app sketches to low fidelity wireframes and clickable prototype helped to test interactions and user flow.
Build, measure, learn
Low fidelity wireframes were converted to clickable prototype and loaded to Marvel app platform (https://marvelapp.com/29fhe57). Sharing the clickable prototype with fellow students allowed me to test the app as early as possible and receive instant feedback.
Emotional design
The power of personality
Digital products not necessary should be “boring”, like humans they also can have character and personality. In order to improve user experience of developing product, I created design persona (A. Walter, Personality in design 2011) of the app.
Overview of the app personality
This app has enthusiastic, friendly and motivating personality. Using this app should feel like having a classmate (or a friend) who makes life complete and optimistic, because app is designed to create positive emotions.
Tone of voice
This application is always friendly and full of energy. It motivates students to accomplish their assignments on time and do not let miss anything important. It keeps you on toes, yet not making it monotonous. It helps students to be more organised, without making them feeling bored.
General messages for different occasions:
- Hello Emils! Nothing crazy important, just wanted to tell you that you are doing great.
- Aww Snap! You need to hurry up and get back on track.
- Hey! It’s time for a break.
- Hey! It’s weekend and we need to relax.
- Hey! You were great yesterday and I know you will be great today.
If we stop thinking of the interfaces we design as dumb control panels, and think of them as the people our target audience wants to interact with, we can craft emotionally engaging experiences that make a lasting impression.
Design solution
Engaging UX patterns
- Appeal of completeness and desire for order;
- Rewards.
Using infographic elements, showing incompleteness or disorder and providing an easy way to resolve it. Copy example: “You completed 3 of your 5 assignments”. Usually, infographics used in this pattern are based on our bias to see continuous forms and whole objects, automatically adding missing parts.
App is encouraging users or telling them they have time for a break. Copy example: “You are in time.”, “It’s weekend and we need to relax.”, “You were great yesterday and I know you will be great today.”
Timely updates
Instant notifications, in case if any changes occur.
UX Makeover
Assignments view before and after.
Rest of the main views
Outcome
- Based on insights discovered during user research and usability testing of existing services, I was able to come up with a prototype of the suggested solution. The core functionality of the created solution, together with feedback from the prototype, was implemented in a hybrid mobile app project for my AP degree. However, some of the planned features were not implemented fully because of my limited knowledge of the Angular framework.
- Combining all necessary information supporting learning activities in one place will allow easy access to it and bring value to students. Implementing engaging UX patterns will motivate students to accomplish their assignments and create positive experience.
Source code
Project source code of created hybrid app can be found on GitHub.
