cooper

Journal   A blog about design, business and the world we live in.

Information design

Recent articles

Interaction13 – Day 4 Recap

Ah, the final day of IxD13 has come to an end. Day 4 was comprised of panels, debates, and rapid ingenuity cycles. It was a blast to cover this conference. If you missed any of the other days, check out our recaps from Day 1, Day 2, and Day 3. Can't wait to meet up again next year in Amsterdam!

Interaction Design Education Panel: Report Back

Dave Malouf, Haig Armen, Kristian Simsarian, Dianna Miller

IxDEdu ColorCheck

Demand for Interaction Designers has grown, but because IxD is so new, education programs are being developed independently. With no single organization curating a design education program, there is little chance for design educators to share information and techniques. This panel was brought together to discuss patterns in design education, and as a platform for designer educators to connect with each other.

How do we make IxD training more widely available?

Lots of small design shops don’t have budgets to send people to conference or for extra training. And a lack of guidance can lead to people to seek other employment. At the IxD13 Education panel, these were some of the ideas discussed to build skills without breaking the bank.

    Apprenticeship programs: (younger person paired with a senior designer) The junior designer would do smaller tasks and begin learn through doing.
    Partner with universities: Students gain real-world experience by working on client projects.. Design studios get fresh ideas and build relationships with future recruits.
    In-house training: How do you evaluate people’s aptitudes when they apply to an organization? Studios need better evaluation of applicants because people come with such mixed backgrounds.

There is a disconnect amongst what students think they are prepared to do, what they can actually do, and what employers want. Grads are not prepared to do high-level strategy. Many think they are, but it takes time to build that skill set.

Design fundamentals should be taught in middle and high schools, but if we can’t teach design curriculum in schools, we can host junior conference or 1 day UX Camps. Design principles are valuable to students of all ages. Design can teach people how to fail and how to take risks early in their development

How do we start to informally formalize where and how to find good teachers, mentors, programs, and studios?

We can spread good design education through our current network. Go to schools and give talks. As your relationship develops, schools will start to see you as a resource, and you can spread your design philosophy to new generations of movers and shakers.

Read More

The wrong projection

On a recent flight from Amsterdam to Houston, I turned on the “moving-map system” in the in-seat entertainment system and was surprised to see that though we were halfway through the 10-hour flight, the map made it look like we were minutes from landing in Texas. Sure, I had dozed the delightful doze of the jet lagged international flight, but had I actually passed out? Or had time slipped by that quickly? Shouldn’t we be somewhere over Greenland? That looks about halfway.

Then I realized that it was the map itself that was to blame. The arc was being true to the plane’s path across the map, but with a map as distorted as this one, it was bound to be confusing.

Like most cool things, this gets nerdy quick. See, when you try and take something that’s pretty much a sphere (the Earth) and fit it to a rectangle (the in-flight entertainment screen) you’re going to run into some deformation. There are many, many ways to crack this mathematical nut (the awesome site Radical Cartography lists 30) and each optimizes some things at the costs of others.

The designer of this system had chosen to use the familiar Plate Carrée projection of the Earth. It’s ancient, and quite familiar to travelers. It’s used everywhere. So certainly, it optimizes for initial use. At a simple glance, the traveler knows what he’s looking at.

But this projection, in forcing the longitude and latitude lines into tidy squares, severely squashes areas that are closer to the poles. The result is that—unless you’re traveling from one point on the equator to another—an actual straight line across the surface of the planet will appear on this map as oddly arced. What’s worse is that the arc won’t mean the same thing across its length. Nearer the poles it will be stretched and closer to the equator it will be squished, resulting in the weird, jarring experience of watching the plane zip to Ontario, and then crawl to the Gulf Coast.

Read More

Searching for a better home screen

It is very rare indeed when designers eagerly anticipate a release from Microsoft. This October’s Windows 8 release will see a new Windows Phone, the second version of the Metro UI for mobile devices. But more significantly, Windows 8 will bring the Metro interface to the desktop.

'Metro' style on phone and desktop
Metro on mobile and on desktop.

