Mobile Design at Prismatic
At Prismatic, we design for iPhone, iPad, Android, and web on all major operating systems and browsers. The movement toward mobile-dominant design is not just about designing for smartphones or tablets, but also about the challenge of designing an experience across the different devices that people use every day. Although the experience should feel homogeneous in some ways, there is the further challenge of taking advantage of each device’s natural setting and unique potential.
After working in this environment for a while, it became clear that mobile design standards are mostly legacy desktop design with click events replaced by touch events. While this can give a feeling of consistency with desktop, we’ve decided to re-imagine structure and interaction entirely in terms of mobile touch devices, and then ask what we’d change about desktop to make it more consistent with mobile.
The legacy of the desktop GUI
Mobile touch experiences haven’t exactly ushered in a new wave of design thinking. Not much has changed since the GUI windowing systems of the early 1970’s - we’ve got pictures under glass with click events replaced by touch events.
The navigation bar is a great example of this. It’s been around for 40 years. A couple of early examples are the Xerox Star and the Xerox Alto.
We’ve found the navigation bar to be problematic because smartphones have small screens, and navbars hog precious pixels that could be used for content.
Our design philosophy is all about being content-centric, so we wanted to see if we could totally remove the use of the standard top and bottom navbars from all our products. We knew we wanted more vertical space to do better layouts with bigger images.
It took quite a while to arrive at a solution that appears to work. With that in hand, we naturally wanted to do the same on web - and not just for mobile web - because it yielded a more content-focused design with a better domain-specific navigation model.
Reimagining interaction
Why do we still have navbars everywhere? We got our answer as soon as we got rid of them. The navbar is a standard one-size-fits-all navigation metaphor. Eliminating the navbar means reimagining your product’s navigation interactions, because they all tend to live on the navbar.
Eliminating legacy structure and navigation violates user expectations. So if you want to do it, you need to have something else that’s more natural for your product, and you need to execute it perfectly.
Domain-specific navigation metaphors
Eliminating the navbar and reimagining the navigation interactions forced us to think deeply about what we’re building, talk to our users more, and focus our design around core scenarios. It also forced us to think about how to make core navigation fit the overall vibe of the product. We want Prismatic to feel fun and exploratory, and we’ve tried to imbue the navigation interaction with that vibe.
Prismatic is a news discovery product that focuses on finding new stuff. The more cool new stuff you find, the more you want to keep it organized, favorite it, share it, group it, etc. So you end up with these two modes of your stuff and finding new stuff. We decided to design around this core home-explore duality. Your home feed, your activity (read, shared, favorited), and your interests are all your stuff. The global feed, search, and suggested interests are all about finding new stuff.
A new generation of mobile products
Mobile is a great platform for helping thoughtful product companies stand out. The constraints are going to push us toward full screen content without navigation bars. Thoughtful domain-specific structure and navigation will be characteristic of the most successful mobile products of years to come. The new iPhone app, Clear, is one recent example of embracing full-screen content and experimenting with new interactions for a domains-specific problem.
Scifi is only fiction temporarily
When we decided to reinvent our navigation interactions. Our core idea was to create a touch interface that was very anatomical. We wanted something natural, that reacted like an extension of your fingers. When doing research on gestural interfaces with these properties, we were lead to scifi. For example, we found a bit of inspiration in some of the touch interactions found in the recent Iron Man films.
At first, we were worried that our ideas might be too crazy. As we continued our research, we learned that scifi and interface design have always influenced each other. Chris Noessel from Cooper has a great talk on the co-influence of Scifi and interface design. Chris has an entire book coming out on the subject in the summer of 2012.
We’d love to share all the details of our gesture navigation system, but you’ll have to wait for the iPhone launch and see it for yourself. It’s a whole new universe.