Home > UX > UX Case Study: My Antique Slot Machine

UX Case Study: My Antique Slot Machine

When I was a kid, my Grandpa bought a couple of 1948 antique slot machines made by the Mill Novelty company. One was a quarter machine and the other was built for dimes. Every Sunday we went to Grandpa and Grandma’s house for a visit and Grandpa would always give each grand kid a roll of quarters and dimes so that we could play the slot machines. One Sunday, after spending all my dimes and quarters on the slots, I had a good idea. There was a keyhole on the back of the machine where you could take the back off and get the money out of the machine. Learning how to open locks with a bobbie-pin from the movies, I shoved a bobbie-pin in the lock on the back and broke it off, jamming the lock and rendering the antique machine useless. After a long talk from my Dad, a lot of tears and a locksmith, the machine was eventually fixed.

Before my Grandpa passed away, he gave me that old 10 cent antique slot machine because of my attempt at Casino robbery. I now have the key and can play it anytime I want. It still works great and occasionally I get a big win, but ever since I was a little kid I have never hit the jackpot, unless you count inheriting the machine itself.

Playing this Mills antique machine the other day I realized something. For being a simple machine, it has a great user experience. Through a couple of simple inputs and outputs, it manages to create anticipation, amusement, pressure, addiction and even anxiety. All the things I experienced when I was a kid that made me want to break into the back of the machine. This machine, with its very complex, mechanical inter-workings has a very simple user interface that entices and intrigues the user keeping them coming back for more.

This machine is perfect for a website/app analogy don’t you think!

The Backend

When you take the back off the machine (using the key preferably) you reveal a very complex mechanical system that blows the game Mouse Trap out of the water. Its pretty scary and amazing to look at, much like viewing the backend code of a piece of software or website.

Functions

The mechanics of the slot machine are a series of functions that build upon each other and work together when a dime is inserted and the user pulls the handle. Watching the machine process a dime with the back open is pretty interesting to watch. Before the lever is pulled, the machine must check to see if a dime has been inserted, if there is a dime present, the machine will unlock the lever for the user. After the lever is pulled a series of functions are called and executed, each function is started either by the initial pull or by the completion of another function.

These mechanical functions include:

  • Slide dime(s) down the coin slot to the collection box OR the jack pot container
  • Start spinning the all spindles
  • Stop each spindle randomly one at a time from left to right
  • Stop all spindles
  • Calculate results
  • Pay out appropriate amount of money
  • Lock lever

Along with these basic functions, there are more safety feature functions, adjustment functions and a variety of other mechanical logic functions. All these functions must work together to accomplish the machine’s task (stealing your money). This is the equivalent of scripting functions on a website by which the website processes how the user interacts with it and how the website dynamically displays information for the user.

The Frontend

The outer shell of the slot machine serves not only as a cover to disguise the complex functions that hide inside, they also make the machine appealing and inviting for the user. This is where the user gets to interface with the many moving components on the inside. This is where the user gets to experience its magic and wonder.

Structure

The over all, compact structure of the slot machine is built on a wooden foundation. All the components are contained, or wrapped inside four steel walls. These steel walls serve to keep all the parts and pieces together as well as the foundational structure of the user input, output and display components like the dime receptacle, the lever, the output slot and the spindle display windows.

The structure of the slot machine is much like the structure of a website, the HTML and CSS. The mark-up code of a website serves as the structure of the website, its determines the layout of smaller structures, the position of components and the location of user devices. The HTML and CSS should be a simple structure that props up the website and holds and hides its inter-workings. It allows the user the interact with the complex functions on the inside without having to display its functions.

Design

The main purpose of the slot machine is to make money right? To do this, the machine can’t just be a big steel box sitting on a simple piece of wood. It needs to attract the potential users and then keep them there playing for hours until all their money is gone. That’s where the sweet cherry burst design, bright colors, user friendly shape, ergonomic user inputs and spinning fruit symbols come into play. This is the skin or graphic display of a website.

The main purpose of a website is to make money right? Just like the slot machine, a website can’t just be a white screen with blue underlined links and black Times New Roman text, it also needs to attract and keep the user. This is where brilliant color schemes, enticing graphics, well placed user elements and animated displays come into play.

The Experience

Functions, structure and design all come together to create a unique, fun experience for the slot machine user. The user is attracted to the slot machine because the design promises to deliver instant winnings and in some cases big winnings all for the price of a dime. After the user drops a dime in the coin slot they are un-aware of the physical and emotional experience they will have in the next 30 seconds.

The user reaches up, grabs the lever and pulls. They instantly hear the functions fire as metal levers, gears and linkages click and clack together. The dime moves and is displayed for the user under a thin piece of glass. The spindles the hold the fruit graphics start out spinning fast and make a whirling noise that starts to build the anticipation. One at a time each spindle stops instantly revealing a fruit symbol, the slight delay between spindle stops continues to build tension and excitement. After two spindles stop, the user can compare and anticipate what the results will be by referencing the visual description of the different winning combinations on the front of the machine. After the third spindles stops and makes an audible clunking noise, the results are finally revealed and the winnings are then ejected through the machine into the little cup at the bottom. If you don’t win, then the machine just goes silent, its like a little quiet smirk the machine gives you.

Collaboration

With a few more dimes in hand, the user is now hooked on all the noises, movement and excitement the machine has created so they pull the lever a few more times. This user experience is created by seamless collaboration between structure, function and design. The user experience of a website is no different. A successful website or app needs to have a solid structure, fine tuned functions and a beautiful interface. To accomplish this complex task of creating a unique user experience, seamless collaboration between designer, developer and programmer has to occur. User experience goes much deeper than just the simple interaction the user will have. Like the slot machine, the functions, structure and design are all key parts of the experience itself.

About these ads
Categories: UX Tags: , , ,
  1. 12/19/2010 at 8:35 AM | #1

    What a great analogy! It’s so true about emotion being the key between a great website/app and a plain list of text links. Well done!

    (I found your blog from one of your articles on UX Booth)

  1. No trackbacks yet.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

Follow

Get every new post delivered to your Inbox.

%d bloggers like this: