home > aurora 

Ideas Sections:

aurora screen

Aurora Concept Video

Aurora is a concept video presenting one possible future user experience for the Web, created by Adaptive Path as part of the Mozilla Labs concept browser series. Aurora explores new ways people could interact with the Web in the future based on projected technological trends and real-world scenarios.

Additional releases coming soon: for updates, subscribe to our blog.  rss

Aurora: Concept Video Part 1


This video is best viewed in high definition. To view at 1280×720, press play, then click the HD button, then zoom to full screen and turn scaling off.

Welcome to the future — well, one possible future, anyway.

This is Part 1 of Aurora, a concept video created by Adaptive Path in partnership with Mozilla Labs. With Aurora, we set out to define a plausible vision of how technology, the browser, and the Web might evolve in the future by depicting that experience in a variety of real-world contexts.

The release of Aurora is part of the launch of Mozilla Labs’ browser concept series, an ongoing initiative to encourage designers and developers to contribute their own visions of the future of the browser and the Web. Over the next couple of weeks, we’ll be releasing more video segments, as well as background material showing just what went into imagining the future of the Web and translating that into a video.

Wednesday night, join us at the Adaptive Path offices here in San Francisco to celebrate the release of Aurora and get an advance look at some of the video segments before they’re released. Also, at Adaptive Path’s UX Week next Friday, we’ll be presenting a case study about the project. There are still a few seats available — use promotional code “BLOG” for a 10% discount.

Tomorrow on the Adaptive Path blog: How do you predict the future?


Credits for Part 1

Written and Directed by Jesse James Garrett
Producer: Julia Houck-Whitaker
Assistant Director: Teresa Brazen

Photography: Jean-Philippe Dobrin
Animation and Video Production by Whiskytree

Browser User Experience
Lead Designer: Jesse James Garrett
Design and Technology Advisor: Dan Harrelson
Visual Design: Kumi Akiyoshi and Sebastian Heycke
Production Support: Judd Morgenstern and Lin Lin

Web Page Design
New York Times: Andy Rutledge and Angela Conlon, Unit Interactive
National Weather Service: Dave Shea
Personal Weather Station: Alexa Andrzejewski

Cast
Jill: Danielle Thys
Alan: Byron Lambie

Comments

Aurora: Design Themes

Of all the ideas we talked about while designing Aurora, we kept coming back to a core set we considered essential, high-priority elements of the browser. These ideas clustered around four major themes:

Context awareness: Is there another product that has the potential to know as much about us as the web browser? Not only does the browser touch every aspect of our lives — our work, families, social connections, entertainment — but the data that flows through it is so semantically rich. If the browser paid attention to all that data, and also paid attention to our behavior as we interact with that data, it could find patterns and adapt itself to ease the difficulty of managing our interactions with the Web. Add to that the ability of the browser to be aware of your physical context, and the possibilities expand even further.

Natural interaction: Most of our interaction with technology involves levels of abstraction. Windows, menus, and toolbars are notional objects bearing little resemblance to real ones. The trouble is that dealing with all these abstractions is hard work, cognitively. The brain really wants to interact with a familiar system: the real world. So we designed Aurora to leverage natural interactions wherever possible, with objects in space or those with a sense of physics to them. The Mozilla team liked this approach as well: one of the core Aurora concepts, the spatial view, has already found its way into some of the work Mozilla is doing for Firefox Mobile.

Continuity: Another area that both Mozilla and Adaptive Path were keenly interested in exploring was the idea of continuity of the browser experience. We didn’t want to design different interfaces for desktop, handheld, and wall-mounted devices. We wanted to come up with a single, consistent interaction model that could apply no matter what size screen you were using, or what means of interacting with the device (mouse, touchscreen, gestural controller) you had at your disposal. Also, we wanted to explore how the Web experience could be seamless across devices — so people could move from one context to another, always picking up right where they left off.

Multi-user applications: The Web is something that people use together. But the browser has historically been a single-user application. A browser built with multi-user applications in mind could provide a platform for much of the functionality we now see being re-implemented and reinvented on a site-by-site basis. Collaborating simultaneously in a common space, sharing information with others, and recombining or remixing elements from the Web all become common, assumed functions of any website.

Comments

Aurora: Inside the Design Process and Concepts

I’ve written before about Adaptive Path’s open design sessions: regular open-invitation forums that allow project team members to draw on the perspectives of everyone at the company, and allow everyone to learn from projects other than their own. In a typical project, the team might have the opportunity to hold two or three open design sessions. For the Aurora project, we knew we’d need a lot more input than that. So we instituted weekly open design sessions, carrying us through from the earliest feature brainstorming to developing ideas for the visual design.

