Case Study
Task Circle - A mobile app to improve student collaboration
SUMMARY
My team won first place in IBM's Design Sprint competition. We designed a mobile app concept to improve the way students collaborate in a remote environment through inclusion and empathy.
PROJECT
Coastal University
MY ROLE
UX Research, UX Design
TIMELINE
5 days
PROJECT TYPE
Team of 6
Client Brief
The Client
Coastal University is a comprehensive post-secondary institution, offering undergraduate degrees in a broad range of disciplines. As a result, they maintain a diverse and vibrant student body.
The Users
International students engaging with the university from their home countries due to the COVID-19 pandemic.
The Request
How might we improve the experience of Coastal University students when collaborating as members of virtual teams?
Challenges and Compromises
One of our main challenges was the lack of resources and time. As with most design sprints, we were stretched quite thin! Our team was also situated across different time zones and many of us had never met or collaborated with one another before. With these challenges, we needed to build relationships fast, set rules for formal and informal communication and move quickly without sacrificing quality.
Research Methods
Secondary research
Interviews
Competitive research
Usability studies
Discovering the Problem Space
68%
of post-secondary students had never experienced online learning prior to the pandemic.
57%
of post-secondary students reported
that their courses were delayed, postponed or cancelled.
Source: Statistics Canada
What about International Students?
Fewer opportunities to practice English and observe Canadian classmates when studying remotely.
Experience a greater challenge reaching out for help when class material or assignments are unclear.
Source: Latitudes: Teaching International Students Remotely
Defining our Team Goal
After conducting secondary research, our team decided to define what our ultimate goal was in order to align our focus going into the week.
Our goal is to provide international students with a seamless and collaborative remote education experience, that inclusively understands their needs in order to communicate confidently with their peers.
Starting with Questions...
In order to understand the international student persona, we conducted interviews and focused on the following key areas.
What are the challenges or barriers international students experience when collaborating remotely?
What tools and resources do international students use to support classroom collaboration?
What is important for a great app experience?
How are international students interacting with their smartphones to support their education?
Insights from User Interviews
We spoke with 7 international students studying remotely from their home countries to learn more about their common pain points, goals and motivations. In hindsight, with more time, we would have ideally interviewed more participants. 3 core themes emerged from the interviews.
More frequent and organized group check-ins
Some of the students' frustrations came from infrequent touchpoints with group members as well as unorganized communication taking place via social media apps.
Greater transparency about challenges
Collaborating from behind a screen can feel isolating to some students and may make it more difficult to ask for help when it's needed.
Desire to feel valued and included
International students want to be valuable team members, contribute fairly to team projects and support their teammates.
Persona Development
Synthesized findings into a persona which helped us stay anchored on the user & formed a great foundation to move into feature ideation.
Exploring HMW Questions
After collectively brainstorming 30+ potential How Might We questions, we dot-voted and selected one that best aligned with our project goals and user needs.
How might we... improve interactions between international students and their classmates so that they can feel more valued and included in their remote team projects?
Competitive Research
Beginning the solution process by gathering inspiration from popular apps and examining the competitive landscape.
We looked at education, productivity, workflow, translation and culture-building apps. Comparing potential competitors, helped us understand what's available and where the opportunities land. Below I've shared examples of a few popular apps we drew inspiration from.
The Making of Task Circle
Next, our team conducted workshop and sketching sessions to map out the user flow, identify key features and sketch out potential concepts to capture the MVP. We then dot-voted and collectively agreed on our favourite elements from each sketch. We defined the following key features:
Master Project Tracker
Show upcoming and completed tasks by team member
Show progress towards assigned tasks
Show visual representation of overall project completion
Communication Board
- Include team board to communicate important project information and announcements
Team Check-Ins
- Offer group check-in feature where team members can communicate their challenges
- Team members can also share how they need support
Brand Guidelines
The visual design was developed leveraging Coastal University's brand colour palette and typographic style. We also needed to ensure our solution was accessible to the widest audience; thus must be WCAG AA Compliant.
Primary Typeface
Aa Zz
Avenir
Primary #36285D
Secondary #23BE36
White #FFFFFF
Black #3A3A3A
User Testing & Final Designs
Mid-Fidelity prototype established a realistic experience to encourage more useful user feedback.
In under 12 hours, our team took the initial sketches and designed a mid-fidelity prototype to take to user testing. We tested the navigation structure, the completion of certain tasks, the time users needed to complete certain tasks and overall flow efficiency. Below I've summarized some learnings and changes that were made between versions 1 and 2 on the 'Teams' page.
Problem
Users experienced difficulty locating the Toggle and were unsure what the 'Team Updates' label meant
Solution
Toggle changed to tabs which are easier to locate and 'Team Updates' label changed to 'Team'
Problem
Users had difficulty locating the 'Update your team' button and were unsure what would happen once selected
Solution
Button moved to the top of the page. User photo and large plus button added within button element to show that your post will be added to the feed below
Problem
Users wanted to see a timestamp, an indication of which posts are urgent and an indication of which posts are unread
Solution
Added filter element, timestamps and 'new' and 'urgent' tags
Version 1
Version 2
Prototype
Test me here ➙
The Presentation to IBM
Our final presentation to the IBM panel went exceptionally well! We received high compliments on our thoughtful response to the problem space, our excellent use of storytelling and final visual designs.
We were thrilled when we received the news that our solution won first place across Canada. We were so honoured to see our efforts recognized and awarded!
Moving Forward
If there was more time available...
Further development of User Personas and Journey Maps
Gather more research and user testing to refine the final product design
Ensure educational institutions will support our product to validate its viability in the market
Finally, develop, publish and share with the mass market
Learnings
Being intentional with my time
As we only had 5 days to complete the MVP prototype, it was essential to keep the project moving as quickly as possible without sacrificing quality. We did an excellent job by assigning specific goals to reach each day while collaborating both asynchronously and synchronously. We needed to prioritize certain tasks that would provide the greatest value over others, such as optimizing the user flow over spending too much time on the small visual details.
Learning to work fast with a new team
Working with a team of designers I had never collaborated with before under tight time constraints taught me the importance of building relationships fast, and adapting to one another's work styles. Our team did an excellent job communicating with one another, offering each other support, and focusing on the team goals and outcomes right from the start.