The Project
Learning Object for Online Classroom Modules created in Adobe XD
The Purpose
Visual literacy sets the tempo for the digital age. Educators and instructors are being forced to make the switch to online learning due to the state of education during the 2020 pandemic. The problem is online classrooms require far more visual communication than traditional classrooms.
Students and teachers alike are being asked to become instructional designers, videographers, graphic designers and more overnight all while being paid less than ever. This course was created as a free resource that teachers can use to support their students success in the online classroom.
My Roles
Graphic Designer
•Develop a visual theme consistent with Learning Chameleon Brand..
•Create memorable examples of design principles.
•Develop a visual theme consistent with Learning Chameleon Brand..
•Create memorable examples of design principles.
Learning Experience Designer
•Poll my network of instructors to determine pain points
•Create flowcharts and content
•Design and develop learning experience
•Poll my network of instructors to determine pain points
•Create flowcharts and content
•Design and develop learning experience
Subject Matter Expert
•I consulted my own knowledge base as well as other graphic designers in my network to inform the content for this project.
•I consulted my own knowledge base as well as other graphic designers in my network to inform the content for this project.
Design for Non-Designers
I frequently work with a teacher who assigns her students projects like posters and blogs, so they will have something to keep and show off down the line. The problem is, her classes are in English and creative writing. More often than not, her students don't know the first thing about visual design and that impacts the quality of their projects.
Now that her classes have moved to completely online, she has even less time to teach them basic design principles. Having assigned her students a poster design to present at an upcoming research symposium, she needed a quick solution that would turn her students into expert visual communicators in just one lesson.
Try it out below.
An Immediate Solution
It's important to consider that all the while you are developing training, there is a standing need for it that goes unmet until your work is finished.
I've had this project in mind since we collectively realized distance learning was here to stay, but the project is a tall order and it would take some time. The problem is, my partner's class was a week away.
To solve the problem as quickly as possible, I created this working high-fidelity prototype with Adobe XD. This prototype serves as a usable standalone learning object, and it's ready to be added to lessons right away.
A high-fidelity prototype like this one bridges the gap and if the prototype achieves the learning objectives and erases the need for a more complicated object, then I've saved the client a lot of development time.
Trust the Process
Because I knew I intended for the interim stage of this project to serve as a temporary solution, I needed to start even smaller than a rapid prototype. I built these flow charts to describe the structure of the object and I immediately realized that I had too much content.
Looking at the expanded view of each topic, I decided that it was unnecessary to divide each topic into subsections. The end result was a more fluid experience that ties the different principles of each topic together.
Lead by Example
The slides in this learning object all adhere to the principles they teach. The minimalist style with plenty of white space demonstrates that less is more.
1 Font Family
3 Colors
4 Graphic Objects
3 Colors
4 Graphic Objects
That's all it takes to get these points across.
Deciding, Fast and Slow
The methods used in this learning object are heavily influenced by Daniel Kahneman's book Thinking, Fast and Slow. Kahneman describes two complimentary systems in our brains which break down most cognitive tasks into a decision between the energy-saving intuition 'System 1' and the more calorically intensive 'System 2' which kicks in to solve more complex problems.
Because this training focuses on the decision-making process of design, I found it appropriate to cater to these systems. By repeating patterns of good and bad examples, using the same elements in each example, the cognitive load on the learner is reduced, allowing them to be more relaxed and receptive.
The Illusion of Choice
Another cue taken from this book is that the creative, intuitive System 1 is primed when a learner is happy, which is why the navigation system mimics a snarky dialogue with the content.
Although this training is centered around the theme of decisions, the learner doesn't actually have very many choices. On most screens, a forward button, backward button, and a home button is all they get. This allowed me to keep the training short and simple, so I leaned into this constraint by using it to highlight the importance of decision-making.
In each slide, the forward button represents a unique "response" that invites the learner to have disagreeable, sometimes philosophical responses. It lightens the mood, and more importantly it primes the learner to form new intuitions about good design.