Inspiration from The Edge: New Patterns for Interface Design

Slide 1: Inspiration from EDGE INTERFACES the Edge Stephen P. Anderson

Slide 2: I HAVE I NEED Free Listing (27) Usability Capture Software (30) Ecosystem Visualization (24) Sketchboard (31)

Slide 3: Interface design.

Slide 4: CONSULTANT Interface design.

Slide 5: CONSULTANT DIRECTOR, UX Interface design.

Slide 6: CONSULTANT DIRECTOR, UX Interface design. VP, DESIGN

Slide 9: How has the iPhone interface influenced web/desktop application interface design?

Slide 10: http://widowmaker.kiev.ua/checkbox/

Slide 11: THIS PRESENTATION: New sources of inspiration for interface design

Slide 12: THIS PRESENTATION: New sources of inspiration for interface design Not as much about interaction design

Slide 13: Where do YOU get ideas for your interface designs?

Slide 14: Just say ‘NO!’ to... DEFAULT THINKING

Slide 15: Building an online booking tool for a major airline... You would look at... 1 IN T K L G IN U H A EF D

Slide 16: Building an online booking tool for a major airline... You would look at... other airline sites! 1 IN T K L G IN U H A EF D

Slide 17: Building an online booking tool for a major airline... You would look at... other airline sites! and maybe... ? 1 IN T K L G IN U H A EF D

Slide 18: D EF H A IN U K L IN T G 1

Slide 21: novation No. 5: Look To Other Industries For In ility hygiene, you can mov e on to a basic level of usab Aer — and only aer — you’ve achieved . Web strategists need to keep a watchful nality to your site ad ding innov ative content and functio industry rivals for innov ative design yond immediate eye on the compet ition, but should look be g it wrong.14 But, more importantly, your ors may be gettin t the types of ? Frankly, your competit ...look beyond immediate industry rivals for innovative eas.13 Why es their expectations abou id dustry, which rais customers visit W eb sites outside of your in ain intact when they com e to your site. ex design ideas. Why? Frankly, your competitors may be periences the Web can provide, ex pectations that rem and finding inspir ing, relevant innovations is challenging. of Web sites is enormous, ces most relevant getting it wrong. But, more importantly, your But the universe structured process to nar row your search an d focus on the best practi Follow this customers visit Web sites outside of your industry, to your own business: rpose of your Web site? D ot-coms hat’s the main pu ’s strategic objectives. W which raises their expectations about the types of · List your site rough online transaction s, while the create revenue th like Amaz on.com and eBay exist to sites — like some big nam e retailers and experiences the Web can provide, expectations that mai n purpose of other seem ingly transactional erships. Whether en to drive custom ers to local stores or deal remain intact when they come to your site. au tomotive OEMs — is o reinforcing you r company’s Brand Imag e, being explicit it’s prov iding easy self-service or ovative practices. ts will help focus your search for inn list of online about why your site exis ur objectives. Compile a that align with yo · Determ ine specific capabilities es. For example, if your si te exists to drive strategic objectiv capa bilities that support your line features, including fo rms for ust provide some base ansaInnovations en it mOf Your Industry" Forrester, November 3,a2005 saction engine, help, ctions, th online tr Web "Hunt For Outside n, privacy and security policies, tran atio entering personal inform a transaction. and the ab ility to track the status of ity. Start your search wit h companies l in each capabil · Focu s on industries that exce ith each capability that yo ur site needs to als directly align w ivacy and whose main business go ould excel at providing pr al services firms sh prov ide. For example, financi ancial services sites will uncover some quick survey of fin y policy at ING security information. A e well-documented privac so a few gems, like th

Slide 23: 2 IN T K L G IN U H A “This is my toolbox” EF D

Slide 24: “default thinking”

Slide 25: THIS PRESENTATION: New sources of inspiration for interface design WHAT SOURCES?

Slide 26: Desktop Software Web Apps Web Sites

Slide 28: http://www.slideshare.net/dansaffer/new-sources-of-inspiration-for-interaction-designers http://www.slideshare.net/sarah.allen/cinematic-interaction-design Architecture, Film Cinematic Interactions & Mechanical Objects Sarah Allen Dan Saffer http://www.slideshare.net/kaeru/playful-ias-euro-ia-summit-2007 Game Theory http://www.slideshare.net/billder/de-rouchey-conversations-with-everyday-objects Kars Alfrink Amy Jo Kim Everyday Objects Desktop http://www.shufﬂebrain.com/etech06.htm Bill DeRouchey Software Web Apps http://www.inkblurt.com/2006/04/01/clues-to-the-future/ http://www.slideshare.net/bokardo/psychology-of-social-design/ Web Sites Youth, Online Social Design Andrew Hinton Joshua Porter http://www.nathan.com/thoughts/MakeItSo.pdf http://www.slideshare.net/blackbeltjones/designing-for-spacetime-ixda08 Sci-Fi Interfaces Space-Time Continuum Nathan Shedroff & Chris Noessel Matt Jones

Slide 30: THIS PRESENTATION: New sources of inspiration for interface design WHAT SOURCES? Interfaces that are often overlooked or go unnoticed

