Iconic

현재 모질라 Firefox에서 인턴으로 근무하고 있는 "Wei Zhou"라는 분의 Blog를 소개하고자 합니다.
Wei's Blog
이분이 하고 있는 프로젝트는 차세대 browser(부럽저)에서의 히스토리 및 북마킹을 조직화하는 멋진 방법을 찾는 것이 목표라네요...

백문이 불여일견 일단 동영상 감상 (사실 목소리에 반했습니다...) --> 여기
(동영상 중간에 한국 사이트가 나옵니다... 설마 한국어 하는거 아니겠죠?)

Bookmarking and History Concept Video from Aza Raskin on Vimeo.




아래는 이 프로젝트의 내용과 UI에 대한 철학이 담겨있는 블로그의 내용입니다.

[SCENARIOS]

Feature 1: bookmarks: Auto categorizing, sharing

Shot1: Alice works as a programmer in Google. She likes musics and movies. Today she finds an interesting music website: http://www.songbird.com.

Shot 2-5: She drags thewebsite to the top of the browser, the bookmarks menu drops down,browser automatically categorizes this website to MUSIC, names it as Songbird, records the time as 3PM, June 28, in Mountain View Google Cafe 40, sunny, and tags it as P2P music downloading website, records she was chatting with her mom on skype and listening to Whitney Huston’s album at that time. Alice clicks SHARE, and record a short video to her friend Joy. A message is send to Joy’s friend bookmarks.

Feature 2: Context awareness: integrate a website’s data(for this case is calendar).

Shot 6 - 8: Joy is a toydesigner in New York. She opens the web browser today andsearch:calendar. Her default Google calendar jumps out. She drags thewebsite onto the browser background, then her browser is in sych withher calendar data now.

Feature 3: A cool way to find a web page

Shot 9 - 11: Joy istrying to find an important document her boss sent to her on IRC, butshe lost the link .She switches the bookmark view to HISTORY view. Shetypes “yesterday, office, around 2PM, Boss sent to me” in the awesome bar. The web browser finds the link for her.

Feature 4: Enhance learning - Find related websites and recommended websites.

Shot 12 - 14: Joy types “facebook related”in the awesome bar, suddenly all the related web pages zooms in(Thoseweb pages are based on her browsing history, her friends browserhistory and her settings-she is a big music fan and she’d like toexplore more music websites). A cluster of websites jump out, in this3D space, Joy see big thumbnails like Myspace.com, twitter.com andyoutube.com, etc., she also sees the other tiny thumbnails of musicwebsites and toy-design websites which the browser recommend her toread.

Feature 5: Infinite scrolling

Joy is a curious person. She chooses allthe networking website and clicks”Open all in one tab”, then all thewebsites are shown within one page, she presses her figure on the touchscreen monitor and enter all the sites and scrolls down -  she checksall the sites in 5 mins.

Feature 6: Bookmark a timeline

Joy bookmarks the set of time she visited all the networking websites, next time she could just search “8 PM favorites sites ” to do the same surfing.

INSPIRATION

Thanks for the inspiration of Alex Faaborg, Mike Beltzner, Jenny Boriss, and Aza Raskin. They are my coolest co-workers! Thanks for Jesse Ruderman’s editing! I’m also highly inspired by Stumble and Clipmarks.  Jesse James Garret said my video reminds him of Sony PSP interface. You could trace back to my previous project 3D conceptual UI and understand why my UI design sometimes looks not like UI at all.

DESIGN THINKING

1. The best UI is NO UI.

When I worked in Microsoft, my boss Dave Vronaysaid this sentence to me many times, he used that as an example thatwhy so many people hate Microsoft products. He said if the UI componentis dominant on the screen, it’s gonna distract people’s attention allthe time and reduce their working efficiency.

Usability is not the only concern about the concept of “Zero UI“.We are not familiar with buttons and drop-down lists menus when we arestill a baby. We tend to grap things, drop things, pick up things in amore natural way (Terry Winogradsuggests that we interact with the world around us in three main ways:manipulation, locomotion, and conversation). When we focus on finishinga task, we never notice the way(interface) we approach the task. We areliving on a ZERO-UI world, so Mark Weiser brings about the idea of ubiquitous computing.

Zero UI is not “sleek graphics + silverborders + minimum interactive transitions”. We need to work very hardto make the UI system “invisible”, or invisible enough. That requires asolid understanding of a “Digital Life“.That requires sensitivity and reflection, and most importantly, we need great imagination.

In the last past 50 years, computerinvades our world truly like a monster. Sadly we built a bad habit - wegot used to a monster-UI style. We are like a guy in jail hanging outonly with guys, over 50 years, gradually lose the taste of real beauty.

ZERO-UI

• Users never notice the UI when they are working on a task
• Through the UI, they only see themselves, not the designer who design it.
• They feel happy using it
• They never think of how to use it, they just do
• When they stop working, eitherjust a glance, or a long-time gazing to the UI, they could beemotionally touched by the designer’s passion and love to her work.
• They forget they are working in a computer, and think about nature when they are using it.

2. Using 3D in a 2D’s way.

The challenge of navigating through a 3Dspace is that people get lost too often. People who loves 3D are CGpeople - Don’t know why simply press the alt key and use the mousenavigating brings so much satisfaction to me) .Unfortunately normalusers don’t. So far by reviewing a lot of 3D UI work, I found the bigproblems is: None of them are really making the 3D space”useful”. Theyare so many 3D for showing off purpose, 3D for thinking out of the box,3D for getting people’s attention. So the question is: How do we benefit from the form(3D) to make the content(2D) more intuitive?

Combining 3D and 2D

• Never move X, Y, Z at the same time.
• Avoid forcing users to navigate through 3D space, if the purpose is to show off.
• When users begin to get lost in 3D space, immediately switch back to 2D navigation.

3. No buttons.Only use buttons if you have to use it.

4. Touch. Stimulating 5 senses in a subtle way.

5. Devotion. Good design should make designers happy, too.

TOD

Special thanks to all the friends caring about Mozilla, I hope you could leave your real name for me to credit!

1. History can be sorted by time spent over a website

2. Tracking the amount of time you spend on certain web sites may help people realize they have a surfing addiction.

3. Content could be tagged and the relationship between tags could be represented in the form of a graph

4. Images could be searched by predominate color or range, or combination of colors

5. It can also describe what the bits of information look like,similar to files, they might have an icon associated with it. Theenvironment can take all of this information and interpret it intoobjects in its world.

6.build layers on top of the familiar html web page.

7.enso comment

8.Name the timeline “life stream”.

9.search words pan out of the web page

10. non-linear timeline

11.build mental model for different reason of bookmarking

12.sub-categories

13.ambient light