Week 8: Makey Makey I

We started using Makey Makey's this week in class.  We did a few activities to simulate different games and their controls and get us thinking about the different ways we can use them and what problems we might come across.  Our tutor mentioned at the start that one of the biggest things to remember was to ground it and I still forgot half a dozen times during the workshop.  My IP1 will plug straight into a Makey Makey because of how it was set up (using keyboard arrows).  My challenge will be to get it as physical as possible on a floor mat set-up, and hopefully to add more functionality to the prototype and fix some of the bugs from IP1.

One of the most interesting things we did was play multi-person Pacman where 4 people were each responsible for a direction.  We had to communicate a lot to make this work but it made it a lot more fun than regular Pacman.  Here are a few of the different set-ups I tried today.

Set-up for space invaders.  Alfoil bracelet grounds it.

Set-up for piano, using back letter controls (WASDFG).

Playing the online piano.

Set-up to play my game, success!

Week 8: Physical interactions

This week in class we looked at three existing digital experiences (email, Twitter and Super Mario Brothers) and had to come up with 5 new ways of physically interacting with them.

 

  

Email

Core interactions

• new message
• write message
• send message
• view inbox
• move or delete message

Ideas

1. Sandbox
   movements in sand associated with specific actions
2. Physical drawers
   drawers on a desk with actions associated with drawers; interactive elements (block) do something when you transfer between drawers
3. Coloured balls
   similar to drawers but colour indicates action; when viewing an email, the colour you choose decides action (red for delete)
4. Physical box with coloured lights
   box is scrollable and has digital display
5. Physical letter
   uses the tactile sensation of writing a letter that then scans image-to-text and shreds original (like a fax/shredder)

Twitter

Core interactions

• scroll newsfeed
• compose tweet
• send tweet
• quote or retweet
• follow someone

Ideas

1. Floor mat
   uses a floor mat that you would stand on/tap to compose tweet; layout would be like old mobile phone keypad
2. Rollerdex
   scroll through to scroll through newsfeed; can scroll forward and backward; touch sensors on 'cards' would perform simple actions like retweet
3. Deck of cards
   to promote slow, deliberate reading; hold card up to sensor to load next tweet in feed
4. Chips/box
5. Morse code
   morse code tapper, switches for actions

Super Mario Brothers

Core interaction

• move forward and back
• jump

Ideas

• Bike
  pedal forward and back; get off saddle to jump
• Semaphore flags
  different combinations for different moves
• Box of water
  sensors on box, splash to indicate action
• Foot pads
  two foot sensors (left and right) to simulate movement; handrail touch to move backwards; jump to jump
• Row boat
  left row for back, right row for forward, row both to jump

Summary

This was a really interesting exercise, I was definitely running out of idea steam by the time I got to 5.  I also felt like I was repeating elements of my ideas, it was hard to think outside the box.  Super Mario was much easier as the interactions were simpler, email and twitter had so many behaviours that I found my ideas centered towards one or two interactions and not the full interaction of these applications.

Week 4: Prototyping Exercises

For the contact class this we were given two exercises to demonstrate our knowledge of different types of prototypes.

Exercise 1: Car Interface

What are the functional components? 

Components relevant to driving behaviour are bolded.

• Dashboard
• Air vents
• Rear view mirror (and flip)
• Air vents
• Side mirrors
• Side console
• side mirror adjusters
• fog lights
• headlight adjusters
• air vents
• window controls
• Steering wheel
• cruise control button
• bluetooth phone buttons
• music control buttons
• window wipers
• indicators
• headlights
• Main console
• odometer
• speedometer
• petrol level
• engine temperature
• gear display
• tachometer
• Center console
• hazard light buttons
• cd player
• sound system display
• air-con knobs (temp, in/outside air, on/off)
• air vents
• Center area
• cigarette lighter
• gear knob
• handbrake
• Below steering wheel
• brake
• accelerator
• clutch (manual)

What are the interactions of those components with the driver when driving?

• Rear view mirror (and flip)
  Check before driving, adjust during driving if needed
• Side mirrors
  Check before driving, adjust during driving if needed
• Steering wheel
  Turn left and right while in motion to direct car 
• Cruise control button (steering wheel)
  Set a constant speed when driving on highway
• Bluetooth phone buttons (steering wheel)
  Answer and end calls while driving
• Music control buttons (steering wheel)
  Adjust music type and volume while driving
