Category Archives: User Experience

An Almost Complete Journey of JIBC’s Fire Investigation Simulation

Posted on by
Reply

How it all started?

Back in October 2020, we had a conversation with instructors and leaders from JIBC’s Fire Fighting Program and learned that practical firefight training can be costly, dangerous, and only available at specialized locations.

Taking fire investigation as an example, instructors need to purchase used furniture, set up scenarios such as a kitchen or a bedroom in shipping containers, burn them, and then put the fire out. Only after all these steps can students enter and investigate the cause and origin of the fire. In addition, it is reported that sometimes the burn patterns do not turn out as expected.

Bedroom in a Cubicle

Bedroom in a Cubicle

A Journey of JIBC’s Fire Investigation Simulation

Early Prototyping

  • In early 2021, we partnered with a team from Centre for Digital Media and created a working prototype for fire investigation over a period of 13 weeks. The CDM team on this project did an excellent job capturing their design and development process on their blog.

  • Additionally, within the handover package, the team provided a well-designed infographic to illustrate the main features of the simulation. Kudos to the team again for exceeding our expectations.

Piloting the Simulation

  • As our ultimate goal is to integrate this gamified simulation into the firefighting program, we decided to pilot the simulation in an upcoming course section.

  • Kavita and Dennis from our CTLI team designed an HTML page that includes all the necessary information for the learners.

Pivoting Based on User feedback

  • Through the pilot, we collected and analyzed students’ feedback and found that one of the main issues is that students had a hard time downloading, installing, and accessing the simulation, especially for MAC users.

  • Even for those who were able to access the simulation, the simulation can be choppy depending on the performance of users’ computers. In short, our analysis suggests that we need to address the accessibility and usability of the simulation.

  • While users acknowledged the potential of this fire investigation simulation, a better solution is needed. Upon discussions with our team, we decided to convert it into a web-based simulation while improving its usability within the simulation.

A New Direction

  • With a limited budget, we worked with a CDM alumnus, a software engineer with a passion for health and education simulations, to convert the simulation into a more accessible web-based solution.

  • The first prototype of the web-based solution was completed in July 2022, followed up with user testings that aim to assess its accessibility and usability.

  • User testing suggests that simulation loading and responding speed, navigation and wayfinding are key areas for improvement, along with other minor adjustments needed. For a more detailed testing report, please refer to Fire Sim User Testing Report – Aug 2022.

What Next?

Design is a craft and sometimes a never-ending process. We have identified a list of achievable changes to improve user interaction and overall user experience. We are also hoping to pilot the web-based fire simulation in an upcoming course and continue to collect feedback from users for improvement.

What are the lessons learned?

  • Pivoted a few times, from the original idea of a VR application, to computer-based, and then finally web-based, we learned again that a good design needs to be firstly accessible and then usable.
  • User research is a critical task that should never be overlooked, as the False-Consensus Effect suggests: we are not users and we should not assume users will behave similarly.
  • Looking at the big picture, this simulation has a powerful impact on the overall course design: assignments and relevant instructions need to be adjusted accordingly; instructors will play a key role in supporting students when a new tool is introduced.

It’s Now: Designing and Using Immersive Simulations for Learning

Posted on by
Reply

Virtual reality (VR) or immersive VR simulations for learning is no longer something to be imagined or planned in the future. If you have not done a project like this yet, the best time to start is now. 

About two years ago, I had the chance to present “Virtual Reality for Public Safety Training” at JIBC Open Symposium. After introducing relevant pedagogical significance, examples, research on effectiveness, and future opportunities, I landed on a question for the audience, “What would be the problem you want to solve with emerging technology like VR?”

The responses were fueled with enthusiasm and revealed a wide range of applications and practices that JIBC could benefit from. Just to name a few:

  • “simulate a patrolling scenario in downtown eastside”
  • “access correction centers and walk around the buildings”
  • “build empathy by living and acting like someone else”

As we can see, common to these scenarios are things that we feel difficult to design or simulate effectively in the classroom. Bailenson (2019) pointed out that high-fidelity 3D environments like virtual reality have the capability to simulate scenarios that are:

  • Impossible: you cannot change skin colour easily, but in VR you can inhabit avatars with different skin colours with profound results.​
  • Expensive: you cannot easily fly your whole school to Machu Picchu.​
  • Dangerous: you would not want to want to train emergency landings by crashing real airplanes.​
  • Counterproductive: you should not cut down an entire forest to instruct on the problems of deforestation.

