improving interface design

Improving Interface Design

From: garrettdimon, 2 years ago

Improving Interface Design

View SlideShare presentation or Upload your own. (tags: interface design)

Web Visions 2007 Improving Interface Design Workshop


SlideShare Link

Digital Self-interface revised

Movie Reels MPAA

I finished what is a first run at visualizing the MPAA rating with motion and shape.  I have shown the transition of the user selecting MPAA rating.  The threads begin in a state, in this case a solid thread line upon entering the site.  Then the user selects the data they wish to view (MPAA rating).   Then the event triggers the transition to display the data.

I should have genre done tomorrow.  My next objective is to show the MPAA rating on a mouse over event and I think I will be able to have that done soon.

Beginning state of movie threads.

Transition.

End state.

Progress on Digital Self

I selected 10 people as my research objects. They are in different life stages and with different occupations. I traced their Internet browsing history to find some patterns. This is the most recent visualization I created. When you mouse over a persona, his/her browsing history will be visualized in flowing text clouds format. I am also thinking of using rich media, such like sounds or video to support my idea.

I plan to do this piece in processing, which allows me to manipulate the data in a more flexible way.

The pixel people are inspired by John Maeda's piece human encounter. The dotted colorful text coulds are inspired by Wefeelfine.

For now to serve the purpose of comparison of digital self and physical self, I plan to list the tags related to the website they visit, then ask the physical person to rank it, by comparing the order of the two sets of data, the audience will easily find the difference between the digital self and physical self.

Special thanks to Stacie for giving me the idea of "comparing tags"!

Movie Threads Storyboard

Here is a quick story board of what I am trying to hammer out in flash.  There are three main components to the interactive site: filtering sidebar, sorting, thread display window

Filtering sidebar: This will show the possible options from which to choose.  Grouped by: Sales, MPAA ratings, Viewer ratings, and Genre.  Depending on the selection option that data will be shown to the user.

Sorting: This will allow a user to organize the data in the most sensible way.  Either by: Sales, MPAA ratings, Viewer ratings, and Genre.  The sort will occur on the item selected and by selecting the same option again the order will be reversed.

Thread display window:  This will display the individual threads.  Each colored to indicate the genre group to which it belongs.  The thread fragmentation will indicate the MPAA rating (i.e. the more fragmented a thread the higher the MPAA rating).  

In the story board I show the instance which a user will select the sales data to view and then sort by the MPAA rating.  You can get the gist here.  Refer to my previous posts to the other viewable data.

Learning Flash

I just thought I would drop a quick line letting everyone know that I am working on learning Flash.  I will be posting late Sunday or on Monday.  Right now I have worked through a few tutorials and am focusing on learning the tool.  So, if you happen to have experience in Flash and would be willing to lend some advice, please let me know.

I should have some story boards up later today.

- JZ

Process

The goal is quite simple: Explore the difference between your real self in the society and your digital self on the Internet. The method is even simpler: by analyzing people’s daily browsing activities. I plan to build this piece by Processing(as usual), the final delivery will be an “artistic” interactive piece.

So what’s a Digital Self and why start from a web browsing history analysis?

People may scared if they realized that their browser knows themselves more than they do. The browser traced down every single activity you do on the Internet, that somehow reflects you as a whole slightly different than you are in the real world.

For example, here are some variables that may reflects your “Internet” personality.

Your most frequent visiting sites.

- If I ask you to list some favorite sites, the answer you give me might be different than the answer given by your browser. You may not realize why you actually spend 30 hours on Facebook monthly, that conflicts with your goal - study harder.

How long do you stay at a site

- Spending 10 hours shopping on Amazon and 10 seconds to check things on Amazon reflects different personalities. If we did a long-term research, you may find you are easily obsessed with one thing, or you may like to change your focus frequently. That’s a very interesting Internet personality.

Your browsing time

- This directly reflects your schedule, how busy you are.

Sites category you visited over time

- When you are relax and happy, you will visit a lot of sites you like, otherwise, if you are hitting a deadline, you will only visit sites related to your work. However the sites people visit reflects how they release their pressure, such as watching a cartoon after a long time work.

Your search result

- Reflects your curiosity

What do you tag or bookmark a page

- This may reflect your Internet self in a social context.

What much do you comment or upload things on Internet(In versus Out)?

- If you only get, never give, does that mean you have a selfish personality on the Internet?

…

It will be interesitng to build a framework for Internet Self Study, but I think that’s phychologists’ job.

Sebascion S's comments:

Good idea though I do believe Google has long ago started a search project on just that. I had a suggestion though; by categorizing pages and relating them with each other and perhaps pushing it further enough to relate them to moods, wouldn’t it be possible to form a happy pattern that could suggest pages to cheer somebody up(?). Come up with a colorful design that transpires joy(or perhaps color patterns that can be somewhat customized) that would show up in a cloud fashion the websites that would be interesting to the user. Is it possible to maybe add suggestions (delicious….) that would add up to this cloud and would be highlighted to show that they are suggestions.