• Reading email
• Reading books and magazines
• Browsing the Web
• Watching videos

More and more business users want tablets as well, and for many of the same reasons, but tablets aren’t poised to replace laptops and desktops in the business environment yet. Consider some of the key use cases in the business environment:

1) Working with business documents (word processing, spreadsheets, data entry)

Touch interfaces do a good job of replacing the mouse, but the tablets’ functions do not yet match the efficiency, ease and speed of a physical keyboard for entering and editing data.

2) As an accessory at meetings (taking notes, emailing, instant messaging)

Again, entering text on a tablet, even with a stylus, is not yet as efficient as using a physical keyboard, and in order to communicate via email or IM during a meeting, you need to be discreet, so voice-control isn’t a good option.

3) Presentations

Tablets can be great for presentations, but there are still a few stumbling blocks. On traditional PC’s, many presenters use mouse cursors as pointers, especially when teleconferencing, and you can’t do that do that with a tablet.

Given the realities of keyboard versus touch-screen efficiency for some tasks, the modus operandi going forward probably shouldn’t be an either/or scenario, but a combination approach. Using an attached or dockable keyboard with your tablet can give you the functionality you need if you’re away from your computer or if you’re ready and able to forego it altogether. Today’s array of user-friendly tools allow everyone to choose the ones best-matched to their work and play.

The bottom line?

Tablets are great, but many people will still need the mouse and keyboard for a while.

What’s your call on what tools are best for work?

• Tablet only
• I need my PC/Mac
• I want both

Design geek or not, we all react to fonts in one way or another, and not always consciously.  Every web marketing manager should take a look at the fonts on their site and ask themselves “What are these fonts saying about my brand? What do I want them to say?”  I was recently attending a Produxs design review meeting with a client, and we were showing a few different variations of a home page design. At a glance, they all looked rather similar. But there were many subtle variations – including the use of different colors and fonts.  I started to think about what each font said to me, how it made me feel, and whether it had good chemistry with the client’s brand image.  One of the fonts I found to be formal, yet friendly, with a casual sophistication. One was somewhat stodgy, but seemed quite trustworthy.  And another was well-balanced, a bit fruity, with smooth, caressing tannins. No, wait, that was the wine I had with dinner last night.

A designer with an eye on both aesthetics and UX will also point out that not all fonts are created equal when it comes to their practical use: reading.  Especially when there’s lots of text on the page, a font that’s both attractive and readable is a must. Some fonts have greater power to help your eyes grip words on a page, like high-performance tires on a track. Things like size and contrast matter, too.

Nokia took all of these factors into account when it set out last year to create a new corporate font as part of an effort to “reinvent and revitalize” their image.  They were after a typeface that “sends out exactly the right message” for the brand. This font, called Nokia Pure, was recently named “Graphic Design of the Year” by the Design Museum of London.  The Nokia branding folks have a really interesting post about this font, and all the thought that went into creating it. Great work by the designers at Nokia!

Do you think Nokia achieved the desired result? Or could they have just gone with Verdana and called it a day? Next time you’re looking at a web page, stop for a moment to think about the fonts you see, and what they convey to you. Would you change them?  Hey, you just might be a design geek!

In the very simplest terms, behaviorism is the notion that all behaviors are learned. UX designer’ work revolves around this theory; they use behavioral techniques documented as far back as the early 19^th century.

Studying and understanding human beings’ learned behavior is the foundation for great UX design; our best practices for generating the desired responses to design stimuli revolve around well-documented human behavior principles, including:

• “Classical conditioning” (learning by associations)

You’ve likely heard about this one even if the term doesn’t ring a bell (pun intended). One of the most famous psychological experiments demonstrates this phenomenon (though it was an accidental discovery).  Imagine that the UX Designer is Ivan Pavlov and we, the users are the dogs drooling at the sound of a bell.

Pavlov demonstrated that we can be conditioned to associate a response with a particular stimulus, and this has huge implications on how users interact with a website.  Familiarity has taught us that clicking a blue link or bit of text will take us to another page; we understand how to scroll through pictures on a touch device.  Why? Designers use these specific cues consistently from site to site, and  users are now conditioned to respond,