Metro, which won over designers, developers, and users with its colorful, transit-inspired, and minimally geometric interface, was first bundled with the Windows Phone 7 package. It was a risky - but undeniably insightful - move. Rather than simply playing catch-up to Android and iOS, the gridded interface stakes a dramatic new claim on how an OS should function on a mobile device. Rather than presenting a “home screen” where a user launches applications - an idea borrowed directly from the desktop - Metro uses the blocky launch icons to directly display the latest information and updates from within the apps themselves.

In other words, rather than launching your news app to check for the latest headline, Metro would feature those headlines right on the home screen. You’ll click on an app once you already know something of interest lies beneath. But Metro’s most striking implication is that you might not even open those apps as often anymore.

However, Microsoft’s approach to the home screen was not the first attempt at a radical departure from established mobile home screen norms. In 2010, an Android app called SlideScreen was on a similar mission, and its untimely demise shows the complications of innovating on the home screen in an environment where the handset makers and the creators of operating systems make the rules.

The SlideScreen app on Android.

SlideScreen, developed by Larva Labs, cleverly replaced the Android home screen with snippets of content you depend on the most. Get the gist of your inbox, absorb the latest headlines in your feeds, and check in on the churn of tweets and Facebook updates every time you idly flash on your phone. It was space-efficient without looking cramped - austere, but with personality.

Many early Android users (this author included) grew dependent on the immediacy: there was no need to navigate to an app or pull down a pane. The phone stopped being another media channel and became a tool again.

But in August of 2011 it was over. An ill-timed security update prevented the app from reading data from Gmail. SlideScreen could no longer “hot-wire” you straight to your messages. Developer Matt Hall begrudgingly admitted: “As of right now there appears to be no workaround as this is an intentional change to restrict access to the data. [..] As of this morning we’ve removed the app from the market.” SlideScreen was dead.

It’s a shame. SlideScreen was an important counterpoint to the prevailing norm on phone operating systems: the home screen as a list of apps you can launch. It’s a limiting norm that makes phones less useful. The “app-launcher-approach” to home screens essentially traps information and functionality in digital “lockboxes” that can’t be accessed without starting an app.

SlideScreen’s story highlights how apps themselves can’t innovate without the alignment of vision with the creators of the operating systems, consumer services, and information providers. Apps also depend on digital lockboxes that are stable and supply open data. But these conditions weren’t present in 2011, and they are even less so today. And when software ecosystems become more closed, apps like SlideScreen can’t flourish. That is likely why the Apple iOS home screen paradigm has been remained largely unchallenged.

Five years ago, the launch of Apple’s first iPhone in 2007 popularized this paradigm of precious, “gemstone” app icons. Instrumental in the phone’s success, the icons simplified access to functionality and made it obvious to novice users what a smartphone could actually do. But simplicity comes at the cost of information density and efficiency. Apart from the occasional push notification, there are precious few hints at what relevant information might be behind each icon.

iOS home screen. Image via Scrappble.

Yet, despite these shortcomings, and in spite of the efforts of the Larva Labs and the Windows phone team, there’s a real possibility that the gemstone paradigm becomes this decade’s default mobile navigation system. Why is this worrisome? Interface paradigms tend to die slow deaths.

On stationary computers and laptops, the same antiquated metaphor has guided interface development since the early 1970s. The “desktop metaphor”, as it is called, treated the computer screen as an imaginary desk, where objects like “files” and “folders” could be put. Despite some valiant efforts (at Cooper we took our stab with the Litl netbook, and Google attempted to bring the beast down with their Chrome OS), this concept has displayed a frightening resistance to technological progress and user needs.

The same thing can happen on our phones. We are facing the risk that inarticulate gemstones could become the primary way you operate your phone, even when new technology begins allowing for far superior ways to interact with smartphones. A smartphone’s ability to predict and automate actions has massively improved alongside the evolution of its impressive stack of sensors, cameras, microphones, and touch screens. Based on this knowledge, there are many ways a phone can tailor a home screen to the needs of the situation or time of day. The phone can begin to guess what I might need to know. Wouldn’t that be nice - a home screen with information I care about, rather than a list of the apps I have downloaded?

