Education and UX

Online Learning Solution

As a result of the evolving situation during the COVID-19 Pandemic, the University of Salford needed to find a solution to teach students from the UK over to China due to the inability to travel between the two countries.

As part of this, I based my final major project around researching to find a solution to how lecturers can navigate continuing the course when some students based in the UK campus have returned to China, some have stayed, and UK lecturers are unable to travel to China to teach students based at the campus.

Problem

The hypothetical solution was to rebrand an existing application:  WeChat Work, which is an app aligned with the well known social media application WeChat used widely in China. This solution meant that both professional and personal life could be separated, whilst also having the ability to incorporate all things needed: communication, file sharing and feedback.Whilst this is a hypothetical solution for the final major project, the research conducted throughout was based on a real life situation, working alongside lecturers trying to come up with solutions to this problem.

Solution

How can we successfully use technology to create a solution to the learning and teaching of Chinese students from overseas? There is an urgent need to create a digital solution to make it possible for lecturers to teach efficiently, share files and feedback, as well as students to continue learning.Due to Chinese laws, the E-Learning platforms are restricted and therefore there’s a need for one in which covers everything needed, but also falls under Chinese guidelines.

Tools

Adobe XD
Typeform
Trello

Team

UX Designer (Myself)
Three Lecturers
Students

My Role

UX Design
UX Research
Project Manager

Timeline

Overall: Around 8 weeks
Research: Ongoing
Design & testing: 6 weeks

Project Management

Before making a start on the project, I felt it was important to work on a time plan using Trello. This was to ensure deadlines are set for each stage of the project - as outlined above.A well-structured time plan for each week of the project is essential to ensure that deadlines are met, as it helps maintain focus, allocate resources efficiently, and track progress toward the project's successful completion.

Design process for registration tool

01

Project management

02

Research

03

Sketches

04

Wireframing

05

Hi-Fi Prototype

06

Next Steps

Project Management

Before making a start on the project, I felt it was important to work on a time plan using Trello. This was to ensure deadlines are set for each stage of the project - as outlined above.A well-structured time plan for each week of the project is essential to ensure that deadlines are met, as it helps maintain focus, allocate resources efficiently, and track progress toward the project's successful completion.

Design process for registration tool
Education persona Education persona

Personas are crucial in user research projects because they create a human-centered framework. They provide a relatable snapshot of the target users, allowing designers and researchers to better understand their needs, desires, and challenges. This insight ensures that the resulting products or solutions are finely tuned to meet the user's expectations, ultimately leading to more successful outcomes.

Primary research - survey example

Primary Research - Surveying

As an integral part of the research, a comprehensive survey was conducted among students in both China and the UK. The primary objective was to gain insights into their specific learning requirements, existing platform usage, and key pain points they encountered. This inquiry provided valuable data regarding their awareness of WeChat Work, their perceptions of its integration into their personal and professional spheres, and device preferences. These findings played a pivotal role in guiding the strategic direction for the adaptation of WeChat Work. It became evident that the necessity for a desktop version for video calls and efficient file management was non-negotiable. Additionally, the decision to opt for WeChat Work over WeChat, in order to create a clear delineation between work and personal life, was strongly validated by the survey results.

User Journey

As the hypothetical solution to the end goal of this project was to look at how we could develop a pre-existing application to meet the needs of both student and lecturer, it was important not to make that user feel overwhelmed by the amount of change to something they may know already very well. This comes from the Principle of Least Astonishment which was defined in the 1980s as: postulates, “if a necessary feature has a high astonishment factor, it may be necessary to redesign this feature.” In other words, the users should not be surprised, startled or astonished by the system’s behaviour, or by the behaviour of any of the system’s components."As a result, changes made we small but powerful and well thought through to ensure the best experience for both students and lectures alike.

WeChat mockups
Backwards engineer sketch

Sketches

Backward engineering WeChat Work through the use of sketches was a valuable strategy in gaining a deeper understanding of how users navigated the application and how its features could be adapted to cater to the specific needs of students and lecturers within the context of your project. By deconstructing the application's interface and functionality, we were able to reverse engineer the user experience, shedding light on the key elements that make it user-friendly. This process not only helped identify design principles and interaction patterns that were successful but also allowed for the extraction of best practices that could be reimagined and integrated into the project.

Wireframes

Low-fi wireframes in Adobe XD are a crucial part of our project. They help us understand how students and lecturers use the system, like when they want to access a file. These wireframes are like a rough sketch or blueprint, allowing us to map out the user journey. We can see the paths they take, where they might face problems, and where we can make things easier.Furthermore, these wireframes play a critical role in our early usability testing phase, allowing me to gather invaluable feedback from both students and lecturers. This input guides us in refining the design before advancing to high-fidelity wireframes, where we delve into more intricate visual elements and finer details. In essence, these low-fi wireframes serve as our foundational checkpoint, ensuring the fundamental functionality and user experience of our digital product align with user expectations and needs prior to focusing on aesthetics and finer points.

Low-fi prototype login screen
Web application mockup

High Fidelity Designs

Once I had fine-tuned the user journey in the low-fidelity wireframes, I moved on to the high-fidelity wireframes to focus on the UI design. This shift allowed me to work on the visual details, like colors, fonts, icons, and other elements that make the user interface more appealing and user-friendly. It's the stage where we make everything look and feel just right for the users based on the improved user journey.This can then be used as a working prototype for lecturers and students to test, ask any questions and give any feedback which can then be refined in the final stages of the project.

iPhone app mockups

Learnings

Through the user research project aimed at finding a solution during the COVID-19 outbreak for UK lecturers teaching Chinese students remotely, I gained valuable insights into the multifaceted challenges presented by platform restrictions, time zone disparities, and language differences. The endeavor highlighted the importance of flexible and adaptable communication methods, tailored to accommodate various time zones. It underscored the significance of culturally sensitive and language-friendly approaches to foster effective understanding.Moreover, the project reinforced the necessity for robust technical support and accessible learning platforms to bridge geographical gaps and enhance the online teaching experience. Ultimately, it emphasized the need for innovative solutions that transcend these challenges to ensure a seamless, inclusive, and productive educational environment for both lecturers and Chinese students in the UK.

WeChat Work - brand guidelines