Interactive Wheel System

Published March 8, 2013

We call it the IWS, or Interactive Wheel System for short. It was initially developed for in-store kiosks by our Lead Designer, Mark Kot, and it lives and breathes by the incredible illustrations provided by another of our designers, Mark Sutton. It was first authored with Macromedia's now defunct Director, and was eventually exported for use on the web in the old Shockwave plugin. In 2006, shortly after I started with the company, it came time to update that dependency. I hand some skills with Flash, and it came to me to handle rewriting it for that more universal platform.

That was my first time dealing with the application, just writing ActionScript where there once had been Lingo. A couple years later, I had the opportunity to tackle it again, and this time I got to redesign the UI. It had previously been a bit of an island. Customers were not able to directly purchase wheels from within the application, and would have to remember what they like when the went to search for it in the regular shopping area of the site (and hope it was available in their market). We wanted to integrate it more thoroughly (hell, we wanted to integrate it at all) with the purchasing flow. The nature of the design needed to change in order to incorporate the ability to purchase. It also had to handle the new ability to link into the application from a wheel page, and be able to present that wheel on the car immediately. It came together nicely, and lived on like that for many years.

After we finished doing the standards and mobile work for the site last year, it came time at last to free the IWS from the its lifetime long dependency on browser plugins. I was ready to rewrite again, and I was damn happy not to be doing it in the Flash authoring application this time.

The UI design is largely similar to my design from the 2007 version, but leaving behind the pixel constraints of the Flash plugin allowed certain elements to breathe a bit more easily. We also put in a couple new features, like the ability to download the composited image of your vehicle. And finally, we have the structure and code in place to start accurately representing the colors of the vehicles as sold by the manufacturer. For far to long, the application was stuck with legacy assumptions assuming 7 colors for each car. Whether it was available in 5 or 11, we showed 7. That meant inventing colors that didn't exist for some cars, and simply having to choose which to leave out for others. No longer.

It works beautifully on an iPad now (lots of execs have those, so that helped prioritize the project a bit), and every other tablet I could get my hands on to test (shamefully few as that was). The last step for now, though it will be delayed by the effort to standardize Discount Tire Direct's markup, will be to supplement the UI design for small screens. I have some ideas and sketches for this, but we'll have to wait a few months before I can put those ideas to the test.