The primary differentiator for high-fidelity immersive simulation technologies is that it creates a strong sense of presence and enables embodiment.

  • The concept of Presence has a  long history in psychology, Witmer and Singer (1998) defined it as “the subjective experience of being in one place or environment even when physically situated in another”.
  • Embodiment, on the other hand, means “our process of learning and understanding are shaped by the actions by our body, such as gestures”. (Johnson-Glenberg, 2018)

While presence manipulates or alters how our brains perceive the world around us, embodiment allows us to physically rewire our learning from a behavioural level. Scholars suggest that well-designed 3D simulations address some critical pieces in learning from a pedagogical perspective. Dalgarno and Lee (2010) listed five major affordances of 3D virtual learning environments:

  • Spatial knowledge representation: facilitate learning tasks that lead to the development of enhanced spatial knowledge representation of the explored domain.
  • Experiential learning: facilitate experiential learning tasks that would be impractical or impossible to undertake in the real world
  • Motivation and engagement: facilitate learning tasks that lead to increased intrinsic motivation and engagement
  • Improved transfer of knowledge and skills: facilitate learning tasks that lead to improved transfer of knowledge and skills to real situations through the contextualization of learning.
  • Collaborative learning: facilitate tasks that lead to richer and/or more effective collaborative learning than is possible with 2‐D alternatives.

Learning these theories provided us with a foundation of how we may move forward with high-fidelity simulations. But designing and customizing simulations for specialized areas in public safety remains a challenge as it requires a wide range of expertise such as content knowledge, programming, 2D/3D modelling, animation, user experience design, and user interface design. A collaborative, interdisciplinary team is the key to the development of accessible and usable immersive virtual learning environments. 

Fortunately, over the last two years, we were able to identify some internal partners at JIBC who are interested in developing simulations, and also had the opportunity to collaborate with a few highly skilled teams from the Centre for Digital Media.

Here are some video demonstrations for these award-winning projects:

Produced by LifesaVR team at the Centre for Digital Media

Produced by FlashoVR team at the Centre for Digital Media

https://youtu.be/_DvdOPLUGLg

Produced by Team Caramel at the Centre for Digital Media

Reference

Bailenson, J. (2019). Experience on demand: What virtual reality is, how it works, and what it can do. W. W. Norton & Company.

Dalgarno, B., & Lee, M. J. (2010). What are the learning affordances of 3‐D virtual environments?. British Journal of Educational Technology, 41(1) https://onlinelibrary.wiley.com/doi/full/10.1111/j.1467-8535.2009.01038.x

Johnson Glenberg, M. (2018). Immersive VR and Education: Embodied Design Principles that Include Gesture and Hand Controls. Frontiers in Robotics and AI, 81. https://www.frontiersin.org/articles/10.3389/frobt.2018.00081/full

Witmer, B. G., & Singer, M. J. (1998). Measuring presence in virtual environments: A presence questionnaire. Presence, 7(3), 225-240.

Five Practices for Rapid Course Design and Development

Posted on by
Reply

Start with Backward Course Design Approach

If you start your course design with content selection, you are likely to spend a lot of time but making little progress. Backward course design approach is outcome-based and therefore efficient. It also helps us to align assessment plans to learning outcomes, and align content and activities to assessment plans.

Here are the simplified steps for backward course design:

    • Step 1 Learning outcomes: identify what students should get out of the course
    • Step 2 Assessment: determine how to assess learning outcomes
    • Step 3 Activity and Content: select content and design activities around assessment

Here is a Course Plan Template that supports backward design.

Design a Proper Syllabus

Even with tight deadlines, a syllabus should at least contain 1) Instructor information, 2) Course description, 3) Course learning outcomes, 4) Required texts and materials, 5) Course schedule, 6) Assessment plan, 7) Assignment descriptions and expectation, and 8) Course policies. A good syllabus helps everyone (SME, Instructional Designers, and Program Managers) to imagine how the final product will look like.

From a backward design perspective, it is critical to be clear on the assessment plans and assignment descriptions. For example, if you are asking students to post threads in discussion forums, you should elaborate on your expectations in the syllabus such as the length of the post, whether or not they should reply to other students, and when they should complete the tasks.

