Interactions
Research and iterate around a key interactive element relating to the desktop browser experience. You will create an abstract website that—not only deploys your assigned interactive element—but gets to the essence of your assigned interaction:
- Hover
- Click
- Drag
- Scroll
- Cursor
- Type (Keyboard)
- Duration (Time)
- Show/Hide
- Resize
Randomly Assigned Interactions
Click on this link to see assigned interaction
Objective
Explore interactions that go beyond utility functionality and develop an experimental process through creative coding.
Project Schedule
| Feb 13 | Project kickoff |
| Feb 27 | Assemble a public are.na to an external site. channel of websites, artworks, texts, etc. which use your assigned term in a novel way. Come to class with:
|
| Mar 5 | Interaction prototype |
| Mar 12 | Working draft of site, iterate on interaction |
| Mar 19 | Site refinement |
| Mar 26 | Project due |
Your Website Should
- Clearly showcase your assigned browser technology/method
- Use familiar web functionality in an unfamiliar and original way
- Engage and entertain a user/subject
- Be aesthetically adventurous, original, and contemporary
- Actually work (No broken images. No missing libraries. No expectations of that your user imagine a certain behaviour)
Some Tips
- Iterate through code
- Work within your limits
- Be ambitious but if you're running into technical difficulties, find a work-around
- Use Google!
- Browse forums, GitHub, W3 schools, Code Academy, MDN for answers to your questions
- Share knowledge with your classmates
- Aim to make something that delights the user
Related Examples
If you're up to the challenge, adapt your desktop experience for mobile. Some may be more obvious such as click to tap and some not so much. For the more easily translatable interactions, can you find a mobile-specific interaction that relates to your concept?
Deliverables
- Abstract Site viewable via URL.
- Documented process viewable via URL. Must be a different URL from Abstract Site. Here's a template to get you started.
- Project files: HTML, CSS & JS (zipped)