These sessions were an invaluable vehicle for collaboration between Mozilla Labs and Adaptive Path. Every Friday afternoon, we’d spend a couple of hours with a rotating group of contributors from Mozilla, talking through the design ideas we’d been coming up with, and seeing how those aligned with Mozilla’s own thinking about the future of the browser.

Early in the project, when we were still trying to give shape to the features and functionality of the future browser, these sessions were more freeform and speculative, and to an outside observer their connection to the ultimate design work may not have been obvious. But for us, this process was an invaluable tool in defining for ourselves the landscape of possibilities.

In between the open design sessions, Dan Harrelson and I would incorporate the input we’d received into our almost-daily collaborative work sessions. Usually, each of us would have some facet of the problem that had been nagging at us since the last time we met, and we’d take turns talking through those issues, sketching endless possibilities on whiteboards.

Much of this process involved questioning our own assumptions about what would and wouldn’t work. Although human behavior doesn’t change at a pace anywhere near that of technology, we did think that we could expect people to adapt some of their behaviors (and maybe adopt some new ones) as technology continued to evolve. The big question was which behaviors were long-term ones, and which were ripe for (relatively) short-term change. For every idea that made it into the final design, we probably discarded a dozen alternate approaches.

We found many of the design concepts difficult to document. Our usual tools like wireframes and mock-ups just seemed unsuited to an interface as dynamic as Aurora. Because so many of the conventions of interface design didn’t apply to Aurora, I developed a “design concepts document” that described the basic principles of how users would interact with Aurora and how elements of the interface would behave, so that Kumi Akiyoshi and Sebastian Heycke, who were responsible for the visual design of Aurora, could be sure they understood what we were trying to accomplish. This document evolved into a considerably simplified “interface guide” that summarized the various interface elements and how they work together.

For more detail on the Aurora design:
Aurora Design Concepts
Aurora Interface Guide

Comments

Aurora: Open Source Design

Working with Mozilla on their browser concept series gave Adaptive Path the unique opportunity to tackle a design project in the world of open source software. Joining an open source software project usually requires one thing: the ability to cut code. If you live in the world of functions, methods, Git, SVN, and SQL, you’ll find many a friend in open source. If you instead work with Photoshop, wireframes, sketches, and stickies, you’ll find it is a bit of a challenge to join an open source project. The community of developers has a history of shunning anyone who is a not programmer. Plus, open source software projects are not heavily promoted in the design community.

Adaptive Path and Mozilla are taking a stand to change that. The Aurora browser concept video is our first venture into the new world of open source design and, in keeping with both Adaptive Path’s and Mozilla’s core philosophies, we are sharing our insights into the design process and providing much of the original source material. Our hope is that others will be inspired to try their hand and release their own vision of the web browser of 2018.

The timing of this project could not be much better for galvanizing design participation in open source software. Competitions such as hack days put on by both large and small companies are including more and more design. We are seeing not only functional software come out of open source but also software that has a good design aesthetic. There is also more and more attention given to the user experience in software. I am especially interested in the intersection of UX and agile development. As user experience disciplines sync up with tried and true agile processes, developers and designers will both benefit by sharing their processes. An increased focus on UX overall will naturally increase its visibility in the open source community.

How can we continue to move design professionals onto open source projects? Along with partnering with big names like Mozilla, we can share our ideas in venues that get attention. Putting our experiences in open source design out into the world for public scrutiny can be daunting, but the pay off is a better understanding between designers and developers. I have already started my list of News Year’s resolutions and one of them is to join an open source project. After working on Aurora, I have renewed desire to seek out a project and make a real contribution. Will you offer you time and talent to open source as well?

Comments

Aurora: Web Page Design

Early in the process of planning the Aurora project, it became apparent to us that to showcase the browser of the future, we’d have to design the Web of the future. We decided this was a great opportunity to ask some of the smartest, most creative people doing Web design today to volunteer their time and contribute their perspective on where the Web is headed. We want to thank all of the designers for their contributions to the project:

Dave Shea was the first designer to come in on the project, and demonstrated extraordinary patience with our shifting requirements as we were finalizing the script. You can see his work throughout Parts 1 through 3.

Andy Rutledge and Angela Conlon of Unit Interactive contributed some innovative thinking and great visual style in their vision of the future of the New York Times in Part 1. (Andy has posted some thoughts on designing that page.)