As Metro seeks to demonstrate, the main purpose of smartphones should not be to launch apps. Smartphones have a lot of impressive functionality, but not all functions are equally important. Not all functions need an icon. Home screens should facilitate important functions, and hide trivial ones. It should make it easy to communicate, help me be aware of time and place, and anticipate common information needs. The standard home screen as we know it today is not up to the task, so let us look for better ways. Let us leave the familiar behind. A better home screen is out there.

Sketchnoting is the massage

Sketchnoting is catching on at Cooper for all the reasons that it’s catching on in a lot of places. It's a way to pay deep attention and do active sense-making of a lecture in real time. (And one that produces a fun and memorable document to share at the end.)

In the spirit of getting better at it, Cooper designers took a lunch break to give themselves a massive challenge: Try sketchnoting the 1967 audio recording of The Medium is the Massage by Marshall McLuhan and Quentin Fiore. If you've not heard the audio recording, it's a pastiche of clips from his lectures on the subject, blended with Laugh-In like radio theatre sounds and sound effects, which chaotically and repetitiously illustrate some of his main points.

It’s challenging because the material is meant to be a mind-expending blast of ideas, akin to the visual design of the book. There’s no linear flow to the material. It’s hard to know what is meant to be most important. Many things zip quickly and it's dense with big meaning. (It’s prescient and still surprisingly insightful, even if the “massage” part is clearly of its time. I'd recommend it to designers heartily.)

On the other hand, it’s awesome because it forces you to let go of the temptation to be a transcriber while sketchnoting. You can try, but you quickly learn the limits of treating a sketchnote like that. You just can’t keep up. Instead you learn to relax, pick up what interests you, illustrate it, structure it, and let go the rest. Ultimately, we're pretty happy with the results of the stress test, but will still be doing our next practice with a good old linear TED talk.

In the meantime, here’s our invidividual results. Jump here to play some of the audio while you feast your eyes and before you let us know what you think.

[Thanks to our sketchnoters. In order of their drawings in the gallery above: Chris Noessel, Glen Davis, Jason Csizmadi, Jenea Hayes, Kendra Shimmell, Kim Applequist, Nate Clinton, Nick Myers, Nikki Knox, Pamela Sisson (guest sketchnoter visiting from Thomson Reuters), and Teresa Brazen!]

Sketchnoting IxDA 2012

We're working on a larger post about the awesome IxDA 2012 in Dublin last week, but in the meantime, I wanted to chat separately about sketchnoting.

I'm a drawer, there's no doubt about it. I can barely manage to consider a design problem before I'm reaching for a pen and paper, or my Tablet PC and a stylus and cranking open OneNote for an explanatory drawing or mind map. But that got taken to the next level when I attended "Visual Thinking Through Sketchnotes," a workshop by MJ Broadbent & Eva-Lotta Lamm.

In it we covered the basics of sketching and then went further into what that means for capturing the complex ideas communicated in lectures and speeches. I was hooked, and challenged. I spent the next three days both enamored of the excellent ideas being presented (high marks on all four things I look for in presentations, nearly across the board), but also trying my new skills at sketchnoting. Here's the whole set.

Read More

Strategies for early-stage design: Observations of a design guinea pig

Where do you start when you're approaching a complex software design problem? If you work on a large development team, you know that software engineers and UX designers will often approach the same design problem from radically different perspectives. The term "software design" itself can mean very different things to software architects, system programmers, and user experience designers. Software engineers typically focus on the architectural patterns and programmatic algorithms required to get the system working, while UX designers often start from the goals and needs of the users.

In the spring of 2009, I participated in a research study that looked at the ways in which professional software designers approach complex design problems. The research study, sponsored by the National Science Foundation, was led by researchers from the Department of Infomatics at the University of California, Irvine. The researchers traveled to multiple software companies, trying to better understand how professional software designers collaborate on complex problems. At each company, they asked to observe two software designers in a design session. At my company, AmberPoint, where I worked at the time as an interaction designer, I was paired with my colleague Ania Dilmaghani, the programming lead of the UI development team. In a conference room with a whiteboard, the researchers set up a video camera, and handed us a design prompt describing the requirements for a traffic control simulation system for undergraduate civil engineering students. We were allotted two hours to design both the user interaction and the code structure for the system.