Slide 31: 3 Quick Comments

Slide 32: 3 Quick Comments psst... I ’m trying to get ahead of the “yeah , but...” comments

Slide 33: 3 Quick Comments 1. With new technologies, almost anything is possible! trying to get ahead of the “yeah, but...” comments

Slide 34: INTERESTING Hard ware CHANGES...

Slide 35: Cloud Computing Prism INTERESTING Sof tware XUL CHANGES...

Slide 36: 3 Quick Comments 1. With new technologies, almost anything is possible! 2. Natural behaviors are superior to learned behaviors. trying to get ahead of the “yeah, but...” comments

Slide 37: A scrollbar, really? Why are we pulling down to move a document up?

Slide 38: A scrollbar, really? Why are we pulling down to move a document up?

Slide 39: A scrollbar, really? Why are we pulling down to move a document up? ley/1424586876/ http://ﬂickr.com/photos/wendycop

Slide 40: 3 Quick Comments 1. With new technologies, almost anything is possible! 2. Natural behaviors are superior to learned behaviors. 3. ...except where the learned behavior actually makes me feel (and perform?) better. trying to get ahead of the “yeah, but...” comments

Slide 42: 3 Quick Comments 1. With new technologies, almost anything is possible! 2. Natural behaviors are superior to learned behaviors. 3. ...except where the learned behavior actually makes me feel (and perform?) better. trying to get ahead of the “yeah, but...” comments

Slide 43: Anything you want to, do it Wanta change the world? There's nothing To it -Willy Wonka

Slide 44: CONTEXT: (Where this became important...)

Slide 45: Project “Crazy Quilt”

Slide 46: “Project Crazy Quilt” integrate dozens of existing applications (some web based, some desktop) each with wildly different UIs, some redundant functionality, and no information architecture support power users & newbies, small businesses, as well as enterprise companies! be infinitely customizable at the Project user & business levels deployed worldwide to broadband “Crazy Quilt” and dial-up clients (and so on...!)

Slide 47: INTERFACE CHALLENGE: How do we ‘stitch together’ a dozen independent applications?

Slide 50: SUGAR OS FOR THE XO LAPTOP:

Slide 51: (Video demonstration of the Sugar OS)

Slide 52: +

Slide 53: Connection?

Slide 54: “Hub & Spoke” Connection?

Slide 55: Area 1 Area 2 Area 3 Area 4 Area 5 Option 1 Option 2 Option 3 Option 4 Where I am. Option 5 Options 6

Slide 56: Area 1 Area 2 Area 3 Area 4 Area 5 TE RN Option 1 G PAT ! ON Where ATIONS Option 2 W R Option 3 PP Option 4 LIC I am. OR A Option 5 F Options 6

Slide 57: Where I started What I can do next Where I came from Where I am. What I can do next What I can do next

Slide 58: _ _ Navigation! _ Activity Focused

Slide 59: Geographical Places Building Interiors, Caves, etc.

Slide 60: Geographical Places Building Interiors, Caves, etc.

Slide 61: Persistent Global Controls Geographical Places Building Interiors, Caves, etc.

Slide 62: Persistent Global Controls Geographical Places Building Interiors, Caves, etc.

Slide 63: Map, News, Character Stats Persistent Global Controls Geographical Places Building Interiors, Caves, etc.

Slide 64: Map, News, Character Stats Persistent Global Controls Geographical Places Building Interiors, Caves, etc.

Slide 65: Map, News, Character Stats Persistent Global Controls Geographical Places Building Interiors, Caves, etc. Games

Slide 68: Map, News, ? Character Stats Persistent Global Controls Geographical Places Building Interiors, Caves, etc. Games

Slide 69: Map, News, Character Stats Global Popups, Profile, Navigation, News Persistent Global Persistent Global Controls Controls Various Geographical Places Applications Building Plug-Ins, related Interiors, Caves, tools etc. Context-Specific Games Tasks, Contextual Help

Slide 70: Map, News, Character Stats Global Popups, Profile, TAKEAWAY #1 Navigation, News Persistent Global Controls Look Beyond Persistent Global Controls Geographical Places the Surface. Various Applications Building Plug-Ins, related Interiors, Caves, tools etc. Context-Specific Games Tasks, Contextual Help

Slide 71: INTERFACE CHALLENGE: How do we accomodate all levels of users & deep customizability?

Slide 74: TAKEAWAY #2 Think Outside the (UI) Box.

Slide 75: http://www.adobe.com/products/air/

