top of page

The Me Button

Sketch, design, implement and document an application where the central interaction is with a button, such that the interaction represents some aspect of your client’s personality or character.

Contributions

Base Sketches:

We each contributed 3 that we came up with and drew, and the last one (the stick story) was a combination of ideas from us that Tian drew.

​

Refinement Sketches:

We each chose one idea from our 10 that we presented and drew 10 refinement drawings. Spencer chose Speeder button, Macks chose the stick story, and Tian chose the Tag button. We ended up choosing Tian's idea, but I presented my refinement idea's on stick stories.​

Implementation:

We all worked together to implement the site, such as choosing teams, the rules, the timer, Alert Sounds. We did the recording together to film our demo video, and then Tian put the Video together.

Zombie Tag

The Me Button - Zombie Tag leverages a touch screen and the user’s body as the button interface. Our motivation is to design and build an interaction not only between the users and the interface, but also among the users. Inspired by the highly social and interactive tag game, we want to use this interface to improve the classic game with clear role identification, audio announcement, and a timer. 

 

This project is a browser based tag game where there are two sides, Zombies and Humans. Zombies are the ones that hunt and tag the humans, while the humans try to run and escape. The game lasts 300 secs (5min), and if there are no humans remaining, then zombies win. Otherwise if at least one human is left, then they win.

Code

Click here to play!

10 Concept sketches

Let Me Sleep
Gacha
Allergies
Olympics
Tag
Traveling
Animation
Procrastinate
Wake the Bear
Speeding

These were our groups 10 base sketches, where we each drew our own 10 ideas, to which we then proceeded to pick the 3 we liked the most from our own drawings, and then our groups most liked idea.

These sketches above are the 10 base ideas we chose to present to the class. I chose my three (let me sleep, gacha game and allergies) because they were the most unique and told something about me. I voted to pick the Tag idea from Tians because it was very unique and I thought no one else would think of it.

10 Refinements

Frame by frame
Presentation
one of us
fire ball
game
flip
VR click
click
242951342_189931003272934_2472417604667628513_n
Zombie Tag

The three ideas our group chose from the 10 concept idea's were click based animation, Speeding car, Tag. Here we each chose 1 idea to refine. I chose to refine a click based animation, I focused on both how to portray a story using clicks and what story to portray. These 9 of these 10 refinement sketches are my refinement ideas. Afterwards we all met and showed off our refinements. As a group we came to the decision to choose Tian's Zombie Tag refined idea as it was the most unique and we thought it would be fun to create. One of my 10 refinements was the base idea for our site.

Sources and material:

bottom of page