Project: Designing for a Pressure Sensitive Keyboard

Back to CPSC 581 home

Worth: 20%

Sketch, design, implement and document via a portfolio an interface that creatively exploits the capabilities of a pressure-sensitive keyboard.

This is an exercise in creativity, where you will design, implement, document and demonstrate an interface that creatively exploits the capabilities of a pressure-sensitive keyboard. This keyboard is an experimental Microsoft prototype - only a few are in existence today. Thus no interfaces exist (except for a few demonstrations) that use such a keyboard's capabilities. See a video illustrating the hardware.

This unconventional hardware was deliberately chosen, as there is no obvious solution to how to exploit such a system. Nor are there other examples out there that you can easily copy, excepting for a few simple demonstration applications (see video) . Thus it is up to you to be as creative as possible.

The hardware was developed for the ACM UIST contest, where contestants will have their systems judged at the ACM UIST Conference (October 4-. Victoria BC). We are officially entered - if suitable, we may submit our best system to the contest (there is a prize).

To prepare for this assignment, you will learn techniques on: how to brainstorm and refine ideas via sketching, how to program in WPF, how to program the keyboard, how to create a portfolio entry displaying your results.

Pedagogical Objectives

  • Apply basic sketching techniques and lateral thinking to produce various designs
  • Acquire first-time experiences brainstorming ideas via sketches in a sketchbook
  • Learn how to implement, package, install and document WPF programs
  • Acquire first-time experiences creating a portfolio web site and summary

Assignment Deliverables and Details .

  1. 10 competing design sketches, 10 sketch details, and sketch refinements. In your sketchbook, generate at least 10 competing (different) designs of a system that exploits this keyboard. Show and explain your design(s) to others. You will know which ones are the most exciting by how you talk about them and how others react. Choose the most promising one, and then produce 10 details and/or variations of a particular sketch in your sketchbook. You will be asked to briefly present your best one. As your ideas change, sketch them out. You will be asked at any time to show your sketches to the instructor, TA, and/or the class.
  2. An implemented WPF application. Implement a WPF application that demonstrates how your system works.
  3. Poster portfolio summary. Create a paper-based visual summary (it should be easy to carry and show, e.g., no larger than 18x24) that illustrates your system. Provide a title, minimal text (perhaps as annotations), and visuals that reveal what this is about. Emphasize the visuals over text - let it tell its own story. Don't feel bound to flat paper or a poster - you can have things unfold, have set of pages, overlays, use a box or other packaging, re-purpose stationary and art materials, etc. Have impact.
  4. Web portfolio. Create a web site that will contain all your portfolio summary. Include a brief introduction to yourself and (if you prefer) a photo. Make it engaging. For ideas, Google design portfolio and art portfolio. Also see Artist Portfolio Guidelines for some hints on portfolios and how they are used.
  5. Portfolio summary. Within this web site, create a portfolio summary of your project that documents your design and implementation in a visually appealing manner. Note that this may become your standard style for other summaries. The portfolio must include:
    1. a front page with an illustrative image, description and index
    2. an illustrated and annotated sequence describing your button. Avoid lengthy text. Use visuals as much as possible, e.g., screen snapshots, animation, video, etc.
    3. a download page containing the complete source and executables, and instructions for running the sample and/or inserting your control into an application, and the API for the control
  6. Demonstrate your work. During class time, you will be asked to demonstrate all the above work to other class members and the instructor

Project-specific schedule (tentative)

Sept. 9 (Wed):

  • Project given out.
  • Homework: You begin sketching 10 designs, plus 10 details.
  • Tutorial: WPF basic tutorial begins.

Sept. 14 (Mon):

  • You: present best sketch to class (I will photograph and project it) / Design crit.
  • Tutorial: Pressure sensitive keyboards, and more WPF examples
  • Homework: evolve your sketch, start working with C# / WPF / Keyboard

Sept. 16 (Wed)

  • You: Exchange latest sketch with classmate. Critique / expand other person's sketch
  • Tutorial: More WPF examples
  • Homework: Flesh out your sketch. Start coding to see what is possible

Sept. 21 - 23, 28

  • Tutorial: More WPF examples as needed (advanced); using MSI
  • You: In class development: discussion of techniques / problems
  • Homework: Continue coding; final sketches. Work on portfolio.

Oct 5 (Monday)

  • You: Project demonstration (On-line and paper portfolio, system, design crit)


  • UIST Contest Web Site not only details the contest, but provides several videos illustrating the keyboard and sample ideas
  • Sample code illustrating how to access keyboard events
  • Sketchbook
  • Visual Studio 2008 (including WPF)
  • Portfolio supplies as needed


Your grade will be based delivery of sketches, your design creativity, your implementation, documentation and packaging, and your portfolio summaries (paper and electronic). However, great successes or failures, or incompleteness in one exercise criteria will likely affect your total grade. Note that a successful implementation is required: if you cannot demonstrate your system, you will automatically receive a zero. Similarly, missing or incomplete work will result in a large grade penalty.

Lateral thinking

seeking to solve problems by unorthodox or apparently illogical methods. It is about moving sideways when working on a problem. It encourages people to apply different perceptions, different concepts and different points of entry to problem-solving.

Your first thoughts will be something that is fairly derivative of what you can normally do with a keyboard, e.g., use pressure

  • to influence font size / grey level,
  • to influence key press attributes like key repeats.
  • as a games controller to affect other dimensions (e.g., to extend existing properties of arrow keys, etc.)

Start thinking about unconventional things. Begin with other output, e.g.,

  • visual non-textual output (can you paint with this keyboard)?
  • sounds (can you use this as an instrument)?
  • patterns (can you use this as a password system)?
  • games controller (can you use this to create a very unconventional / novel game specifically designed around these properties, as was done with the WII)?

Start thinking about it as a pressure pad rather than a keyboard

  • what if it was under a foam pad, and people could walk and/or sit on it?
  • what if it was placed in a pillow on a bed?
  • what if it was under a tight shirt that a person was wearing? Would it capture them breathing?

Start thinking about it as a mechanism, where you could attach things to it

  • what if you could attach objects to each key or combination of keys (e.g., by clay)?

Use serendipity. For example, go to Google Images, and type in some words. For example, I typed in 'Fun' and then looked at the images and asked What in these images could inspire some action with this keyboard? The key is to generate many ideas. Most ideas will stink or will be undoable. Others may have promise, and will cause you to think in new directions. Some examples:

  • Immediate idea: use the keyboard to affect the graphical design of an image. Perhaps by how I type, the circle will grow, change its shape and color, the letters will animate in different ways...
  • Extended idea: generalize it to animate graphical design properties, to have them react to what you do.
  • Immediate idea: use the keyboard as a type of wa-wa foot peddle that affects the sound characteristics as I play
  • Extended idea: use the keyboard as a foot control to augment some other input
  • Immediate idea: Create a typing game between multiple people, where they have to coordinate their actions. For example, whenever a person presses a key, a bubble showing that letter appears, where the bubble size depends on the pressure. The other person has to type the same letterto match the pressure. If the two pressures stay the same for a certain amount of time, the letter is entered into a textbox (i.e., typed). If they don't, the bubble will pop.