UPS Road Code
Website & Game
My Position Lead UX/UI Designer, Art Director
Task In order to introduce the UPS Road Code workshop, I was asked to create a website, that is engaging and interesting for young drivers and informative for teachers and schools that would host the workshops. It had to include brochures and info material as well as an online booking calendar.
The main focus of the workshop is about making the right decision in the right moment and avoiding distractions. Ideally the example scenarios from the workshop would be presented on the website (for example do not talk on your mobile while driving). The website should responsive with a desktop first focus.
The website was a big success with high engagement and is still used for the workshop.
Challenge
For two very different target groups creating two different experiences that seamlessly blend with each other. Bringing the not so fun and pleasant topic of car crushes to teenagers, without loosing them immediately.
Solution
I really believe in learning trough engagement and interaction, so when I received the task it was quite clear to me that I would like to create an interactive experience for the young drivers. Driving safely is all about making the right decision in the right moment: that is the core message of the UPS Road Code Workshop. I decided to create a simple multiple choice game as the home page. Each decision is related to the main topics of the workshop, and main problems of young drivers. Incorrect answers lead to funny, absurd situations instead of bloody car crushes and link directly to the info page. Once the player has reached the end, he would be directed to the calendar.
Since the main concept was based on the decision idea, I took it to all sub pages and created a "if" "then" experience on each of them. The users action on the left would always change the right side.
For the teachers I created a pragmatic and intuitive way to get to all important information using the first link in the main navigation. This would lead to a full screen overview (desktop) and an accordion view (mobile) of the well structured content including pdf downloads.
