Project-based learning for designers and developers
There are so many resources available, users are left chasing multiple resources. Having a single resource to meet the needs of users will help them reach their goals quicker. Users need access to their content on any device in order to improve their learning experience.
Design a responsive interface to allow users access to their learning content. The interface will facilitate the interaction between users and the content in order to ensure an easy and enjoyable learning experience.
After conducting market research and competitive research as the secondary research, user interviews were conducted as the primary research. This research provided the following insights to move forward with the next steps for user research:
After the secondary research, primary research was completed by interviewing participants. The goal of the interviews was to explore learning styles, positive reinforcement during learning, and frustrations with online learning. After completing the primary research, the primary persona was created: Lloyd. This persona was used to create an empathy map to get in the shoes of our target user. In addition, Point-of-View and How Might We statements were written to brainstorm solutions to the problems users want to be solved.
Project goals and the feature roadmap were created to align expectations for the next step. Based on this, the features, we decided to ideate on were the following:
To determine the information architecture (IA) of LearnUXD, we used Optimal Workshop to send participants our tree test. The decision to use tree testing was determined by 2 reasons:
Findings of the tree test provided the following insights:
Task and user flows were focused on users selecting their in-progress course from the homepage and completing the course.
Version 1: collapse/expand button for contextual menu can be accessed at the bottom of the menu.
Version 2: collapse/expand button repositioned at the top menu, next to the course name.
Desktop version 1 and version 2 were tested. Maze was used to perform remote testing. There were 5 participants that we split into 2 test groups:
Based on the results of the desktop usability testing, we would use the respective version of mobile to complete its usability test. For mobile, we approached it by interviewing 3 participants in a semi-structured format.
Participants were given a combination of tasks and follow-up questions based on each prototype. The goal of the usability test was to determine the following:
Based on the desktop usability test results, we decided that version 2 of the prototype would be used to proceed with mobile testing.
By default, the contextual menu will expand each time the user moves onto the next sub-topic in the course. This pattern will provide users with feedback on an updated course progress indicator.
Unlike desktop, the contextual menu will remain collapsed as a user moves onto a new sub-topic. Since the contextual menu occupies the full-screen space, this pattern prevents the menu from becoming intrusive to the user. We will give users the freedom to collapse and expand the contextual menu if desired by the user.
In both desktop and mobile, the “Mark as completed” option will be selected by default based on the user’s tracked progress on the sub-topic page. If the user wants it unchecked, they will have the option to do so.