Chris Glass tackled some of the most complex design work for Part 4. He also contributed a finished design for a sequence that was cut from the video late in production.

Our own Alexa Andrzejewski stepped in on short notice to deliver great designs for the personal weather station and the rainfall line graph in Part 1.

Comments

Aurora: Mozilla Labs’ Open Call For Design

Aurora is just one possible vision for the future for the Web. There are many others, including yours. Whether you want to build on our ideas, explore areas we didn’t cover, or demonstrate where you think we missed the mark, Mozilla Labs wants to see how you think the Web of the future would work.

Mozilla is already one of the most impressive and successful open source development communities in the world, and now they want to bring that approach to design through their concept series.

You don’t need actors and animators. The basic tools to create a video showing off an experience design idea are available to just about anybody with access to a computer. All you need is an idea and the desire to show people your vision.

We’ve always emphasized collaboration and openness at Adaptive Path, both in our engagement with the experience design community and in our work with our clients. We see Mozilla’s new initiative as a way to take that collaborative approach to thinking about experience to a whole new scale. Check out Mozilla’s call for participation, or jump into their forums to contribute your ideas to carry the experience of the Web forward.

Comments

Aurora: Random Notes

Just a few notes and points of clarification about Part 1 of Aurora:

  • This is not a demonstration of a real product. What you see in the video is a visualization of our ideas created by animators. Technologically, much of Aurora would be difficult or impossible to implement today. However, we expect everything you see to be possible in some form in the future.
  • We don’t expect this kind of change to happen all at once. There are many intermediate steps we’d expect interfaces to take between the present day and Aurora.
  • There’s a difference between “lots of stuff” and “clutter”, and the difference is relevance. In the spatial view, distance communicates time, but opacity communicates contextual relevance. If something isn’t relevant to what you’re doing right now in Aurora, it literally becomes invisible. When you change contexts — like moving from a music feed to a news site — the relevance of objects changes, and their opacity shifts accordingly.
  • The device Jill uses in Part 1 is real: It’s called the Novint Falcon, and it’s a 3D haptic controller. It not only allows movement in three dimensions, but it also simulates forces and textures. It’s currently being sold as a gaming peripheral, but we think it has the potential for broader applications. We didn’t work out exactly what the haptics of Aurora would be, but from the presence of the Falcon you can assume that it has some.
  • Yes, there are easter eggs.

Comments

Aurora: Concept Video Part 2


This video is best viewed in high definition. To view at 1280×720, press play, then click the HD button, then zoom to full screen and turn scaling off.

In Part 2 of Aurora, the browser goes mobile on a handheld touchscreen device.

Watch: Part 1


Credits for Part 2

Written and Directed by Jesse James Garrett
Producer: Julia Houck-Whitaker
Assistant Director: Teresa Brazen

Photography: Jean-Philippe Dobrin
Animation and Video Production by Whiskytree

Browser User Experience
Lead Designer: Jesse James Garrett
Design and Technology Advisor: Dan Harrelson
Visual Design: Kumi Akiyoshi and Sebastian Heycke
Production Support: Judd Morgenstern and Lin Lin

Web Page Design
Yahoo Upcoming: Dave Shea

Cast
Harry: Keith Shawn
Beth: Carolyn Grenier

Comments

Aurora: Interface Guide and Design Concepts

These two documents go into a lot more detail about the Aurora interface than we were able to cover in the video commentary:

Aurora Interface Guide
Poster-size interface guide

Aurora Design Concepts
Five-page design concepts document

Comments

Aurora: Forecasting the Future

Creating Aurora sometimes challenged us in ways we didn’t expect. In a typical design process, one of the biggest factors influencing the design is the set of constraints we have to work within — not just the limitations, but also the criteria for success for our work.

A good designer can create a design that accommodates all the constraints and still delivers an elegant, satisfying experience to the user. A great designer can go beyond this and create a design that demonstrates that some of those constraints weren’t really there to begin with. But when you’re designing for the future, all of your constraints are imaginary. Making smart choices about the constraints you create for yourself makes the difference between a plausible solution and science fiction.

But with a problem like designing the browser of the future, we weren’t even sure where to start. The evolution of the browser seemed to be intimately intertwined with the evolution of the Web — and to some extent, the underlying Internet — itself. Plus we had to account for trends in general computing technologies: smaller, faster, powerful, more connected and ubiquitous devices, enabling new kinds of interactions and applications.