Jim-and-Ania-at-the-whiteboard.jpgJim Dibble and Ania Dilmaghani at the whiteboard in their research design session

Read More

Platfora website debuts!

Platfora, a new startup in the Hadoop business intelligence space, is working with Cooper to design an elegant, intuitive interface to bring clarity to the chaos of big data.

After Platfora received 5.7 million in funding from Andreessen Horowitz; Cooper worked on a rapid, collaborative two-week timeline with a team of five designers to create their website, www.platfora.com. Platfora CEO Ben Werther said, "we wanted to convey the clarity and simplicity that we are striving for in our product experience — without showing actual screenshots. Cooper's design work on our website conveyed this message perfectly."

Credits: Jim Dibble, Golden Krishna, Martina Maleike, Doug LeMoine, Nick Myers

A clean sans-serif designed by Minneapolis type foundry Process combined with rich, vibrant visualizations designed by the Cooper team combine for a unique and beautiful site we're proud to have been linked to in the Wall Street Journal, TechCrunch and New York Times.

Immediately after launch, the site received rave reviews on Twitter:

See the site at www.platfora.com.

Related Reading

Read More

When is design done?

“We don't finish the movies, we just release them.”
-- John Lasseter of Pixar

It’s easy to think of design as an ongoing iterative process, a constant refining that never reaches an objective “end.” It is especially easy to think of software in this way. Because code isn’t static, design of software is relatively dynamic, able in many situations to alter direction or incorporate new functionality without overturning initial design-framework decisions. While this can be true, it is also possible for design to reach a state which is done. Not simply done for the next release, but where design reaches finality. The design no longer carries the evolution of the product forward.

done.png

Once design reaches a stage in which the difference between versions is more window-dressing, or a change in interaction approach, rather than a realization of deeper functional improvements, design is done. When the ideas on how to improve a design no longer come, when the designers can no longer see a way to improve the idea, it is done. It isn’t that someone else couldn’t take the idea and evolve it, but that the stewards of the design reach a point where their collective imagination can’t move the product forward.

Design which is not done

It’s easy to find examples of design which isn’t done. Lots of first generation software is released delivering basic functionality. Later versions fill out with functionality, growing to meet the latent potential in the first version. This design isn’t done.

Early designs of Evernote promised much more than was delivered. Successive versions cast and recast the design until the initial flaws could be worked out. Early versions provided little more than a limited word processor that stored stuff in the cloud. The interaction paradigm was a little strange and frustrating. Evernote continues to be a design in process. Functionality continues to evolve and improve with each release; the design isn’t done.

Mature software may not be done either. Photoshop versions 5, 7 and 8 delivered significant design shifts. Paradigms for working with text, the inclusion of vector images and interface for handling of RAW images marked major departures from previous versions. As an 11-year old product the design of Photoshop accomplished remarkable adaptation and revealed the “incompleteness” of prior designs. Of course the design leveraged advances in technology which were not available for earlier versions, but that’s the point. The design wasn’t done, design could still be used to improve the program, to advance what it did and how it did it.

Design of non-software products may also reveal a level of “not done.” A baby stroller from BumbleRide is “done” in the sense that you can purchase one and it works. The design is largely coherent and shows evidence of finish. But even here the design isn’t finished. A comparison of the 2008 and 2009 versions shows significant advancement of the design even though each of the versions was sold as a completed design. Wheels gained quick-release, the safety harness adopted a single button release, and the sun hood extended for more coverage. So is the design done now? I’d argue no. Improvements in ergonomics, materials, and signage all provide ripe areas for the design to continue to evolve.

When it reaches "perfection"