Build an Effective Process for Content Development

Course design and development usually requires strong collaboration between multiple parties. Here is what makes the process effective based on my experience and observation.

  • Use cloud tools such as OneDrive and Google Drive where possible (please check your organizational privacy policy first).
  • Adopt a clear and consistent structure for content and asset organization. Assets could include images, videos, documents, and any other files for course design and development.
  • Design your content document purposefully. The more your content document resembles the final product, the more efficient everyone could be.

Be the Product Manager

Put on your Product Manager’s hat and be clear on the requirements! Your final product is most likely a course that lives in a learning management system (LMS). To avoid surprises, here are some of the questions for you to think:

  • Is the design for a new course or integration into an existing course? A new course design usually starts from scratch while integration is a redesign based on what is already in the course. This is particularly important for online courses because the design process and the final product could look very different.
  • How will the course menu look like in the learning management system (LMS)? Is there a particular structure that everyone needs to know?
  • How is everything named in the LMS? Will your students and instructors be able to understand and tell the difference? Do the naming of your assignments align with what is in the syllabus?
  • How are your learning modules built? Simple file upload into LMS, customized HTML and CSS pages, or designed in e-authoring tools such as Articulate Storyline and Rise 360? 
  • How do learning modules open in your course? Pop-up in a new window or opens within the LMS? Open within LMS often means less on-screen space for content presentation. This may look minor but it could have a huge impact on student learning experience, especially for those who use mobile devices or tablets.
  • How do your courses move into LMS? Are they in a test environment before they go live? Are there any components that need to be imported as SCROM packages or HTML pages into your LMS? How are other departments such as IT and Scheduling involved?
  • Can you be agile? Do you have to wait for the SME to develop everything and then design the course? Think about the modules that you can design already.

Some of these questions may sound technical but it is what makes a good product manager great.

Make Technology Work for You and Students

There are multiples ways to success in life and at work. The same to technology.

  • For video recordings, Kaltura is recommended at many institutions, but if it doesn’t work for you, use your phone, your webcam, or any tool that works for you.
  • For synchronous online learning, Collaborate or Zoom is commonly used but it doesn’t mean that you or your students have to be in synchronous sessions all the time. Why not blend asynchronous and synchronous learning?
  • For courses delivered through LMS, is there any flexibility for course completion? For example, do students have to complete everything within the day if it is a 1-day course? Can the course be available for a longer period, particularly the asynchronous components? Maybe you just opened this course to more students who couldn’t register previously by doing that.
  • And lastly, always ask for help when it comes to technology.

Facilitating Synchronous Online Learning

Posted on by
Reply

A few weeks ago I developed and facilitated a workshop around facilitating synchronous online learning for the Learning Center at Kwantlen Polytechnic University. Initial assessment showed that the main challenges of teaching synchronous online classes are:

  • Communicating with each student during the session
  • Converting face-to-face activities to online sessions
  • Audio or video technical issues
  • Using interactive tools

At first glance, these challenges seem to be technical. However, it may be a combination of beliefs and skill gaps. For example, I wonder why instructors need to engage with “each” student in a synchronous online session. Is it a need derived from learning objectives or a perception driven by the fear of losing sight to each student?

In order to address these beliefs and skill gaps, the workshop is designed and delivered to cover these learning outcomes:

  • Identify elements that influence synchronous online learning experience
  • Recognize the affordances and constraints of synchronous online learning platforms
  • List different phases and best practices in a synchronous online session
  • Apply multimedia learning principles in the selection and use of tools for interaction and assessment

A Sneak Peek of the Workshop Activity

What are the best practices for synchronous online learning?

It is obvious that best practices in teaching and learning largely depend on the learning objectives and the tool you selected within the platform.

We will go through the first page of Suggestions for Using Synchronous and Asynchronous Communication from the University of Calgary, Werklund School of Education, and work in groups to adapt it based on your synchronous online learning classes.

At the end of this workshop, not only participants learned the technical side of using synchronous online learning tools for content delivery and assessment but also formed a better understanding of relevant strategies to engage and interact with students.

Presentation at ETUG: Co-creating XR Application for Education

Posted on by
Reply

What is ETUG?

