The scalable educational platform accesses, trains and improves engineering students’ visuospatial skills, and boost their motivation to continue studying in the field of Science, Technology, Engineering and Mathematics(STEM). The platform is an online weekly workshop designed for incoming freshman students in the School of Engineering at University of Illinois at Urbana-Champaign.


Learning Design


Web Development


Ziang Xiao

Lei (Ryan) Zhang


Aug 2016 - May 2018


Why is visuospatial skill important for students?

"Visuospatial skill is the ability to represent, analyze, and mentally manipulate objects."

Literature Review of Previous Studies

Students who have good visuospatial skills are found to be better equipped to learn, reason, and solve complex engineering problems (Veurink, & Sorby, 2012). Recent attempts to introduce workshops and seminars for engineering freshmen students across the US has demonstrated success in improving their learning and increasing the retention rates (National Research Council, 2006; National Science Foundation, 2013), especially for students in minority groups such as female engineering students. Visuospatial skills would impact students’ future success in the field of Science, Technology, Engineering and Mathematics (STEM).



Obstacle of Traditional Approaches

Previous methods often rely on traditional paper-based questions and face-to-face visuospatial training workshops, which are costly and timeconsuming, especially for large classes. Given the nationwide trend in the increasing number of university engineering students, we proposed to design an online platform to provide a low-cost, scalable solution to effectively evaluate and train visuospatial skills.



Transforming the Learning Experience through a Scalable Online Platform

Our online platform is designed to offer a comprehensive assessment and training of visuospatial skills using a set of well-tested multiple choice and free-hand sketching questions. Currently, the platform offers a pre-assessment, seven weeks of exercises, and a post-assessment at the end of the course.

When I joined the spatial reasoning project under an university research grant, there was a simple website built for experiment purposes, providing assessments only. The internal stakeholders - the grant and professors from engineering departments, envisioned the platform to become an "all-in-one" platform providing training, assessments, and sketching exercises.

Based upon Sorby's classical book of visuospatial training and course materials from a pilot course, I selected 9 topics to be the core training of the online platform. To ensure students' participantion and engagement, I adjusted the difficulty of the exercises and kept the average completion time for each module under 30 minutes.

Another researcher and I held office hours periodically for students to report usability or learning problems. We also invited students to focus groups and interviews at the end of each course, to gather insights from students' learning experiences.

Inspired by students' feedback, I designed and implemented new features on the platform:
1. The "retry and review" fuction in the exercise section. In the initial version, the platform let students see correct answers after they completed exercises. The current version allowed students to retry the exercises that they got wrong at first time, and then review answers. In this way, students were encouraged to focus on the process of thinking rather than the answer, and "think twice" before making a final judgement.

2. Browser-based sketching pad. The sketching component was originally in another platform that students had to download, then upload sketches back to the platform. When checking students' completion rate in the backend database, I found that students sometimes only complete the online multiple-choices but leave out the sketching exercises. After discussing with students, I realized separating the learning experience into two platforms hindered students from immersing in a seamless learning experience.
In summer 2017, I collaborated with Lei (Ryan) to design a browser-based sketching pad to be embedded in the platform. While Lei was in charge of the technical development in Unity, I tested the sketching pad with students and gave Lei design feedback accordingly to revise the interface of the pad.


Game-based Learning

During summer 2017, we decided to explore the potential of game-based learning. As visuospatial training was a supplementary rather than a required component for engineering students, we were hoping to increase students' learning motivation in a naturally engaging way. With the design and technical help from a team of talented student interns, we were able to create, iterate and prototype 8 game modules in summer 2017.

Content alignment with the platform was essential to the development of the game modules, because we planned to compare the game modules with the platform in terms of learning outcome and user engagement. I started with mapping out the learning content for the games. In order to maintain a visual consistency between the platform and the game modules, I provided a template of color scheme and design elements adapted from the platform. Throughout the process, I conducted usability testing with college students and reported findings to inform design iterations. Our team met regularly to give interns design feedback, and present latest updates to stakeholders, such as professors from engineering departments.

The gamified version of the platform, Cubicle, was released and evaluated in fall 2017. In comparison with the platform, the game was more engaging to students according to the drop-out rate and time spent on the game, though it was difficult to integrate critical feedback and exercises that were directly associated with students' coursework into the game. In future, we are interested in merging the game and the platform to provide a scalable, playful learning experience that further improves students' visuospatial skill and confidence in STEM.

A Game Module in Cubicle: Transform Limitation A Game Module in Cubicle: Cube Shift


An Intelligent Educational Platform for Training Spatial Visualization Skills

Xiao, Ziang., Yao, Yuqi., Fu, Wai-Tat. Accepted by the 23rd International Conference on Intelligent User Interfaces Companion. Tokyo, Japan, 2018. [PDF]

A Scalable Online Platform for Evaluating and Training Visuospatial Skills of Engineering Students

Xiao, Ziang., Yao, Yuqi., Yen, Chi-Hsien., Dey, Sanorita., Wauck, Helen., Leake, James M., Woodard, Brian., Wolters, Angela., and Fu, Wai-Tat. In Proceedings of the 124th 2017 American Society for Engineering Education Annual Conference and Exposition. Columbus, Ohio, 2017. [PDF]