This was a solution for the second class assignment of the Interactive Design course at Yale. True to form, it was as open to interpretation and geared around generating outcomes to reflect our personal interests and curiosity as the first assignment was. The objective of this project was to build a website that showcased a typology.
The aim was to create a unique, engaging way of displaying or otherwise highlighting the qualities or characteristics of a typology. The content could be collected or created. After some preliminary research, I stumbled upon a few sites linked to people taking selfies. Yes, selfies. I had some really interesting leads for typology collections of people’s faces. After a brief discussion with the professor, Julia Novitch, I was challenged to endeavor to create my own collection.
For my typology, I decided to photograph my coworkers and friends and translate the images onto a website where they could interact with each other using facial expressions and body language. Once I solidified my concept, with less than a week of time to create the content for my typology and begin building the code, I got to work immediately recruiting my models—fellow designers, my roommate, even my boss. I set up a mini photo set in our studio, complete with a paper-roll backdrop and semi-professional lighting. The photography sessions were priceless! Some pretty ridiculous efforts were made in order to elicit different reactions from my participants. Once I had photographed and edited all the portraits, I then structured them in a 3-square grid where they could interact and, in a sense, communicate with the user and with each other based upon the user’s input. Each person has a normal state, a hover state, a click state and several different reaction states that can be activated by clicking on any other person’s image. I wanted to evoke curiosity of the user, so not every person will stimulate a reaction when a person when clicked on. There are a few surprises built in which make for a seemingly endless amount of outcomes. I was hoping by incorporating these surprises I would be able to a create rich experience for users that respond in compelling ways to changing inputs and configurations. I collaborated with Tim Ripper, to code this project.
At the time I was taking this summer course, we were also in the process of redesigning the website for our studio. With this in mind, I thought this could be an fun way to showcase the different personalities on “our studio” page of our website. Ultimately, we ended up modifying some of the code that was developed for this assignment and incorporated it into the final design.
Designed at Yale University
Professor: Julia Novitch
Assistant Professor: Tim Ripper