Remote Plus
a mobile app to help students manage course schedules and access the online classrooms
This project was designed for the University of Toronto Students. My group chose a prompt supported by UofT’s Innovation Hub to “develop a digital solution to improve the pre-class learning experience and facilitate a sense of belonging despite studying remote.
Clients
UofT’s Innovation Hub
Section
UofT Students Remote and Pre-class learning experience
Platform
Desktop, Tablet, Mobile
Role
-
Identified users' problems
-
Conducted usability research
-
Designed, and built prototypes
-
Performed usability testing and identify improvements
Skills Developed
-
Prototyping via Figma
-
Visual Design
-
Animation Production
-
Video Editing
-
Data Analysis
Methodologies
User research, affinity diagram, persona, empathy map, as-is scenario, needs statement, big ideas, prioritization grid, to-be scenario, hills, heuristic evaluation, and usability test
User Research
We conducted surveys, interviews and online research to reveal the problem areas of our targeted audiences - University of Toronto students who are taking remote classes. We recruited 37 participants to survey and 11 to interview. Pre-screening criteria are set to pre-filter results.
Based on the interview result, we found that:
65%
Students believed they lacked a learning environment during remote learning.
62%
Students have difficulties managing class schedules with existing tools.
32%
Students found that it was hard to access the online classrooms.
From the 11 participants interviewed, we created an affinity diagram to gather key insights and summarize three main issues:
-
Overwhelming ways to find course channels, including Quercus announcement, UTmail+, syllabus, slake, discord.
-
Varying choices of scheduling tools range from Acorn, Quercus, physical calendars, notebooks, planning apps.
-
Fixed schedule mismatches real schedules in real life.
Research Analysis
We then conducted a research analysis sprint to develop our user empathy journey map.
Persona
Based on the survey and interview results, we summarized participants' identities and made them into a representative persona, Sandy Lopez.
Empathy Map
we summarized participants' words, behaviours, thoughts and feelings into an empathy map.
As-is Scenario
We described Sandy's journey to access a remote course using existing processes (e.g., through Quercus, Acorn, and other UofT's online teaching platforms).
Needs Statements
Finally, we concluded 5 Sandy's needs
Ideation
We then conducted an ideation phase sprint to brainstorm 12 solutions and narrow our focus to the 4 most important components.
Some of the many concepts we considered in the final design were: a productivity tool across synchronized devices that provides all functions from school accounts; a smart timetable that enables users to access the virtual classroom within a click; a pre-class metaverse that provides chatrooms and games to increase interaction between users; a virtual personal manager that pushes all schedule changes to users in time.
To-be Scenario
We envisioned Sandy's future journey of accessing remote classes if these top concepts were to be implemented and concluded on the following to-be scenario.
Prototypes
After selecting our concept and direction, we began the prototype phase. We kicked off this sprint sketching possible ways that the product could flow. After pitching our ideas to each other and dot voting on the best components, we began wire-framing and rapid prototyping different options. Over the following week, the low-fidelity prototype came together.
After a sprint of usability testing, we made a couple of changes to the process of onboarding, joining meetings, and waiting room, and created a mid-fidelity prototype. Some of the mid-fidelity screens are shown as follows. To view the complete clickable mid-fidelity prototype, please click
Evaluation
When our mid-fidelity prototype was sufficient for testing, we invited four people to test the prototype. First, it provides them with an overview of the project, then gives them several core tasks to complete, and finally asks them their thoughts.
With the user feedback, we were able to modify the interface to address user feedback.
After analyzing both quantitative and qualitative insights, we concluded 4 major feature changes:
-
tutorials to guide new users
-
calendar time indicators to clarify displayed time for out-of-province users
-
more gamified and socialized party lounges
-
customizable reminder.
Lessons Learned
I've learned the fundamentals of UX Research and Design from three aspects: research, design, and evaluation, and I'm able to handle a series of methods and tools, including interviews, questionnaires, secondary research, affinity diagrams, personas, empathy maps, as-is scenario, requirements analysis, to-be scenarios, sketching, prototyping toolkits (Figma), sequential storyboards, heuristic inspections, usability testing, and lean validation. Despite the above methodologies and skills, I've learned a lot, and I'll be sharing those insights, lessons, and things I wish I'd done differently.
-
The situation we've met is that we've built a great feature that deals with a real problem that we know our users have. They were not using it through or skipping it, probably because they didn't know what it did. I learned that it's necessary to make the labels and buttons clear and provide tutorials or help text.
-
I was likely to miss a few pages or functions and forget how the screens fit together as I sketched for the prototype. Then I realized that I need to create a user flow before wireframing next time since it can maintain the system structure as the screens and objects grow.
-
I would have never gotten to that point if I didn't hear that the waiting room was dull or that the colour palette of slides was ambiguous. Don't be frustrated by constructive advice since trial and error are the only way to get better. Carefully consider what the experts and stakeholders have said, try to make some changes and come back strong the next sprint
-
Fortunately, we created a shared document to manage tasks and develop timelines before the project started. It made receiving writing works from a teammate and handing off videos and visual designs to the next person effortless. Thus, a good handoff and project management are critical.