Slide 78: Learning from Games: HCI Design Innovations in Entertainment Software 1 2 Jeff Dyck , David Pinelle , Barry Brown 2, and Carl Gutwin 1 1 1 HCI Lab, Deptartment of Computer Science Department of Computer Science University of Saskatchewan University of Glasgow Saskatoon, SK, Canada, S7N 5A9 Glasgow, Scotland jeff.dyck@usask.ca; http://hci.usask.ca barry@dcs.gla.ac.uk ([18]), speed-coupled flying in Grand Theft Auto ([16]), ABSTRACT and radial menus in Neverwinter Nights ([11]). However, Computer games are one of the most successful application games do not just adopt; the competitiveness of the market domains in the history of interactive systems. This success and the expectations of the player communities lead game has come despite the fact that games were ‘separated at designers to produce both variations on old techniques as birth’ from most of the accepted paradigms for designing well as completely new ones. This paper is about the usable interactive software. It is now apparent that this innovations that have grown up entirely in the game world separate and less-constrained environment has allowed for – techniques and approaches that can now help to advance much design creativity and many innovations that make the design and usability of conventional applications. game interfaces highly usable. We analyzed several current game interfaces looking for ideas that could be applied HCI researchers have considered games before: in the early more widely to general UIs. In this paper we present four 1980s, Tom Malone looked at what makes games of these: effortless community, learning by watching, deep compelling and how these properties could be applied to customizability, and fluid system-human interaction. These applications [14]. In the ensuing 20 years, however, games ideas have arisen in games because of their focus on user have evolved enormously, but their progress has gone performance and user satisfaction, and we believe that they largely unnoticed. A second look at the design and can help to improve the usability of other types of interaction innovations – this time in modern games – was applications. long overdue. Keywords We have taken this look by carrying out a design review of Computer games, game interfaces, user communities, fourteen state of the art PC games from several genres. Our interface customization, interface design goal was to identify novel contributions that provide clear benefits to users in game domains, contributions that could INTRODUCTION be also be employed to help improve usability in Computer games are an enormously popular and successful conventional applications. In this paper, we introduce four type of interactive software. This success has occurred of these innovations: even though game interfaces and interaction paradigms are ! effortless community – games make it easy to form, very different from those of other applications. Because of join, and participate in communities of users; their focus on system performance over consistency, games ! learning by watching – games help people learn the have nearly always ignored the windowing systems, the application by watching ‘over the shoulder’ of more standard widget libraries, and the toolkits that define the experienced users as they work; look and feel of conventional systems. In this way, game ! deep customizability – games give users the power to UIs were ‘separated at birth’ from their siblings, and grew modify and extend any aspect of the UI, and allow up in a very different design environment. hci.usask.ca/publications/2003/games-gi03.pdf others; them to share those modifications with In particular, this environment does not place restrictions tem-human interaction – games communicate

Slide 79: Learning from Games: HCI Design Innovations in Entertainment Software 1 2 Jeff Dyck , David Pinelle , Barry Brown 2, and Carl Gutwin 1 1 1 HCI Lab, Deptartment of Computer Science Department of Computer Science University of Saskatchewan University of Glasgow Saskatoon, SK, Canada, S7N 5A9 Glasgow, Scotland jeff.dyck@usask.ca; http://hci.usask.ca barry@dcs.gla.ac.uk ([18]), speed-coupled flying in Grand Theft Auto ([16]), ABSTRACT and radial menus in Neverwinter Nights ([11]). However, Computer games are one of the most successful application games do not just adopt; the competitiveness of the market domains in the history of interactive systems. This success and the expectations of the player communities lead game has come despite the fact that games were ‘separated at designers to produce both variations on old techniques as birth’ from most of the accepted paradigms for designing well as completely new ones. This paper is about the usable interactive software. It is now apparent that this innovations that have grown up entirely in the game world separate and less-constrained environment has allowed for – techniques and approaches that can now help to advance much design creativity and many innovations that make the design and usability of conventional applications. game interfaces highly usable. We analyzed several current game interfaces looking for ideas that could be applied HCI researchers have considered games before: in the early more widely to general UIs. In this paper we present four 1980s, Tom Malone looked at what makes games of these: effortless community, learning by watching, deep compelling and how these properties could be applied to customizability, and fluid system-human interaction. These applications [14]. In the ensuing 20 years, however, games ideas have arisen in games because of their focus on user have evolved enormously, but their progress has gone performance and user satisfaction, and we believe that they largely unnoticed. A second look at the design and can help to improve the usability of other types of interaction innovations – this time in modern games – was applications. long overdue. Keywords We have taken this look by carrying out a design review of Computer games, game interfaces, user communities, fourteen state of the art PC games from several genres. Our interface customization, interface design goal was to identify novel contributions that provide clear benefits to users in game domains, contributions that could INTRODUCTION be also be employed to help improve usability in Computer games are an enormously popular and successful conventional applications. In this paper, we introduce four type of interactive software. This success has occurred of these innovations: even though game interfaces and interaction paradigms are ! effortless community – games make it easy to form, very different from those of other applications. Because of join, and participate in communities of users; their focus on system performance over consistency, games ! learning by watching – games help people learn the have nearly always ignored the windowing systems, the application by watching ‘over the shoulder’ of more standard widget libraries, and the toolkits that define the experienced users as they work; look and feel of conventional systems. In this way, game ! deep customizability – games give users the power to UIs were ‘separated at birth’ from their siblings, and grew modify and extend any aspect of the UI, and allow up in a very different design environment. hci.usask.ca/publications/2003/games-gi03.pdf others; them to share those modifications with In particular, this environment does not place restrictions

Slideshare.net (beta)