To help us get a handle on all the possibilities, we asked Jamais Cascio to contribute some time to the project. Jamais is a professional futurist who forecasts trends for organizations that will drive their strategies on timelines quite a bit longer than the next quarterly earnings report. He co-founded the popular blog Worldchanging and runs his own blog called Open the Future.

Jamais called on a whole lot of smart people and led them (and a bunch more from both Adaptive Path and Mozilla) through a two-day workshop to forecast one possible future for browsers and the Web. Through a series of group exercises, we identified three major trends that we thought would have the biggest impact on the web:

  • Augmented Reality: The gap is closing between the Web and the world. Services that know where you are and adapt accordingly will become commonplace. The web becomes fully integrated into every physical environment.
  • Data Abundance: There’s more data available to us all the time — both the data we produce intentionally and the data we throw off as a by-product of other activities. The web will play a key role in how people access, manage, and make sense of all that data.
  • Virtual Identity: People are increasingly expected to have a digital presence as well as a physical one. We inhabit spaces online, but we also create them through our personal expression and participation in the digital realm.

Based on these trends, Jamais wrote three scenarios fleshing out the details of how these trends might come into being, and how they would manifest in people’s everyday lives. We wanted to use these forecasting scenarios to explore several aspects of this possible future world that we knew would never end up in our movie, but would provide us with some context for the design choices we’d be making.

Download:
Forecasting Scenarios

Forecasting Workshop Contributors:
Mike Beltzner
Rebecca Blood
Stowe Boyd
Leah Buley
Dawn Danby
Alex Faaborg
Henning Fischer
Jesse James Garrett
Dan Harrelson
Sebastian Heycke
Julia Houck-Whitaker
Mike Liebhold
Jessica Margolin
Peter Merholz
Lisa Rein

Tomorrow on the Adaptive Path blog: The technology of the future!

Comments

Aurora: Concept Video Part 3


Vimeo’s having a little trouble with their HD streams right now. HD version available soon.

In Part 3 of Aurora, we look at connecting the Web more closely with the physical world.

Watch: Part 1 | Part 2


Credits for Part 3

Written and Directed by Jesse James Garrett
Producer: Julia Houck-Whitaker
Assistant Director: Teresa Brazen

Photography: Jean-Philippe Dobrin
Animation and Video Production by Whiskytree

Browser User Experience
Lead Designer: Jesse James Garrett
Design and Technology Advisor: Dan Harrelson
Visual Design: Kumi Akiyoshi and Sebastian Heycke
Production Support: Judd Morgenstern and Lin Lin

Web Page Design
Product Detail Workspace: Dave Shea

Cast
Patrick: Alex Ochoa
Moira: Rebecca Blood

Special Thanks
Ambassador Toys, San Francisco

Comments

Aurora: Technology of the Future

In the future, everything will be better. No, really! For the Aurora project, we assumed steady and significant improvements in every relevant aspect of computing technology. We didn’t speculate about the means by which these advances would be achieved, because our focus was really on the experiences the technologies delivered, not the technologies themselves.

More processing power means the browser could do more sophisticated on-the-fly analysis of user behavior patterns. More storage capacity would enable the browser to have a longer memory, potentially recording the user’s every interaction with the Web at a high level of detail. More bandwidth would mean both processing power and storage capacity could be supplemented across the network. (Of course, the privacy and security implications of these advances are not insignificant; we projected, optimistically, that there would be improvements in these areas as well.)

One particular area that we thought would have a significant impact was the improvement of graphics capabilities in computing devices. After years of high-performance graphics processors being specialized tools for games and 3D artists, developers are starting to discover the power of these processors for other applications. Apple has applied animation, transparency, and other visual effects for years to give OS X its high-gloss sheen. (Microsoft’s recent effort to follow suit with Aero, the interface for Windows Vista, was met with less enthusiasm.) For Aurora, these graphics capabilities meant the experience could be more dynamic and visual than the Web we’re used to.

Tomorrow on the Adaptive Path blog: Creating the look of Aurora!

Comments

Aurora: Your Web Wherever You Are

A foundational concept within Adaptive Path’s Aurora browser vision is that your web is always available. This idea is visualized in the video when the New York Times’ article Jill is reading on her desktop computer later appears on her mobile device.

What do we mean by your web? With advances in computational power and limitless storage, we envision a future where everything you do online is recorded and available via any device. Your web includes your entire web history and all of your saved objects, be they people, data, sites, etc. All of this information is saved to the “cloud” where it is now available to any other computer connected to the Internet.