Design isn’t done when it reaches a pinnacle of efficiency or goodness. Done isn’t really a measure of quality or perfection. Many products never reach any level of quality or refinement. They represent evolutionary dead ends, still-born ideas with no potential in which to grow. They are poorly conceived, even if executed well. Crappy products may arguably be done before they are ever built or coded. The lack of vision from the start dooms the product to an evolutionary dead-end before it’s even born. If perfection is the measure of done we don’t have any way to agree on what is perfect or good. Perfect doesn’t give us a way to evaluate done.

When it feels done

Subjective evaluations by the creator may be acceptable in the realm of art. Artists work until the piece is “done;” till they feel the idea has been expressed. Design of products whether software or hardware need more objective measures than feelings. In part, designers need this because the act of creation relies on a whole team, not just an individual. We also need measures because products exist in a marketplace; there are deadlines, ship dates, feature sets, marketing and sales efforts, which require more clarity around when the design will be done.

When the time or money runs out

For consultants, work is “done” when the contract (time) is up. Projects are scoped to meet specific deadlines and requirements which fit those timelines. Design deliverables are iterative, each pass we give moves a level deeper and we work out more of the design details. We give great value for our time, but design is “done” when we run out of time. Our design is rarely done in the sense that every detail has not been worked out, all the possible problems have not solved. We work down from larger more fundamental patterns and frameworks, iteratively filling in the details. The big picture may be done when we deliver, but often it is internal product owners or developers who will actually “finish” the design.

When the requirements are met

It could be argued that design is “done” when the initial requirements have been met. It’s done enough to release a version, but it’s not really done. After the product ships the design team refines the design, adding in features or fixing issues which shipped in the previous version. The designers work to fulfill the full potential of the product. As long as their work produces advancements the design isn’t done.

When innovation plateaus

Design is done when its evolution plateaus. A couple of versions are released with little more than rearranging the deck chairs. Rework or changes to the interface reflect passing fashions rather than fundamental shifts in direction or functionality. Innovations in the marketplace or in technological breakthroughs are not incorporated or addressed in the design. Evolution grinds to a halt, the product ceases to advance in meaningful ways.

Design continues on many products long after the design is done. Design effort is wasted in chasing a market rather than leading one. Products become bloated with features which compromise the clarity achieved when the design reached “done.” Features are designed which don’t evolve the product; they complicate the vision reaching to be all things to all people, ultimately hobbling the product. The design of Microsoft Word has delivered little beyond version 5.1. It is a quite usable word processor, but the design for word processing was solid in 1991, in the subsequent releases little was advanced. Features where added that did little to improve the word processing experience. The design also failed to take advantage of shifts in the marketplace or technology. Five versions later Word is still largely a pretty good word processor. While much has changed in the interface switching interaction paradigms from menus to the ribbon can hardly be thought of as a fundamental shift in functionality. Word hasn’t evolved so much as changed it’s wardrobe.

Some products manage to react to changes in technology or marketplace. The design accommodates changing needs and opportunities. The product evolves through design to include new functionality, utility and continues to add life to the product. While Adobe Acrobat Pro has struggled with its share of bloating and incessant updates, the design of the program has continued to evolve. From humble beginnings of a reader/writer for portable documents, Acrobat has incorporated new functionality unimaginable when the product was initially designed; OCR of text, automatic creation of interactive forms, document markup, digital signing and distributed workflows. The integration of this new functionality has stumbled at times, but Acrobat X delivers a coherent, usable evolution of a product that is more than 17 years old. What was just latent potential in the embryonic design of the first versions of the product has been realized.

Some products are so deeply bound to a specific paradigm that the only reasonable evolution is an entirely different approach. The original design is done. A new product, with a different design, is created to address new technology, and a new marketplace. The original iPod‘s design is done. The scroll-wheel/menu design of an mp3s player was groundbreaking and brilliant, and it was well-executed. At some point it became clear that this design was done; it couldn’t evolve while maintaining the same core design. The only road forward was to abandon this “done” design, and adopt a new paradigm. The result was the iPod Touch. The shift was more than simply adding a bigger screen with touch input; what the product could do radically shifted.

Why does it matter?

