Custom User Interface (Dilbert)
Why great startups are often started in bad recessions
from a blog post on: www.forentrepreneurs.com by David Skok:
Around the years 1999 and 2000, the startup world was invaded by a range of newcomers that were attracted by the prospect of making a fast buck. They had seen all sorts of dot com companies with crazy business plans go public and get amazing valuations. In my opinion these newcomers were not really true entrepreneurs. They were not motivated by a powerful inner drive and passion to build something wonderful. They were motivated mostly by money. The net result were some of the worst startups we have seen.
When things changed in 2001 and the IPOs vanished, the startup world became a very tough survival environment. The visitors disappeared back to other jobs where they thought they could make more money. However the true entrepreneurs stayed. They battled the harsh funding environment even though they realized the chances of making money were slim. They did this because they were passionate about their ideas. Most had to live on substantial pay cuts. Not surprisingly many of the best startups were started in this kind of environment.
So if you are attracted to the world of startups, ask yourself this question: are you here because you are passionate about what you will be doing? Or are you here because you think this is a great way to make money? If it is the latter, I believe your motivations will have the effect of leading you to disappointment.
Emotions in Design
from a blog:
Emotional Interface Design: The Gateway to Passionate Users
We’re changing. Our relationships online and in real life are shifting as we become more public with our private lives. Online social networks have helped our real world social networks transcend time and space making it easy (and seemingly essential) to share the triumphs, tragedies, and trite moments of life. No longer do you simply tell your best friend that you’ve broken up with your boyfriend. It feels natural to many people to tell hundreds of Twitter followers, and Facebook friends.
No matter how you feel about the appropriateness of over sharing, the shift towards a public private life is changing our expectations of the relationships we create online. Remember the websites of the late 1990’s and early 2000’s that used formal language to create a professional, guarded persona and brand? The trend was towards the serious, because it seemed like you couldn’t land clients or entice new users if you weren’t stuffy.
Figure 1. Kenny Meyers uses humor in his portfolio to connect with his audience.
Oh how times have changed (figure 1). Today it’s typical for a web designer or developer to let her personality shine through on her websites. Many popular web apps are also tapping into emotional design techniques that are far from the stuffed-shirt approach of old. As users let their humanity show online, frontiers of communication are opening for web designers.
Usable = Edible
We’ve spent the last decade-plus striving to create usable web interfaces. It’s not always been easy to win over bosses and clients, but the value of user-centered design has made great strides. More often than not, we can count on it being baked into our professional process. But that’s a pretty low bar to shoot for.
When we go out to dinner at a fancy restaurant, we’re hoping for more than just an edible meal. We’re hoping for amazing taste and texture, clever presentation, and memorable ambiance. The pinnacle of a top culinary experience is extreme pleasure. Why don’t we shoot for the same target in web design?
Why do we settle for usable when we can have usable and pleasurable (figure 2 and 3)?
Figure 2: Basecamp is usable
Figure 3: Wufoo is usable and pleasurable
Wufoo is a business-focused app that goes beyond being usable. It was designed to be fun, because the task of creating forms to store data is inherently dry.
“The inspiration for our color palette did come from our competitors. It was really depressing to see so much software designed to remind people they’re making databases in a windowless office and so we immediately knew we wanted to go in the opposite direction. My goal was to design Wufoo to feel like something Fisher-Price would make. We were determined to make sure Wufoo was fun.” – Kevin Hale, Wufoo
As Hale indicates, they were thinking of the way users might feel when using their app, and designed an experience that ensured the user’s emotional needs are met.
Hello, Maslow
In 1943, Abraham Maslow proposed a theory of the hierarchy of human needs. He posited that humans have basic needs that must be met before other advanced needs can be addressed (figure 4). His theory states that humans flourish when the top tier of needs are fulfilled.
Figure 4: Maslow’s Hierarchy of Needs.
By mapping Maslow’s insights into human psychology over to interface design concepts, we can get a better understanding of the way our audience works (figure 5).
Figure 5: We can remap Malsow’s hierarchy of needs to the needs of our users.
The interfaces we design must first be functional – they need to solve a problem for us. Next, they need to be reliable – no fail whales please. Our interfaces need to be usable – easy to learn, easy to use, and easy to remember.
The piece we often overlook is the pleasure. It’s at the core of culinary arts, but we find it far too infrequently in the web apps and websites we use daily. Personality is the conspicuous difference between Basecamp and Wufoo (figures 1 and 2). Personality is the platform for emotion.It’s the framework we use to crack jokes, empathize, and connect with other humans. If we can bake emotion into the interfaces we design, we reap big benefits.
Emotion in Design
Babies create bonds with their parents through an interesting feedback loop. When they cry their parents respond by soothing them, which releases calming neurotransmitters in their brains. As this cycle repeats, the baby begins to trust that their parents will respond when they need them.
A similar feedback loop happens in interface design. Positive emotional stimuli can build a sense of trust and engagement with your users. People will forgive your site or application’s shortcomings, follow your lead, and sing your praises if you reward them with positive emotion.
Aral Balkan’s Twitter iPhone app – Feathers – deftly combines usability and emotional design to create a pleasurable user experience. As you type a tweet, a cute birdy mascot starts to fill with color to indicate how many characters you have left of the 140 maximum (figure 6). If you exceed 140 characters, the bird changes red to indicate your error (figure 7). While satisfying a basic usability heuristic to provide feedback about system status, Balkan has also created an interaction with which his audience can fall in love.
“I really *LOVE* the singing bird when you send a tweet. Twitter is fun all of a sudden!” – @thetalldesigner
Figure 6: As you type a tweet into Feathers for iPhone, the mascot fills to give feedback on message length.
“Confession: sometimes I make too long Feathers-tweets just to watch the bird turn red.” – @evbjone
Figure 7: If your tweet is too long, the Feathers bird turns red giving feedback in a fun way.
The feathers bird creates a powerful connection with users because it’s a point of empathy. As @thetalldesigner states above, he doesn’t just like this app, he loves it. It’s not an application that’s providing feedback, it’s a fun little friend with personality, and personality is the platform for human emotion.
“Before your application can create an emotional relationship with the user it must get the basics right. The emotional relationship, the delight, is what you layer on top of this base usability and technical competency.” – Aral Balkan, designer/developer of Feathers
TapBots are following similar principles to create wildly successful utility apps that track your weight and do simple unit conversion. That’s no small feet. How do you get excited about tracking your weight loss (or gain)? The answer—create points of emotional connection.
“We did want our users to have an emotional connection to our apps. Most people don’t have a love/joy for software like geeks do.” – Mark Jardine, TapBots Designer
Figure 8: TapBots apps use personification to create a cute robot personality that almost seems human.
The movie Wall-e was the inspiration for Weightbot and Convertbot.
“Our concept for the first 2 apps was selling our apps as if they were physical robots. That’s why the icons resemble the interface. We also gave the icons eyes to humanize them a bit. But we use this idea as a selling point and not to distract the user in the actual app. We want our apps to be used seriously, but also give the sense that they are more than just a piece of software.” – Mark Jardine, TapBots Designer
It comes as no surprise, with the great care and attention Jardine has put into the relationship Tapbots have to the people that use them, that the feedback they’ve received confirms the emotional connection they sought to create.
“ I adore the way their apps look and sound.” – John Gruber, Daringfireball.net
Treats & Discovery
Sometimes the emotional connection we make with our audience through design is less visible. There’s a magic about hearing a favorite song on the radio that playing it on your iPod just doesn’t have. The difference is the surprise discovery.
People love to discover treats in interfaces just as they do in real life. Perhaps you’ve been delighted to return to your hotel room to discover, “Oooh! A chocolate on my pillow!” The joy is more than the treat, it’s the discovery of the treat and the feeling that someone took the time to think of you.
Photojojo – a website for photography enthusiast – sprinkles treats throughout the shopping cart process. A little “learn more” balloon sits to the right of product images. When you click it, the ballon floats down to the product description. The ballon solves a usability problem by making users aware of the detailed information that may not be visible through a small browser viewport. But the interaction is pure delight.
An empty shopping cart shows a sad face, but when a product is added, it turns that frown upside down. When entering your name during the checkout process, a little robot appears to welcome you as a new customer.
The Risk of Emotion
As is true in real life, showing emotion in design has real risk. Some people won’t get it. Some people will even hate it. But that’s okay. Emotional response to your design is far better than indifference.
Showing personality in your app, website, or brand can be a very powerful way for your audience to identify and empathize with you. People want to connect with real people and too often we forget that businesses are just collections of people. So why not let that shine through?
UI a better world.
User interface.
Imagine if everything in this world were as intuitive as a calculator or an ATM. Training departments and organizations would surely go out of business! Jokes aside, let’s try and extend the concept of UI to other things, by drawing parallels with the principles that UI (good one) uses. Whether “concepts of UI” can make ours a better world just as UI makes softwares’ a better world.
Simplicity, for instance. Re-using the examples of calculator and ATM, what those systems follow is keep their language simple without assuming the intellect of the audiences; hence the recognition of being examples of good UI. The users do not have to explore (struggle to understand) features and just get their job done exactly the way they expected. What if, we without categorizing the audience, simply use simple language and choice of words so that our “expression” becomes good UI and message is conveyed – with no loss of time. A recipe for effective communication, resulting in a slightly better world?
Structure. Believe me – you do not need to be a good orator or a good writer to achieve “structure” in your communication, hence satisfying second important aspect of UI. Think of this, one of the things that makes any good movie really watchable is the structure in story-telling; it’s hard to connect with randomness and easy to lose track (and interest!). Listening properly without succumbing to the noise of “preparing to react” in mind, is the first step to achieve structure, while involved in a 2-way communication.
Visibility. Just as a good UI attempts at “showing” required options to users for achieving desired and timely results, you should attempt at providing “visibility” or “transparency” of information – just the right amount, at the right time and of proper relevance, to your audience. Also, not providing unnecessary (or too much) information is also very important – to avoid confusion and delays in achieving proper results. Very similar to a bad web site or software that provides 3 different ways of performing same tasks – forcing a mess of UI clutter and information overload.
Feedback. ATM has a very precise and concise feedback mechanism in terms of either suggesting that there is failure or success of performed operation, along with proper message in case of a failure. What we can learn and apply at our workplace or home is that timely and proper feedback will result in increased clarity and a sustainable better atmosphere, hence mitigating the risk of continued “misunderstandings” and “assumptions.”
Ironic and funny element is that a slight imperfection in UI commands respect and appreciation from most people, while a perfect one does not! Let me explain…
Most of corporate offices have many access doors that may open out in one direction and carry signs “Push” and “Pull” and handles on both sides. On other hand, I’ve noticed in one of the offices that the access doors on one particular floor (as experiment after receiving a suggestion from an employee) do not have “Push” and “Pull” signs – instead they have handle only on the side you’re expected to “pull” the door. That’s it – plain, simple, and intuitive. Most people commit mistakes in using the first style of doors (at times pushing instead of pulling and vice versa); still they consider the option as fool-proof and complete, than the “incomplete” option of the second style – where there are no signs and just one handle. Funny? It’s true.
Second example…
A Walt Disney movie is always appreciated for its entire package. Never is the case where someone stops and appreciates the UI, just because Walt Disney creates and presents UI just as you expect it to be (perfect!), hence not distracting you from enjoying the story, music, characters, etc. There’s a better chance that you might stop and praise the animation (UI) of Warner Bros. because their lack of precision (to the standards of Disney) allow you to connect with them to the “achievable” levels and hence talk and appreciate about the creation. You see – the purpose is already destroyed – you’re distracted from the actual movie experience.
I guess I’m not doing a good job (I can tell after re-reading my lines!) in explaining – well, I am still struggling to be a good UI myself, and will keep striving for a better world by preaching and promoting the same!