Combining months, years, or even decades of your personal history with the context of a device opens the possibility for real insights that help a user make the most of their surroundings. Take for example the personal route that MapQuest recommends based on the users’ interest in bike shops and a book title.

Simply authenticating with a new device provides users with instant access to the last state of their browser. The user interface will appropriately render your web to fit the device, everything from tiny screen on a watch to a wall-sized touch-screen. A critical concept is that while most users will have personal devices on which they interface with the browser, your web can be accessed via any device. Walk up to a public computer in an airport or a library, authenticate yourself, and the browser immediately has access to a user’s lifetime of web browsing. This would also work on other people’s devices, such as a friend’s mobile or television.

We envision that the vast amount of personal information available to the browser will create powerful trend and recommendation engines that applications can utilize for future needs. For example, a decision that a user made months ago on a home computer can instantly inform a travel planning web app accessed on a mobile device used at an international airport.

It’s your web and it’s always up-to-date and always available, wherever you are.

Comments

Aurora: Concept Video Part 4


This video is best viewed in high definition. To view at 1280×720, press play, then click the HD button, then zoom to full screen and turn scaling off.

In the conclusion of Aurora, the browser goes home, moving to a large-scale, gestural interface.

Watch: Part 1 | Part 2 | Part 3


Credits for Part 4

Written and Directed by Jesse James Garrett
Producer: Julia Houck-Whitaker
Assistant Director: Teresa Brazen

Photography: Jean-Philippe Dobrin
Animation and Video Production by Whiskytree

Browser User Experience
Lead Designer: Jesse James Garrett
Design and Technology Advisor: Dan Harrelson
Visual Design: Kumi Akiyoshi and Sebastian Heycke
Production Support: Judd Morgenstern and Lin Lin

Web Page Design
Amazon Workspace: Chris Glass

Cast
Tim: Kamasu Livingston
Kelly: Noah Haydon
Samantha: Daphne O’Neal

Comments

Aurora: More Random Notes

A few more notes on some of the feedback we’ve received about Aurora:

  • Is Aurora a browser that takes on some of the functionality of the desktop? Or is Aurora a desktop environment that integrates access to resources on the Web? The answer to both questions is yes.
  • The moments where the system doesn’t quite work for people are there on purpose. In the future, technology is still imperfect.
  • We couldn’t tackle as many aspects of the Web as we would have liked. If we left out something that you think is important, it’s not because we thought it wasn’t. We had to set priorities, and we did that by focusing on the areas outlined in our design themes.
  • Remember, if you disagree with any of the choices we’ve made, propose your alternative solutions in the Mozilla Labs forums.
  • A few people spotted the G-Man, but did you notice the screenshot of Netscape 0.9? Or the agent from Knowledge Navigator?

Comments

Aurora: Complete Video (without commentary)


This video is best viewed in high definition. To view at 1280×720, press play, then click the HD button, then zoom to full screen and turn scaling off.

Here’s the complete Aurora concept video containing only the scenes of user interaction and leaving out the commentary segments. This version has some additional material connecting the four scenes together into a single narrative.

Video segments with commentary: Part 1 | Part 2 | Part 3 | Part 4

Comments

Aurora: Visual Design

Looking back at the seminal web browser Mosaic as we started visual design for the Aurora project, I was surprised to find that our present browsers haven’t changed much in the last decade. As you can see, the general functionalities are constructed with similar items such as URL field, bookmarking, back/forward button.

With Aurora, we envisioned a browser that provides a less static, more natural interaction — a direct and intuitive way to interact within the web, similar to the way we relate to objects in the real world. We came up with the following key concepts for the visual design of Aurora:

The visual aesthetic should convey lightness and simplicity. The spatial layout should feel clean, open, with an expansive three-dimensional space. The spatial view reflects events unfolding in real time. Archived items are presented at a distance while current items appear immediately in front of you, suggesting time and space. Objects invite you to grab them and are governed by real world physics with responsive feedback. Everything you see in the space is touchable. You can grab, drag, and drop in three-dimensional space. Objects are floating subtly in real-time and are seemingly influenced by gravity as well as other objects and time. Object groups are clustered by relationship and exhibit motion behavior reflective of their association. Colors are utilized as cues to different behaviors — highlights of different colors denote notification, clustering, drop zone. Shapes are used to differentiate objects such as people, places, and data.

Process

We began with the mood board below to capture the emotional characteristics of the browser’s look & feel. These images from the mood board reflect visual ideas that were explored: bubbles, dew: soft and organic yet structured ethereal entities.