• Window wipers
  Turn on and off, adjust intensity if raining
• Indicators
  Push up or down to turn on left or right indicator to signal change in direction
• Headlights
  Turn on or off as light levels indicate
• Speedometer
  Look at to ascertain driving speed
• Petrol level
  Look at to ascertain current petrol levels
• Engine temperature
  Look at to ascertain engine temperature
• Gear display
  Look at to ascertain which gear you are in (in concert with gear knob)
• Tachometer
  Look at to ascertain engine rev
• Air-con knobs (temp, in/outside air, on/off)
  Turn on/off and adjust settings
• Gear knob
  Change gear and tell you what gear you are in
• Handbrake
  Pull on or off to apply handbrake, generally while car is stationery
• Foot brake
  Apply pressure with foot to brake while in motion
• Accelerator pedal
  Apply pressure with foot to accelerate while in motion
• Clutch (manual)
  Apply pressure with foot to assist in changing gears

What would you test? How would you test?

One idea to replace an existing component would be to change how indicators are turned on or off.  Currently, there is a level attached behind the steering that you move up or down to indicate left or right.  Which way is left/right depends on where the car is made. Instead of a lever on one side of the steering wheel, the indicator could be incorporated into the steering wheel itself.  There could be a button on each side of the wheel (left = left, right = right) that would flash when on.  Having a flashing light on the steering wheel may also help when people forget to turn their indicator off.

One way to prototype this would be through an existing car with paper buttons on the wheel.  The user could drive through a set course (like a learning to drive area, not in real traffic) and try pressing the buttons with their thumbs to indicate.  The tester would look at how easy the button is to reach and access.  One problem with this testing is fighting against the ingrained behaviour to use the indicator stick.

Exercise 2: Alarm clock app

Features:

• Set, edit, delete multiple alarms
• daisy chain alarms
• set different tones for differnt alarms
• shake phone to snooze

Types of prototypes:

• Horizontal (wide range of features but no depth - can't tap to another screen)
• Vertical (can go down one action path, many screens but only one task)
• Diagonal (more functionality, multiple paths)

Week 2: Augmented reality prototype

Our class exercise for week 2 involves combining augmented reality with prototyping to present different interface or display options to the user for an object we would find in the home. We looked at an example of a washing machine interface where the user was able to interact with a physical dial but saw the display change through augmented reality interface.

One example I came across was from start-up Metaio who combined thermal sensors with augmented reality to create Thermal Touch.  Incidentally, it is also another example of a 'Kickstarter' style video for our video prototype.

My idea for an augmented reality prototype is for a light switch.  Regular light switches can be clunky to use, the switches can become sticky (neither off or on position) or require a lot of force to change their state.  The augmented reality prototype I propose combines both a physical and virtual switch.  The phycial part is the wall with a raised frame, similar to the box a regular light switch currently sits in.

Image from Flickr

The virtual part would be the dispaly inside the switch box which presents different options to the user.  Depending on what lighting options are available for a particular room (e.g. dimmers, number of lights), differnt formats could be tested on the display.  You coudl have a flat button that depressed, colour changes for off/on, a swipe motion to turn off or on (similar to the range of touch motions available on a mobile phone), or sliders for dimmers.  While some of these options may already exist, an augmented reality prototype would allow you to easily and quickly test different options for different user needs.

Week 1: What is prototyping?

A prototype is something that represents a product or an idea.  It can have elements of the final product and is something that people can interact with.

Prototypes can take multiple forms and be physical or digital, and can interact with any of the senses. There are many apps which produce high-fidelity computing prototypes, but it also be done using programs like keynote or powerpoint.  A great example of keynote prototyping is this example of Material Design transitions (including download).


Keynote does Material Design (Complete) from Andrew Haskin on Vimeo.

Prototyping doesn't have to be digital and can include things like paper, clay, or props.

Paper prototype being used.  Image via Johnny Holland.

An example of prototyping using the body storming technique.
Image via Flickr.

 How you make a prototype depends on what form it takes.

Prototypes are used to represent solutions, or part solutions, to specific design problems.  They show how a user would interact with a particular element of a design.

The purpose of prototyping is to collect data on your product through testing, on the user's experience and provide feedback as part of design thinking iteration.

Image from Stanford's d.school

It is best to prototype as early as possible, well before implementation, to allow time to go back and apply the things you learned from prototyping.  Prototyping should happen as many times as possible.