PROJECT OVERVIEW
This project involved creating a new platform for our simulated educational experiences. Our product team identified limitations in our current platform that needed adjustments. My role was to spearhead the design of “in-between” experiences. These designs attempted to answer the following questions:
How does a user enter and exit the simulation?
How does a user know their progress within the simulation?
How does a user get results?
How does a user get AI generated feedback on their results?
What does a user do after they’ve gotten results?
While I created experiences that answer all of the questions posed above, in this case study I will focus on the landing page experience. The landing page experience allowed users to view all modules within a course, and each lesson within a module. The landing page was also the first place users were brought to at Stukent, and entered and exited the simulation through the landing page.
REQUIREMENTS
My first step in this project was to establish clear requirements with my Product Manager. A very important aspect of this project was communicating my progress along the way.
Key deliverables for this project included: showcasing the user’s progress through the simulation and giving clear, concise descriptions for each module, and detailing the learning objectives for each lesson.
RESEARCH AND INSIGHTS
My research exercise included a combination of visual and competitive analysis, as well as ideating elements needed within the main page. I throughly examined what other educational platforms were doing, what colors they used, how they structured their pages, and what hierarchy they used. I used critical thinking to determine how we could combine best practices with our Stukent style.
My analysis revealed that many educational interfaces use a dashboard layout that included: graphs, cards, icons and images, to enhance comprehension and engagement.
WIREFRAMES
Finally I explored a single page solution for all the information, however, I quickly discovered the information was too overwhelming within a single page. This lead me to explore a multi-page solution. This design strategically breaks up the information into module information, lesson information, and learning objectives through an informative overlay.
The primary page includes an overview of all modules (in this instance it was 5), a description of all modules, progress, and how many lessons in each module.
The secondary page includes all lessons, description, and skills users will learn.
The information overlay could be accessed through the secondary page and included information such as learning objectives for each lesson.
ITERATIONS
This design process included three round feedback loop from stakeholders. Stakeholders for this project included Product Manger, Design Manager, Engineering Lead, Instructional Design Lead, and a Project Portfolio Lead. I took a 30%, 60%, 90% strategy for gleaning feedback. At each stage within the iterative process stakeholders were able to view the progress of the project and give suggestions. The collaborative nature of system allowed for continual improvements and alignment for the final deliverable.