We then explored shapes that felt playful and expressive. We created shapes that are associated with the function of things.

Explorations on the wheel navigation element:

Explorations of the spatial view and navigational look & feel:

Comments

Aurora: Writing the Script

Writing the script for Aurora turned out to be a tricky balancing act. We wanted to illustrate the interesting design solutions we had come up with, but we also had to provide enough context to make the solutions meaningful. We needed the movie to have a narrative flow and momentum, but it also had to cover a diverse array of interactions. And just to give ourselves an extra challenge, we set for ourselves the goal of avoiding what we considered to be the clichés of the design concept video: affluent mid-thirties professionals in sleek modern environments, or chic young urbanites out on the town.

As a result, we ended up spending a lot more time working on the script than we expected. Dan Harrelson, Julia Houck-Whitaker, and I went through several iterations of sticky-note exercises: first prioritizing the interactions we wanted to illustrate, then brainstorming user tasks that would involve those interactions, then trying to stitch the tasks together into plausible scenes.

We decided pretty early on that it was impractical to work all of these interactions into a single overarching story. Instead, we settled on three segments: one focused on using a desktop computer in a work context, one focused on using a mobile device in a social context, and one focused on using a large-screen home device in a family context.

Of these three, the mobile segment turned out to be far and away the most difficult. We developed and discarded idea after idea as we realized that each one focused too much on the functionality of the device, and not enough on the functionality of the browser. It was fairly late in the scriptwriting process, after we thought we had all the scenes plotted out, when I decided we really needed two mobile sequences: one oriented around location-aware services, and one around interaction between the web and the physical environment.

When we did our first timed read through of the script, we were dismayed to discover that it came in at nearly double our target length of six minutes. (The film industry has a rule of thumb that says a page of script equates to about a minute of screen time; this didn’t apply to us because our script contained long, complex descriptions of user interface behavior that would take just a few seconds to unfold.)

So I cut it down. And cut it some more. And cut it some more. Much of what I cut was dialogue, intended to provide a bit more context on what the characters were doing and to hint at some of the technological changes suggested by the scenarios Jamais wrote. Finally, I decided I’d cut too much. I went back and rewrote the script from beginning to end, reworking it so that certain lower-priority scenes could be included if we had time to do them (as a possible “extended cut” of the movie) but ensuring that the narrative flow didn’t depend on their presence. (Only one of these, the exchange between Harry and Beth about MapQuest, found its way into the final movie, which still ended up over nine minutes long.)

Scrivener was an enormously valuable tool in the scriptwriting process. I didn’t use all of its functionality, but it did provide vital, specialized tools above and beyond what a word processor can do. Next time, we’re eager to try out Celtx, for the functionality it provides to bridge the gap between writing and production.

As written, the script doesn’t accurately reflect what ended up on screen. Many of the interactions I described in the script just didn’t work when I saw rough versions of the animations produced by Whiskytree, and in a couple of places I had to rethink the interaction flow very late in production in order to make the interface consistent and realistic.

Download:
Aurora Script

Comments

Aurora: Designing the Mobile Experience

While we were designing Aurora, we thought about how the experience would scale and translate across multiple devices. For the mobile scenarios, we had to design something that would work on a multi-touch enabled mobile device.

As of today, almost all browser experiences are designed without considering the mobile user. Instead they are derived purely from the desktop experience. My colleague Rachel Hinman says: “I still believe most Internet experiences on mobile devices are broken and compromised, overburdened by interaction models and metaphors from the PC that simply don’t work on small devices. Yet so much of how we understand the Internet – and computing – is based on the PC legacy.”

I was given the task to translate Kumi’s design directions for Aurora from a desktop experience to a mobile experience for the video. My key concerns were to maintain functionality, consistency and respect for the constraints faced by a mobile user.

Since we wanted to design as realistically as possible, we had a prototype made in plastic that reflected the exact form-factor of the mobile device.

Prototype made in plastic (front)
Prototype made in plastic (front)

Prototype made in plastic side
Prototype made in plastic (side)

While iterating various designs on how Aurora would translate for the mobile experience, I always explored how it would look on the actual device by attaching a design print out on top of our plastic prototype. This enabled me to study the sizes and placement of the elements to provide an experience that remained consistent with both of the other Aurora scenarios: the desktop as well as the large-scale, gestural interface. Continue reading this post by Jesse that explores the design themes that drove the three scenarios.

Comments