• “Operant conditioning” (learning by positive and negative reinforcement)

Operant Conditioning is the idea that behaviors can be learned by presenting positive and negative reinforcement. This is especially helpful to understand in the design world, particularly if a new design treatment or functionality is being used.  If you don’t reward the users when they complete the desired action or take something away when their actions are incorrect, it will take longer for them to learn the intended behavior.  The timing of the reinforcement is also important – chances are if you design a bright orange button to take a user to a checkout page (his/her intended behavior) and the user’s action doesn’t take him/her immediately to a shopping cart (positive reinforcement), it would take much longer for a user to learn the intended behavior than if the orange button took them directly to what they wanted.

• “Behavioral Analysis”

This one is exactly what it sounds like – analyzing behavior and applying it in an individual, cultural and social context to understand a behavioral “problem.” At Produxs, happens at the strategy and “envisioning” stage of a design project. The designer studies the client’s problem and researches what would improve user experience. With that info in hand, the designer can call on his/her arsenal of best practices (the learned human behaviors and responses) to achieve the client’s goal (the intended user behavior).

Who knew those Psych 101 classes would come in so handy in the real world of design?

What other psychological principles have you applied or noticed in user experience designs?

1. You’ve watched the documentary Helvetica (and loved it).
It’s the most beautiful font in the world! Don’t be a hater. Gary Hustwit’s documentary film “Helvetica”: Watch it again here.

2. You spent a ridiculous amount of money on rubber cement, #11 Exact-o blades, and Pantone papers in college.
Back in the day, before everyone and their grandma owned a computer, we created our designs with hand-cut paper, rubber cement, stat cameras and press type. Late-night thumb slicing injuries were common the night before a critique. Fun times!

3. You dream in Photoshop.
Some nights, you’re not sure you actually asleep, as you try to click things in your environment and move them a pixel here, a pixel there…trying to add more cyan to the sky above and add the perfect drop shadow to your coffee mug. 6 a.m. rolls around and you feel as though you worked all night but have nothing to show for it. The snooze button on your alarm is your friend.

4. You’re annoyed by doors with the “wrong” handles.
It’s so annoying to come across doors that are so poorly designed that people have to stop and figure out how to enter or exit through them—door handles that look like you should “pull” when you actually need to push to open them.

(Also, you’ve very likely read Donald Norman’s book The Design of Everyday Things, in which he goes into great detail about the “affordances” that tell us how to use a particular thing.)

5. You have special pens.
Not any pen will do. You may spend 30 minutes or more looking for a suitable writing implement when you discover the store is out of your favorite. Line weight, smoothness and how the pen feels in your hand make the difference between a regular pen and a “special pen.” They should not be loaned to other people – or your children.

6. You notice slight variations in typefaces.
You get hung up on 1pt differences you see in type size and wonder why your boss has used both Verdana and Calibri for paragraphs on the same page. (I don’t have this problem and am guilty of the offense described.)

7. You can type out the first line of “Lorem ipsum dolor…”
You don’t need to copy/paste “greek” text for small amounts of body copy. You have memorized:
“Lorem ipsum dolor sit amet consectetuer adipiscing elit sed diam nonummy nibh.”

