Your SlideShare is downloading. ×
Interactive Design and Jonathan Harris
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Interactive Design and Jonathan Harris

507

Published on

Published in: Design, Technology
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
507
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
0
Comments
0
Likes
2
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. Interactive Design by Danielle Sannuto Web Artist Jonathan Harris Illustrates How We Interact Online. Photograph. Digital Journal: A Global Digital Media Network. By David Silverberg. 5 Apr. 2008. Web. 15 Nov. 2010. <http://www.digitaljournal.com/article/252657>.
  • 2. Interactive Design is the design of systems (web sites, cell phones, appliances, devices, etc) that are intended to be utilized by humans • In 1986, both Bill Moggridge and Bill Verplank were the first to use the expression “interaction design” as a way of referring to user-interface design "Interaction Design." Wikipedia, the Free Encyclopedia. 21 Oct. 2010. Web. 12 Nov. 2010. <http://en.wikipedia.org/wiki/Interaction_design>. "Professional." Bill Verplank. Web. 12 Nov. 2010. <http://www.billverplank.com/professional.html>. “Lecture.” Bill Verplank. Web. 12 Nov. 2010. <http://www.billverplank.com/Lecture/>.
  • 3. Bill Moggridge became interested in this field of work through his participation in designing the form of one of the worldʼs first laptops • upon testing the first functional prototype, he became incredibly engaged in its software • he came to the realization that he would have to do more than just design the deviceʼs form in order to create the user experience; he would need to design the interactive part of it as well Introduction. Perf. Bill Moggridge. Designing Interactions. Web. 12 Nov. 2010. <http://www.designinginteractions.com/chapters/introduction>.
  • 4. BillVerplank is an interaction designer, who is mainly known for illustrating diagrams that represent the process behind building an interactive medium • he outlines 3 steps: 1. the user does something 2. the machine responds to that action a certain way 3. the user can unconsciously create a “mental map” of how to navigate through the system Verplank, Bill. "Bill Verplank." Interview. Designing Interactions. Web. 12 Nov. 2010. <http://www.designinginteractions.com/interviews/BillVerplank>. Verplank, Bill. Untitled Document. Digital image. Bill Verplank. Web. 12 Nov. 2010. <http://www.billverplank.com/Lecture/>.
  • 5. Key Principles • the key principle of interactive design is the user experience • thus the design of interactive mediums should be centered around its target audienceʼs needs and goals • this is known as “user-centered design”
  • 6. User-Centered Design (UCD) involves: • functionality: What do you need and want the system to be able to do for its users? examples: • with the ebay site you want your users to be able to buy, sell, browse and comment • a portfolio siteʼs function is to showcase someoneʼs work so it will be largely image based "User Interface Design." Wikipedia, the Free Encyclopedia. 14 Sept. 2010. Web. 12 Nov. 2010. <http://en.wikipedia.org/wiki/User_interface_design>.
  • 7. User-Centered Design (UCD) involves: • information architecture: How will all the functions and content of the system be categorized in an idealistic way so that the user can find what they are looking for most efficiently? examples: • alphabetical, chronological, geographical, topics, audience, etc. "User-centered Design." Wikipedia, the Free Encyclopedia. 31 Oct. 2010. Web. 12 Nov. 2010. <http://en.wikipedia.org/wiki/User-centered_design>.
  • 8. User-Centered Design (UCD) involves: • visibility: Can the user easily navigate their way through the site or system? Does the system make use of common visual indicators so that the viewer can easily figure out how the system works? • global navigation so that the user still knows they are within the same site from one page to another since it maintains consistency. They can also easily go where they need to without having to rely on the back button. • some kind of visual indicator that lets them know what page they are on examples: • the links should provide feedback so that the viewer knows it is an active button and in turn predict its effect "User-centered Design." Wikipedia, the Free Encyclopedia. 31 Oct. 2010. Web. 12 Nov. 2010. <http://en.wikipedia.org/wiki/User-centered_design>.
  • 9. User-Centered Design (UCD) involves: • aesthetics: Do the graphics fit the content of the system? Or does it overpower the content? Do the graphics enhance the user experience or complicate things? • you want your site to be visually interesting so that it enhances the user experience however, you still want it to be understandable for the user
  • 10. Jonathan Harris writes systems that analyze trails of information that people leave behind online, such as their personal information, feelings, thoughts, etc. • he then creates stories and draws conclusions from the data he collects Jonathan Harris. Photograph. The Wild Wild East Dailies. By David Everitt-Carlson. Blogspot, 20 Jan. 2010. Web. 14 Nov. 2010. <wildwildeastdailies.blogspot.com>. "Jonathan Harris: the Web's Secret Stories | Video on TED.com." TED: Ideas worth Spreading. TED Talks, July 2007. Web. 12 Nov. 2010. <http://www.ted.com/talks/jonathan_harris_tells_the_web_s_secret_stories.html>.
  • 11. Jonathan Harris check it out here: http://tenbyten.org/10x10.html 10x10. Photograph. Cool Hunting. By Josh Rubin. 8 Nov. 2004. Web. 14 Nov. 2010. <http://www.coolhunting.com/archives/2004/11/08/>.
  • 12. 10x10 • itʼs a simple and nice way to visually represent the top news and world events of that hour • the aesthetics and interactive part of it makes news a bit more exciting to read • the viewer is able to efficiently scour through the archive of news and make their own connections • clear information hierarchy as it ranks the top world events from 1-100; more important to least important • itʼs aesthetically pleasing yet still maintains the familiar elements of image and text as buttons, along with rollovers • the design doesnʼt take away from the content itself Harris, Jonathan. "About 10x10." 10x10 / 100 Words and Pictures That Define the Time. 2004. Web. 15 Nov. 2010. <http://tenbyten.org/about.html>.
  • 13. I want you to want me by Jonathan Harris & Sep Kamvar • an interactive installation that is displayed on a 56 inch touch screen, which is hung on a wall in low lighting conditions • finds a visually interesting way to represent the cultural phenomenon of online dating Harris, Jonathan, and Sep Kamvar. "Statement." I Want You To Want Me / by Jonathan Harris and Sep Kamvar. Feb. 2008. Web. 13 Nov. 2010. <http://iwantyoutowantme.org/statement.html>. I Want You to Want Me. Photograph. In The Space Between - Postscape Design Blog. 10 June 2008. Web. 14 Nov. 2010. <http://inthespacebetween.com/>.
  • 14. I want you to want me • broken down into 5 parts: who i am: displays peopleʼs descriptions of themselves that begin with the expression “I am...” what i want: illustrates what people are looking for in others snippets: presents the opening lines, closing lines, and tag lines to an individualʼs profile matchmaker: mathematically pairs off profiles based on their personality and what they are in search of breakdowns: visually represents the most frequent first-dates, turn-ons, interests, etc, that people have Harris, Jonathan, and Sep Kamvar. "Statement." I Want You To Want Me / by Jonathan Harris and Sep Kamvar. Feb. 2008. Web. 13 Nov. 2010. <http://iwantyoutowantme.org/statement.html>. Open Balloons Distort the DNA. Photograph. I Want You To Want Me / by Jonathan Harris and Sep Kamvar. By Jonathan Harris and Sep Kamvar. Feb. 2008. Web. 15 Nov. 2010. <http://www.iwantyoutowantme.org/movements.html>.
  • 15. I want you to want me I Want You to Want Me. Dir. Jonathan Harris and Sep Kamvar. Youtube. Museum of Modern Art, 17 Apr. 2008. Web. 12 Nov. 2010. <http://www.youtube.com/watch?v=GZUaXDm4qik>.
  • 16. Cultural Impact • our culture is becoming more technological each and everyday, as the need for self-expression and human interaction has moved online • social networking and the communication of thoughts has now become easier with skype, facebook, blogs, etc. • Jonathan just visualizes these human interactions in a new and interesting way • he heightens the overall user experience "Jonathan Harris: the Web's Secret Stories | Video on TED.com." TED: Ideas worth Spreading. TED Talks, July 2007. Web. 12 Nov. 2010. <http://www.ted.com/talks/jonathan_harris_tells_the_web_s_secret_stories.html>.

×