Back to Projects

Mouse Events

Overview

  1. In pairs of 2 create 50 buttons that respond to :hover or click.
  2. Still working in pairs, choose a single action (Click, Scroll, Hover or Resize).
  3. Develop a microsite which uses this—and only this—action to create a multi-sensory experience for users. Determine how best to work collaboratively to leverage your strengths, while engaging in all aspects of the project.

Douglas Engelbart presenting the Mouse in 1968

The aforementioned actions largely dominate the how we interact with content on the web. They are subconscious and ubiquitous means to an end. Because of this, their use has become overlooked, we know what to expect when we click on a link, scroll down a news feed, or hover on a button. But these expectations do not define the potential that these simple activities possess. For this project you will explore them not as typical ways to get to content, but as the content themselves. In a series of short exercises, you will dive deep and analyze each experiential consequence before, during, and after an action and push them towards profound results.

Use this prompt to push your chosen action to do something it would not typically do and you may not know how to do. Do not concern yourself with ‘best practices’ or how things ‘should’ work, but experiment with alternatives and stumble upon anomalies. A good project in this sense is not code-heavy and complex but nimble in how it connects simple scripts to create rich and engaging results.

This project dovetails into guest designer / instructor Minkyoung Kim’s workshop kicking off 10.26. More details to come.

Objectives

  • Increase your familiarity, comfort, and knowledge of foundational actions.
  • Introduce or expand knowledge using jquery to create dynamic experiences.
  • String together a complex, compelling, and engaging experience from a simple act.
  • Challenge and analyse the status-quo of how actions are typically implemented and how they might alternatively be used.
  • Break down sensory barriers to create multi-sensory and spatial experiences.
  • Explore activating unexpected elements on the screen.

Mouse pointer

Requirements

  • Create a page with 50 buttons that respond to :hover or click.
  • Develop a microsite showcasing one action (Click, Scroll, Hover or Resize) to create a multi-sensory experience.

Calendar

Week 6
T  - Kickoff
     Share 1 novel interaction
     Begin exercise in class
TR - 50 Results Review
     In groups choose 1 
     interaction, and start
     sketching websites

Week 7
T  - Review graphic 
     proposals for single
     action site
TR - Working Time / 
     Technical feedback

Week 8
T  - Single Action website 
     critique
TR - Workshop Kickoff
    

Grading

The outcome portion of your grade (not counting class participation and reading) will be divided equally between: 50 Result Charrette, Single action website, and workshop outcome.

Steve Jobs announcing the iPhone in 2007

Pinch zoom patent

Project

Step 1
Due Thursday Oct 11

50 Result Charrette: working in pairs develop a single page website which documents 50 possible buttons.

Step 2
Due Tuesday Oct 23

Still working in pairs, choose 1 of your results from the charrette and expand it into a full-fledged microsite. Focus on how simple events, and minimal code, can be sequenced together to make a surprising and rich website. Remember, the 'content' should be the interaction.

Project continued during workshop with Minkyoung Kim.

Today is Monday, the current time is 1585554004