8. You cringe when you see Comic Sans used in someone’s email signature.
Ok, let’s admit it. There are fonts we’d love to see outlawed. This is one of them. You want to make these people watch “Helvetica” (see #1).

So how did you score? Are you a full-fledged Design Geek? Halfway there? Or are you one of those rare birds who manages to design without obsessions, aversions or compulsions?

Let us know in the comments field below – oh, and feel free to add your own Design Geek indicators.

Ever been in the middle of a pleasant web experience, only to be  interrupted by a pop-up customer satisfaction survey?

I understand the benefits of learning more about your site’s users and customers. But let’s face it: Surveys are annoying. When I’m in the process of purchasing an item online or paying a bill, I don’t want to be interrupted by a pop-up declaring “We value your opinion…” Post-transaction surveys don’t bug me quite so much, and I’m quite a bit more likely to complete a survey when it doesn’t appear in the form of a surprise pop-up.

Much like search engine optimization (SEO), collecting user feedback should be “baked in” to user experience (UX) design, blending naturally into the overall user experience on a website. If it’s part of the logical flow of a transaction and consistent with the overall look and feel of the site, users may find the requests far more palatable and may begin offering up feedback without giving it a second thought.

For example, collecting little bits of context-based feedback throughout a checkout process will be less burdensome to the user than a big survey presented after the transaction is completed (especially since many users may choose to skip a big survey entirely). Also, by integrating requests into the flow, the user is providing feedback at the same time they’re interacting with the site so it’s fresh in their mind. The number of questions should be limited and relevant to the content on the page. As a user, I’m far more likely to answer questions presented in this way and will feel as if the people who designed the page take customer feedback seriously.

Many companies use a far less ideal solution – third-party applications, plugged in to an existing user experience that likely has a totally different look and feel. When this is the only option, minimizing the impact is best. There are many third-party approaches and solutions out there, and one tool that’s always been appealing to me is Net Promoter Score (NPS). NPS is popular with many companies, including consumer favorites such as Apple and Amazon.com.

The NPS metric aims to simplify communication between customers and companies by asking just one survey question – usually along the lines of “How likely are you to recommend our company to a friend?” or “How likely are you to make a purchase from our website again?” Customers are asked to answer with a 0-10 rating score.

While NPS does not collect specific data about different aspects of a customer’s experience with a website or company, it does offer valuable insight into the biggest question a company needs to answer: How likely is it that a customer will become a return customer?

It’s also nice and simple. Answering one question is fast, and if a user knows there’s only one question, they’ll probably put a bit more thought into it, rather than hastily clicking through multiple screens of questions in a desperate attempt to finish before the item they ordered arrives on their doorstep.

Satmetrix®, the company behind NPS, recently released findings for a number of large companies, including Amazon and Apple, which both performed well. That’s not surprising, but it begs the question of whether those scores were influenced by the generally strong brand loyalty associated with these names. In other words, an Apple loyalist may be more likely to forgive some shortcomings in the user experience. More in-depth surveys offer the opportunity to learn more, but there’s a fine line between customer satisfaction and customer annoyance.

Web surveys are very useful tools that can provide a company with unprecedented data about how customers feel about their services. Whether a business chooses to use the NPS model, or a more traditional questionnaire, having direct access to customers’ opinions is invaluable. The best approach is to take surveys into consideration when creating a user experience from the ground up. Opportunities for relevant customer feedback should exist throughout the experience, without disrupting it.

When it comes to surveys, what draws you in or turns you off?

1. Simplify.

• Strip out excess design elements and distracting content.
• Make content the primary focus.
• Make the calls to action distinctive and touch-able.

2.   Remember that touch controls are about direct manipulation.

• Don’t rely on indirect controls, such as zoom sliders or scrolling buttons.
• Make gestures work where it seems natural.
• Indirect controls as a secondary option is okay

3. Make sure your touch targets are BIG.

• Fingers are not as precise as a mouse pointer: Don’t punish big fingers or poor accuracy.
• Leave enough space between targets so users are less likely to tap the wrong one by mistake.
• Hyperlinks should be distinct and touchable. If they are crowded too closely together it may be too easy to tap the wrong one by mistake.

For more details, check out Microsoft’s great research, implemented in its Windows Phone and Windows 8 designs.

4. Do not rely on Hovering

• There is no universal equivalent to a “mouse-over” in the world of touch devices.
• Don’t rely on tooltips for critical information.  These are no longer discoverable on a touch device.
• Don’t expose actions – such as edit/delete, etc. – on hover for the same reason.
• Don’t rely on hover to change the appearance of an object or to reveal important information.
• Don’t create any menus or drop-downs on hover

Instead:

• Show menus when clicking or tapping a control
• Make menus visually distinct as touchable controls
• Make menus distinct visually as a menu or dropdown control compared to the other controls on the screen

Hover was once a convenient method of exposing extra actions or information; without hover, users need to tap or click to drill down. Re-evaluate the priority of the possible actions users can take and information they will see. Expose them as part of the main user interface if they are important or used often, rather than burying them behind an extra tap.

5. Give feedback and guidance where possible.

For example, in a touch interface, users don’t know a target is active unless they tap it. If possible, give an indication – a change in appearance or an animation – that the action was successfully initiated before leaving the page. This way, if the page is unresponsive, the user knows that it is an issue with the page, not because they missed the touch target.

How would you design differently for a touch interface?

*Photo Credit

I see so much to get excited about in the Windows 8 “Metro” design that I’m not sure where to start.

Chrome-less beauty

Jensen Harris //build conference talk

One of the best things about Windows 8?

The applications are “chrome-less”. Chrome is an industry term that applies to all the elements that typically surround content in an application or web site – navigation bars, toolbars, search, footer links, etc. Designers typically allocate a sizable amount of screen real estate to this stuff, so the ability to hide these controls until you need them – giving the content of the page or application more room to breathe – is a beautiful, radical thing.

I was surprised to see what a difference this made in drawing me into the photos, data and information displayed on screen in a simple newsreader app that was demo’d as part of Microsoft’s //build conference for developers back in September.

And Microsoft says non-touch computer screens will soon feel antiquated, not to mention the highly illustrated icons we have grown accustomed to.

So what’s behind this and other elements of Microsoft’s new paradigm?

Design Principles to Live By

“Form follows function.”

This was drilled into our heads when I was a student in the UW (University of Washington) School of Visual Communication Design as we were warned against the evils of unnecessary ornamentation and adornment.

I’ve carried this lesson with me through the years, striving to stay focused on clear information hierarchy and usable interfaces that solve customer and business goals—avoiding the temptation to move too quickly into finessing visual design details before I had nailed down the functionality. (Although I have to admit to giving in to the temptation of using a gratuitous Photoshop filter to add a little eye candy to my designs – sorry to disappoint, Professor Wadden!)

Through a very disciplined approach, Microsoft has breathed new life into this old design adage. The company and its community of talented user experience (UX) professionals created a beautifully crafted, harmonious design for Windows 8 based on a well-defined set of design principles. I won’t describe them all here, but I did want to highlight a few of the foundational elements of Microsoft’s “Metro” style.

Modernism and reductive design
The Modern Design Movement of the 1920’s and 30’s was largely born out of the Bauhaus school in Germany, where focus on craftsmanship and functionality spawned a new era of design. This design movement was centered on reducing things down to their core essence, creating highly functional AND beautiful objects. Its influence can be seen in things we use and love today (think of your favorite chair or light fixture from IKEA).

You can also see this principle applied throughout the Windows 8 experience—in the design of application “tiles” on the Start screen, the design of apps themselves, and in the aforementioned “chrome-less” experience that puts content front-and-center while the toolbars and menus hide off screen until you choose to access them.

There are no unnecessary embellishments to distract you from what you care about. Information is clear and easy to read, and controls are easily accessible.

Clean, Clear Typography

The adherence to solid typographic principles is probably my favorite aspect of Metro.

Microsoft is elevating the importance of clean, crisp, beautiful typography to developers and consumers alike. Drawing on principles from the Swiss Design Movement (a.k.a. International Typographic Style) and decades of best practices in print design, Metro focuses on establishing clear information hierarchies.

These hierarchies are created through the disciplined use of a few different type sizes and stark contrasts with bold, “flat” color (as opposed to color blends, gradients and 3D effects). The whole experience is unified by an underlying grid system that brings symmetry and balance to the information being presented.

The name Metro was inspired by the signage found in airports, subway stations, and other places where we need to quickly and easily find our way in often hectic, loud, busy environments. Well-designed signage systems rely on the same methods described above—stark contrast, bold color, clean, clear type, symmetry and a focus on functionality. What good is directional signage if it’s hard to read or cluttered with unnecessary embellishment?
Emotional Impact through Motion

One of the things that struck me as extremely innovative and will differentiate Windows 8 from other operating systems (previous version and competitors alike) is the reliance on photography and “live” tiles to convey relevant information instead of the usual static icons.

Why show an illustration that represents what an app can do when you can pull app content forward and bring it alive on screen? One example of this is pulling an image from a news story and showing it to me with the headline, instead of a 3D-looking icon of a rolled up newspaper.

As Jensen Harris explained in his talk at //build, the new Start screen is “not Times Square,” where myriad things are competing for your attention with flashy bells and whistles. Each application tile is placed—by you—in an organized system that feels organized and inviting.

I find this to be true with my Windows Phone. When I look at the desktop (the equivalent of Start screen in Windows 8), my tiles feel balanced and well-behaved, if you will. Things play nicely together, and I actually feel good as pictures of my son, husband and friends “peek” at me as their names subtly animate over their images. I can also get at-a-glance information about other things I care about, as data and notifications are dynamically updated on my email, messaging and calendar tiles.

How do you really feel?

At Produxs, we’re excited to begin using Windows 8 and continue to apply its design principles in our work. There are plenty of other aspects of the design and experience that we’re jazzed about (new multi-touch gestures, “semantic zoom,” shared “contracts,” and more) … but that will have to wait for another blog post!

It’s no mystery where I stand on Windows 8, its Metro design aesthetic, and the forward-thinking approach Microsoft has taken here. What are your first impressions of Windows 8?

A social media website where you can “pin” favorite images with content of all kinds, Pinterest has become the latest rage, seemingly overnight. Suddenly, I came across articles about Pinterest everywhere, and Pinterest posts began appearing on my Facebook feed. For a few weeks, I was curious, but not enough to check it out.

Finally, I gave in and did a little digging. Here are a few of the interesting stats I found:*

• 97 percent of the active “Pinterested” are female.
• The number of daily users has increased by 145 percent since the beginning of 2012.
• Pinterest drives more traffic to websites than Google+, Youtube and LinkedIn combined

Pretty impressive!

What’s fascinating about the success of Pinterest is that the concept isn’t revolutionary; a handful of image “bookmarking” sites preceded Pinterest, including FFFFOUND!, Ember, and “We ‘heart’ it.”  So what makes it different?

Maybe the simplest way to explain it is that Pinterest took an idea that was already out there and elevated it to something extraordinary via amazing execution. Here are four ways Pinterest sets itself apart from its predecessors, according to a blog written by Joshua Johnson titled Addictive UX:  Why Pinterest Is So Dang Amazing?

1. Masonry style layout: This approach allows for images of different sizes to fit together on a page, eliminating odd stretches of white space between images.  It’s appealing to the eye and creates a puzzle piece flow of images.
2. Infinite scrolling: This feature makes for a seamless browsing experience; there’s no need to click “next” or “back” or wait for the new page to load to find more images.  Because of this, it’s very easy to get lost in looking at picture after picture (especially because people perusing the site are presumably looking at boards that interest them).
3. A distinctly feminine look: Due to the high percentage of female “Pinners,” the site has a feminine vibe that sets it apart from other similar image bookmarking sites. The beta launch was very controlled, and I believe this was the idea behind that strategy.
4. Ease of use. Pinterest makes it easy to pin, re-pin and share, and the site does a good job of promoting sharing. The mechanixm for getting images from the Web to your Pinterest boards is a no-brainer.

Taking the plunge

When I was ready to sign up, I had to request an invite, which resulted in a spot on the waiting list. This air of exclusivity made me feel as if I was going to be part of something very cool … well, when I was lucky enough to get off the waiting list, that is. The experience reminded me of the limited access Facebook gave in its early stages.

So I waited, and within a day, I got an email announcing that I was in; excited, I began exploring.

In no time at all, it was easy to see that Pinterest had proved to be successful by utilizing very simple and effective UX design in three prominent ways:

1. Pinterest’s User Experience (UX) design is very simple, but extremely effective and engaging. I’ve already found myself relentlessly scrolling through all my favorite things – this is potentially dangerous!
2. It was very easy to begin to use and follow other pinners – I didn’t have to do much work at all, and my screen was full of great pictures. Pinterest suggests followers for you based on what you indicate that you like.
3. I was impressed by the fact that it’s so easy to pin pictures from the web – no downloading or hyperlinking required. I can easily pin a dozen pictures in a matter of minutes. The ease of pinning has meant that I find myself sharing images far more often than I would have expected.

Pinterest is clearly out to show us that simple and effective UX with flawless execution has amazing potential!  I’ll be intrigued to watch it grow and see what new twists the Pinterest team may have in mind as the site’s popularity continues to explode.

Have you used Pinterest yet?  If so, what do you think?

* Source: Addictive UX:  Why Pinterest Is So Dang Amazing?, Joshua Johnson

About a week ago, I received a call from my credit card company alerting me about about suspicious charges. Credit card companies, of course, track your spending patterns, and if something is slightly off, they flag the account and call you.

Typically, they ask us to confirm whether we made the purchase and have our card in hand.  Given that this has happened in the past and the activity in question has always turned out to be a legit purchase, we found this “suspicious activity” call a nuisance.

But this time it was different.

One of the purchases was for more $600 and was made in person in a small town in Illinois (given that I live in Seattle, this was the first of many red flags). Given that the card was swiped in person, the credit card company explained that the individual must have made a duplicate credit card using our number. Since this was not a typical purchase for us and given that there was no other activity putting us in that location, the card company had declined the purchase. My wife and I were shocked that our credit card number had been stolen; we are protective of our cards and try to avoid making purchases on websites that don’t appear to be secure.

We use pattern recognition at Produxs all the time when designing our our web user experiences, so I was keenly aware of the power of pattern recognition… this experience just brought it closer to home.

Whether it’s a new product that our clients want to sell online or a new view of their business as seen through our Business Intelligence (BI) platforms, a majority of our work involves introducing something new to clients’ intended audiences. When users engage, they look for visual and interactive cues that are familiar to them – ones that provide them comfort. Beyond the comfort factor, sometimes these patterns are used to provide a more personalized experience (i.e., providing more content that is relevant to you based on noting your interactions).

Establishing a comfort level with your user is paramount to a successful engagement. It enables you to push the envelope not only with your product or offering but also with regards to how you engage with your customer. It provides another avenue to connect (even if subconsciously) with your customer. It’s through the strength of those connections that loyalty is built.

As often as I swear at the credit card companies, this close attention to customer activity – to patterns – is one thing they get right.

By definition, UX design is about designing for stakeholders, users, clients, customers – not for designers. Our opinions shouldn’t matter.

We start with stakeholder interviews, which give our design team an in-depth understanding of our client’s corporate objectives – or to put it more bluntly, they help us understand what we’re being paid to accomplish.

Discovery

Once we have detailed results from these interviews and create a thorough ‘Statement of Work’ for our client, we begin researching our clients’ users/customers. The time for user experience design strategy to potentially influence – not drive – business strategy comes during what we call the “discovery” phase, when we do qualitative and/or quantitative research and usability testing. This research and testing tells a sharp UX design firm what customers want – not what the customers think they want, but what they actually want.

The insights we get during the research phase can validate core components of a client’s strategy and stakeholders’ hypothesis. On the flip side, these insights can also shake a business strategy to its foundations – what would you do if you found that your customer wants or demands something entirely different than you were expecting? Something different than you were prepared to offer them?

More often than not, as in real life, those cases are the exceptions, and the true insights are gray-area nuances on the original strategic theme. UX design strategy creates value by adding precision – uncovering the exact design elements that will achieve a client’s business objectives by meeting its customers’ needs (see our Clarisonic success story).

Fact-based design strategy

It’s this dovetailing of business strategy and UX design strategy that the savvy design firm relishes – a dialogue grounded in customer data, not opinions, which is what great UX design should spring from.
With any luck, the design is successful from the get-go, but diligent user experience designers are never finished – show them data that can lead to better business outcomes, and they’ll tweak their work every time.

The takeaway

Designers must understand the stakeholders’ position first and then test the assumptions of that strategy with a client’s customers before pushing the first pixel. Too many design firms fail – and waste their client’s time and money – by trying to dazzle a client with beautiful pictures before understanding the basics: the business strategy and the customer.

How many times have you seen a design project, or any project, that was executed without regard for the business strategy. Where the process, design, and results were not at all what the company needed or what the customer required. Share your thoughts.