It is important to acknowledge that design can reach a place of “done.” If we don’t, we may end up fooling ourselves that we are moving products forward when we are really just treading water. If we can’t step back and evaluate whether a design is done, we may continue to put effort into a product which we can’t improve. We will continue to release products that don’t help people achieve their goals, or worse--damage great products by bloating them with features no one needs. Knowing when the design is done allows us to recognize when our efforts will be productive and when our efforts will be wasted. When design is done it’s time to move on, to take up new challenges or products and start designing again. Read More

Creating immersive experiences with diegetic interfaces

I like to think of Interaction Design in its purest form as being about shaping the perception of an environment of any kind. Yes, today the discipline is so closely tied to visual displays and software that it almost seems to revolve around that medium alone, but that’s only because as of now, that’s pretty much the only part of our environment over which we have complete control.

The one field that has come closest to overcoming this limitation is the video game industry whose 3D games are the most vivid and complete alternate realities technology has been able to achieve. Game designers have control over more aspects of an environment, albeit a virtual one, than anyone else.

Lately I’ve been thinking a lot about this idea that interfaces can be more closely integrated with the environment in which they operate. I’d like to share some of what I’ve learned from the universe of video games and how it might be applicable to other kinds of designed experiences.

In Designing for the Digital Age, Kim Goodwin criticizes the term “Experience design” as being too presumptuous because we don’t really have the power to determine exactly what kind of experience each person with their own beliefs and perceptions has. Even when we work across an entire event from start (e.g. booking a flight) to finish (arriving at the door), there are still countless factors outside our control that can significantly impact how a person will experience it.

Video game designers on the other hand can orchestrate a precise scenario since almost every detail in their virtual world is for them to determine. They can arrange exactly what kind of person sits next to you on a flight no matter who you are or how many times you take that flight.

That isn’t to say that videogames don't have their limitations. Of course, it isn’t completely true that game designers can determine who sits next to you. They can only determine who your avatar sits next to. The most significant weakness of videogames is the inability to truly inhabit a designed environment or narrative. As much control as we may have over a virtual world, as long as we are confined to experiencing it through television screens and speakers, it won’t be anywhere near comparable to our real world.

Fortunately, there’s a growing effort to address this lack of immersion.

A key area of the problem lies in how we’re presented and interact with complex information diegetically, that is, interfaces that actually exist within the game world itself.

The 4 spaces in which information is presented in a virtual environment

Before continuing, it helps to be familiar with some basic concepts and terminology around diegesis in computer graphics, the different spaces of representation between the actual player and their avatar. The diagram above illustrates the four main types of information representation in games.

duke-nukem-3D.png

Non-diegetic representations remain the most common type of interface in games. In first person shooters, arguably the most immersive type of game since we usually see the scenery through our avatar’s view, the head-up display has remained an expected element since Wolfenstein 3D first created the genre. Read More

Celebrating the World Cup Visualizations

We really enjoyed watching the World Cup over lunch here in the Cooper office. The games sparked many conversations about soccer, beloved sporting traditions, and why FIFA is so bloody minded about goal-line technology use (okay, maybe that last one was just from a bitter England fan).

It's also been a time to admire the many new and unusual visualizations used for the tournament brackets, game-by-game breakdowns, and statistical replays. For the fans that wake up in the coming weeks with an empty feeling, perhaps this library of visualizations will provide a glimmer of comfort and distraction until the next tournament. (That is unless you're an England fan.) There are many visualizations to look at here but if I could suggest one to look at closely it would be the Guardian twitter replay. The best of the bunch.

And of course, congratulations to Spain on winning the World Cup!

Game Schedules & Results

The classic visualization for the World Cup is the table breakdown and brackets. For any hardcore fan this is the most exciting visualization where supporters can see their team's road to the final and victory.

MARCA World Cup calendar
One stadium visualization received plenty of attention for it's beautiful form and elegant interaction but, for me, it failed to illustrate the future match-ups. I never could understand the rationale of the order of the teams either.
MARCA World Cup calendar

World Cup radial bracket poster
While just a poster, this visualization gives a very quick glimpse into potential future opponents. It also is beautifully designed with bright colors and typography. Sadly, it isn't interactive.
World Cup radial bracket poster Read More