Dashboard + Lessons
The goal of this project was to create a website with a dashboard, lessons, and analytics layout for a government SBIR grant
My Role: UX & UI Designer
Timeline: 3 weeks
My Team: Esther
Tools: Figma, FigJam, Google Office
Understanding the Issue
The challenge was to create a new website prototype that would demonstrate the users flow of accessing a XR lesson via website. This website would include a dashboard, lesson, pre-briefing section, QR code, de-brief session, and include Microsoft tools. The website prototype was to be submitted to a SBIR grant proposal (Government client logos excluded in these designs).
Meet our Government Client
Client is looking for an XR product that could be used throughout their hospitals for training. This XR product would need a website that fits the needs of their instructors and healthcare staff. These were a list of requirements given by our client.No realism in training with manikins.
Storage/library for student and class resources. Ability to upload mutli-media content to lessons.
Pre-Briefing that would ensure simulation learners are prepared for educatonal content and aware of rules.
De-Briefing process that includes feedback and guided reflection of XR session.
Survey instrument.
Chat option feature.
Use of white board function for class activities.
Digging into the Problem
Here were some of the insights on our current website found from interviewing CEO, Product Managers, VP of Customer Service, and Government client.
There are no visuals (thumbnails or images) on our current website.
No analytics are currently collected or displayed of the completed XR Sessions.
There are no pre-briefing or de-briefing sections for the XR session.
Sessions cards do not feel like lessons.
Microsoft tools are not currently incorporated.
There is no quiz feature for after the XR session is completed.
Feedback from Users
I used a couple of key insights when considering the solutions for the website redesign.
Insight #1 - Users wanting more visuals and thumbnail like images of XR session.
Insight #2 - Users having easy access to all lesson components on one page.
Based on these insights, I decided to redesign the website to mimic a students experience of taking an online class.
Lessons Redesign
The second issue at hand was designing what potential “Lessons” could look like once you click into a session. We currently had no concept of lessons in our website, and had to come up with completely new ideas and designs.
Usability Testing
Insight #1- Originally the dashboard had many small thumbnails of potential lessons, but the feedback I received was that realistically for the pitch, the user would only have access to about 3 lessons.
Previous website dashboard design
Current list of lessons
Based on the current website, I brainstormed various designs
This is the current website. You can see that there are no visual thumbnails of the XR sessions.
This currently what happens when you click on a “lesson” or “Session". Limited information is available including start date, time, and title of session. There is no description or pre-briefing, de-briefing materials.
Competitor Research
XR and VR resources are still limited and best practices for XR in terms of lessons and virtual learning are not well documented.
Instead, I was able to reference websites like Coursera and Blackboard, these were websites that displayed examples of virtual learning. I was inspired by how these websites organized a full lesson or class.
I was also inspired from pages like Youtube and Instagram, that show the user a snippet or thumbnail image of the content. I wanted to use this in our designs to help the user quickly scan through lessons to find the correct one.
User Journey Map
We mapped out the user journey and what flow the user would be going through to access the lesson.
Solution for insight #1- Number of lessons were reduced, and the thumbnails were made larger to make use of the space. This also allowed for more space for a description to be placed next to thumbnails.
Insight #2- Users wanted to be able to access all lesson components from the chosen lesson.
This is the current lesson, with no links to other lesson components such as a lesson pre-brief, or debrief section
Solution for Insight #2- Users would have easy access to all lesson components from the chosen lesson via accordion menu’s.
Challenges
One of the main challenges of this project was not being able to directly interview users. Most, if not all of the user feedback came through the customer service rep, the product managers, and CEO.
Next Steps
Next steps would be to work with developers to create the website and make live for users, and to partake in direct user research.