Educational Technology Users Group (ETUG) is a community of BC post-secondary educators focused on the ways in which learning and teaching can be enhanced through technology.

What is this presentation about? 

In the ETUG Fall 2018 Workshop, I proposed to present. And here is the abstract:

Most educators get to access AR/VR/MR applications when they are well-developed and ready to use, but they are missing in the design and development process. To most people, the design and development process remains mysterious, but educators need to be involved in the process and become co-creators. Sharing the process and challenges will be an important first step.

What was presented?

Developing HoloLens Application for Aircraft Maintenance Engineers

Posted on by
Reply

Just in case you don’t know, our project is basically to translate an existing desktop Helicopter Rotor Head application into Microsoft Hololens application. In addition, we are adding voice control and multiple user network.

(Image Credit: John Bondoc, UX Designer)

Sounds interesting? It’s actually quite scary because none of our team members had experience developing HoloLens application previously. So we learn as we do it.

We just finished Sprint #6 and entered into Sprint #7.

(Credit: Junsong Zhang, Project Manager)

In Sprint #5, we created a prototype based on the concept art below and started adding voice control into the application. The main changes were: 1) we added a voice control command board, and 2) the controls were moved below the rotor.

(Image Credit: John Bondoc, UX/UI Designer)

However, in Sprint #6, we tested the prototype and found that the main problems are

  • Difficulties with collective/cyclic controls.
  • Difficulties to see the effects such as airflow & swashplate movement.
  • Difficulties in looking at the rotor while moving the cyclic/collective controls.
  • Slow response with voice control.
  • Confusion about voice control menu.
  • Insensitivity of voice control in noisy environment.
  • There are no indications when “make bigger/smaller” voice controls hit the limits.
  • Not enough training/instructions with regard to how to use HoloLens.
  • Users tend to take it as a 2D object instead of 3D.

Considering scope, we decided to work on the ones that are critical to the functionality of this application:

  • Improve cyclic function
  • Resize/reposition cyclic & collective controls
  • Resize the whole field of view so users don’t need to move their heads too much at the beginning.
  • Change how the model scale up and down: keep the rotor in the background while it grows bigger or smaller instead of jumping to the front.
  • Redesign the voice control menu: instead of a command board, the new voice control menu will be interactions that give users instructions when they gaze/hover over the buttons.

(Credit: the entire team)

Based on that, we came up with a new sketch that reflects that our new interface and interaction. The main changes are the positioning of controls and voice control menu, as well as how the interactions work. We’ll have to prototype and test it. 

(Image Credit: John Bondoc, UX Designer)

From this week on, we will spend more time developing a multiple user network. The idea is to enable instructors to broadcast their views and modifications in the application to students in real-time.

Sketching User Experience with Our Clients

Posted on by
Reply

After the initial meetings about the problem we need to solve and the requirements, we finally entered into the brainstorming phase in which we are expected to come up with viable solutions.

But, a more important question for our team is how to come up with a solution that build trust and alignment with our client and also move on to prototyping as soon as possible.

In order to align with both our team members and our client, we decided to involve our client in the sketching process so we could better understand the client’s vision and incorporate it into our design.

The First Step

  • Get Ready: everyone, including your clients, gets an A4 paper and pens/pencils! Remember to set a time limit!

The Second Step

  • Sketch: everyone sketches silently for 15 mins! So… we have 7 people in the room. Does that means 105 mins? No, it’s still 15 mins! 😉

The Third Step

  • Roundtable: each individual could spend up to 5 mins to explain their sketches! You would be surprised how people see and explain things differently! I was definitely surprised when our programmers explained the design from a very technical perspective which helped us to understand what may not be possible…

The Fourth Step

  • Discussion: just give some time for people to talk about what they like and dislike, or what is possible or not…

The Fifth Step

  • Recreation: do a new sketch all together to decide what the design or flow looks like! I like it the best when we and the client do it together as a team, because then everyone is automatically aligned and have a clearer understanding about what our product may look like. There are things that will still remain vague though, but it is definitely a good start!

The Sixth Step:

  • Document and Share: always document it somewhere for communication and future reference. Here is the final sketch we have for the first design meeting with our client:

Our clients left with excitement because not only they contributed a large portion to the potential solution but also learned so much about our design process. They expressed that they would use the design process for their internal meetings and discussions too!