|
|
| (8 intermediate revisions by 2 users not shown) |
| Line 1: |
Line 1: |
| − | =Session title= | + | =Session Title= |
| − | History & Future: Imagining the Web Browser of 2015
| |
| | | | |
| − | =Session summery=
| + | The History and Future of Web Browser UI |
| | | | |
| − | Discussion about next generation's web browser.
| + | =Summary= |
| | | | |
| − | =Materials=
| + | In this session we will discuss the events that led to the creation of the first Web browser, and its evolution over the last 28 years. This will be followed by exploring various potential directions Web browser UI might take in the future. |
| − | 1. Literature review.
| |
| − | *CHI archive about recent design trends.
| |
| − | *People's blogs talking about future web browser design
| |
| − | *Books
| |
| − |
| |
| − | 2. Demos, examples, stories.
| |
| | | | |
| − | 3. Thoughts on how to encourage people to talk.
| + | =Topics= |
| | | | |
| | + | '''History''' |
| | + | *28 years of Web browser UI |
| | + | *The complete UI evolution from Phoenix 0.1 to Firefox |
| | + | *Discussion of consistency vs. innovation and the theory of the Innovator's Dilemma |
| | | | |
| − | =Possible Topics=
| + | '''Future Directions''' |
| − | *What is a web browser now? What is a web browser in 10 years? | + | *Navigation |
| − | *Why web browser? Where does Internet go? | + | *Desktop Integration |
| − | *What hardware environment does a web browser run on? (desktop, cellphone, and..) | + | *Identity |
| − | *How smart a web browser can go? | + | *The Semantic Web |
| − | *Famous quotes about web browser.
| + | *The Read/Write Web |
| − | *How emotional a web browser design should go?
| |
| − | *User customization.
| |
| − | *Criteria of a good web browser.
| |
| − | *History: Web Browser's yesterday, today and tomorrow. | |
| − | *What direction does firefox browser should go?
| |
| − | *Popular UX design thoughts, how do we apply to web browser design.
| |
| − | *Challenge for developers, designers, and marketing people in the future.
| |
| | | | |
| − | =Design issues= | + | =Related Sessions= |
| − | *Mobile
| |
| − | *Content VS form
| |
| − | *Personal and Ubiquitous Computing
| |
| − | *Usability VS Aesthetics
| |
| − | *Semantics web
| |
| − | *Keyboard UI
| |
| − | *GUI improvement
| |
| − | *Media and browser
| |
| − | *Digital self
| |
| − | *Traditional printing display on web browser
| |
| − | *Cinema and browser
| |
| − | *3D web
| |
| − | *Detail:menus, fliters, plug-ins
| |
| − | *Video messaging
| |
| − | *Database and browser
| |
| − | *Computer science and browser
| |
| − | *Voice UI
| |
| − | *Design research
| |
| − | *user-centered design, participatory design
| |
| − | *...
| |
| | | | |
| | + | If you enjoyed this session be sure to check these sessions out as well: |
| | + | * [[Summit2008/Sessions/Proposals/Labs_Concept_Browsers|Mozilla Labs Concept Series]] |
| | + | * [[Summit2008/Sessions/Proposals/Mobile_UX|Mobile UX]] |
| | | | |
| − | =Agenda=
| |
| − | 1.Briefly introduce the history of web browser(Slides)
| |
| | | | |
| − | 2.Examples of new web browsers and analyze the trend(Slides)
| |
| | | | |
| − | 3.Our vision: Future browser mock-ups (5)
| + | [[Summit2008/Sessions/Proposals/History_%26_Future:_Imagining_the_Web_Browser_of_2015/Preparation|Preparation Notes]] |
| − | | |
| − | * A. Miner improvements: Integrating CSS style | fingerprint identification
| |
| − | | |
| − | Now: Browser's visual style never change; Users cannot remember users names and password.
| |
| − | | |
| − | Mock-up A: Show how the browser embed with different sites' CSS style; Show user tap the screen to log into a website(mock-up pictures)
| |
| − | | |
| − | * B. Social interaction
| |
| − | | |
| − | Now: Software/Digital devices are mainly designed by cost-reducing and benefits-increasing constrains, in a context of an individual use.
| |
| − | Future: Observe in a way the breakdowns of social links and a standardization of the human taste and behaviors, make the individual very interchangeable.
| |
| − | | |
| − | Mock-up B: Show the browser enhances inter-personal exchange and social share, including human computation on a social context(Scenario)
| |
| − | | |
| − | | |
| − | * C. Aesthetics in user actions
| |
| − | | |
| − | Now: When interacting with most existing softwares, our physical actions are still limited to pushing, sliding, and rotating. Current products ignore that we are capable of much more complex motor actions and thus do not fully tap our bodily skills. Consciously designing for human dexterity gives new aesthetic possibilities, which are still largely unexplored in design.
| |
| − | | |
| − | Future: Software/Digital products with self-powered, robotic parts, which are able to respond or even autonomously act through physical movements. The question now is whether such physical product movements could instead become a coherent part of human-product interaction, complementing existing forms of feedback such as displays and sound. Considering the coupling of user actions and product responses opens up a whole new design space in which factors such as rhythm, flow, timing, and richness of interaction play a role.
| |
| − | | |
| − | Mock-up C: Figure gesture controlling the browser(mock-up pictures)
| |
| − | | |
| − | * D. Mobility | Context awareness | Emotion | Personalization
| |
| − | | |
| − | Now:For mobile device, The quality of service is low and that mobile applications are difficult to use...
| |
| − | Future:Natural and intuitive M-interaction and fit so well with the contexts of use that users feel no skill is required to use the associated mobile device, with the ability to present, and allow users to interact with, content in a customized and customizable fashion.Device knows about you and your life in a considerate way, allowing the user to establish a relationship with the device. (Device functions as a digital being?)
| |
| − | | |
| − | Mock-up D:Show how the browser knows about you and help you to finish daily routine tasks. (Scenario)
| |
| − | | |
| − | * E. Present my video demo.
| |
| − | | |
| − | | |
| − | 4.Themes
| |
| − | | |
| − | 5.Conclusion.
| |
| − | | |
| − | =PS:Interaction design Trends(To be changed)=
| |
| − | | |
| − | We noticed there're some hot trendy topics in interaction community, we assume those thoughts could be applied into a FF x.0. But we cannot just follow, we need our unique vision. It is valuable to think about branding and marketing strategies as well as user experience.
| |
| − | ==Personalization==
| |
| − | | |
| − | Now as the web culture becomes both social and personal,Firefox survives today partially because it provides extensive add-ons and easy customization tools catering to individual needs. However ordinary users only understand the basic functions of the browser, not used to download plug-ins or customize their Web browser, which allows them only passive get, not actively browse the Web and fully enjoy the fun of absorbing information.
| |
| − | | |
| − | *Possible solution 1
| |
| − | | |
| − | Improve Firefox add-on site, using with a more humane manner to give users a certain package of their favorite plug-ins, say, for 20-24-year-old single women white-collar users, recommended a particular combination of firefox plug-ins, etc., including visual history viewer, bookmarks sharing, embedded calendar, and to recommend a bookmark list, including the facebook, NYT art, Fashion, Salon, and so on for their lift-stage. Another example for a 30-year-old java male programmer, recommend a package contains firefox Firebug, simplified interface, power user keyboard UI extension, and a bookmark list: slashdot, careerbuilder, so on and so forth.
| |
| − | | |
| − | *Possible solution 2
| |
| − | | |
| − | Make firefox smart enough to learn the user's daily behavior, building a user profile so that Firefox could gradually do personalization by itself.(Pop up a recommendation to install a extension when Firefox thinks you need it).
| |
| − | | |
| − | ==Context awareness==
| |
| − | | |
| − | Response to the user smartly in different circumstances, identify the user's needs and provide appropriate help accordingly. Note this "context" indicates not only real life,but also the "Internet life". Internet users build a digital self alone with their browsing activity, understanding this digital-self is equally important to their real self.As browser goes to mobile, browser calls for the feature to know what people need, for instance, provide coffee sites when users are in starbucks, pops up bank sites when users feel like they need to check their bank info immediately without typing in the URL.
| |
| − | | |
| − | ==Human computation==
| |
| − |
| |
| − | One of the best traditions of Firefox browser is a awesome community support, indeed there are many enthusiastic users find bug or improve the code. But most of them focus on the technology improvements, not many design improvements. To survive in web 2.0 , follow a user-centered design approach is very necessary to a browser design. This is not to say we should carry out a large number of user research and to make the decision quantitatively, but the use of a more relaxed and enjoyable way, enabling users to participate in the process of design, actively involve into firefox browser's development, concern Their own user experience, and be able to help each other, provide a large number of excellent idea to be adopted by the Firefox. During the process it generates a huge market and branding benefit, further more the countless human resources in helping to improve our Firefox, view the Internet in our own "firefoxy" way.
| |
In this session we will discuss the events that led to the creation of the first Web browser, and its evolution over the last 28 years. This will be followed by exploring various potential directions Web browser UI might take in the future.
