Duncan Hopkins

UX and Design Leadership.

November 25, 2015
by Duncan Hopkins

“Good design is a great experience for everybody”

Ending Email Overwhelm: How IBM Redesigned Enterprise Email to Deliver Outcomes for All
Recently i was interviewed on the Social Business Engine Podcast about how my team at IBM Design is designing IBM Verse with inclusion by all users and how we use IBM Design Thinking to solve problems at scale.

Visit Social Business Engine to hear the podcast.

August 5, 2015
by Duncan Hopkins

Sign up more customers with best practices for application on boarding

dropboxIf you build it, they don’t necessarily come. That’s what makes application on boarding so important. Once you’ve designed and created an app for the web or mobile devices, customers need help signing up – and reasons to stay with you.

Simplifying the on boarding process

To encourage users to quickly start using your product, it’s critical that the sign-up process is minimized, making it a simple and fast task. To get new users through the door:

Understand what motivates or prevents someone from becoming an active user of your site or app. Frequent user testing will help validate results, and A/B testing of various landing pages can reveal the optimal solution.

Front-load the experience. Engage the user in activity on the product straightaway. If your product can be used immediately, let the user do it. This allows them to see the value now, not later. For example, on Google.com, the main function is to start searching, so the search box is the most prominent feature.

Squareup.com mobile site features a Short Header, Call to action Button, product in use. All other content is below the fold.

Squareup.com mobile site features a Short Header, Call to action Button, product in use. All other content is below the fold.


Emphasize a big, clear call to action. If you squint your eyes and look at your page, the call to action should be the most visible item. Always keep the call to action above the fold. If the user can’t see it, they can’t click it. This is also where you start introducing consistent style and action buttons to familiarize users with the brand. Make it the most visual element on the page.

If it’s free, say it’s FREE! I love free, don’t you? You will have a much higher conversion rate by letting users know it is free or a free trial in the call to action. There are various marketing techniques available, depending on what you are selling. Free is always a great incentive. If it’s not free, you had better explain that up-front, too, as users will lose trust if you try to pull one over on them.

Get social. Social sign-in is a great shortcut if your users are active on social networks. But you should always include an email option as well, since not everyone uses social media or prefers not to link those accounts to other apps. Be sure to mention that you will not spam their mailbox or post on their wall, especially if using social sign-in. Letting users know this will increase conversion by starting to build trust in your company. And seriously, don’t spam them or post items to their wall! If you don’t use a social sign-in, embed the full signup form on the home page. This decreases the steps to sign in.

Keep it simple. The ideal design features a simple page with a short message and call to action. Look at the example sites on this page. Every one of them has a short, precise product description. If you need a paragraph to explain your product, you have already begun to lose customers. Product benefits can be added below the fold (scroll) or in a short tour, but the user should not have to view them before they can sign up.

Pre-fill via API. When signing on with social media, import the user’s information by API to pre-fill basic entries such as address, email, profile photo, and even contacts. This will further decrease signup time for the user.

Import contacts early. You want more people in your funnel sooner. Allow simple import from multiple services, including email. But don’t force it and allow users to skip this step. You can always remind them later or offer this as a main action in the user interface.

Use a progress bar. Sometimes called wizards, progress bars show where the user is in the signup process. They stop users from giving up and leaving. These can be numbered steps or a simple set of dots. Ideally, a progress bar includes a maximum of three to five steps. If you can keep the process even simpler, don’t include it. Allow the user to skip steps that do not apply or are not needed to sign up. Tutorials can be invaluable at signup, but keep them short and allow users to skip and access later.

Pinterest uses multiple social sign up with optional email form.

Pinterest uses multiple social sign up with optional email form.

Tips for a great on boarding design

Keeping the page simple is always the best solution, but these ideas can help the site’s appeal and help incorporate branding:

Large applicable images can improve conversion rate. A visual splash is nice, but don’t take the emphasis away from the call to action. Use it to add focus.

When using people in photos, make sure they are same as the target audience. Choose images where people are smiling, attractive and having a great time. Stay away from the same old stock images of shiny, happy people that are on 30 percent of sites out there. Add interest by being unique!  Take the photos yourself, or spend the money to hire a professional. You want visitors to think, “Hey, I want to hang with these guys. They look like fun!”

Don’t forget the power of illustration. Many sites are using hand-illustrated artwork to bring a simpler human feel to the technology. Good examples are dropbox.com and axure.com. This can bring focus to a differently styled call to action.

Give the user social testament of your product. Show number of people, social share buttons, press, testimonials, etc. This validates the site as worthy, useful and full of content. Again, use this sparingly and put it below the fold based on your marketing goals.

If a link takes the user away from the call to action, put in the footer. This is a standard practice, and most users know where to go to find the small print. The landing page might not

need any at all except for SEO purposes, so save it for the main site. Include a prominent call to action button on every page if the user has not logged in.

Even with a busy background, the big green button is hard to miss on Spotify.com.

Even with a busy background, the big green button is hard to miss on Spotify.com.

All these practices are applicable for web sites,  mobile sites, and apps. When designing responsive sites, be sure to apply to each view size.




March 19, 2015
by Duncan Hopkins

The UX of being a cover band

Planet Texas Band

The Planet Texas Band Plays for a happy audience.

I play bass in a blues rock cover band for fun, and was thinking about the user experience that we have with our audience. So I made a list of basic gig guidelines and actually it’s quite similar to any business customer experience:

  1. You are not your target audience, what might be your favorite song is not what your audience wants to hear.
  2. You are there to entertain them, not yourself. You are being paid by the venue – their customer is the focus.
  3. You are a team, when everyone plays their parts right – magic happens.
  4. Know your audience. Their favorite song might be one you never thought about.
  5. Play a well rounded song list based on a core set or theme that the audience will be familiar with.
  6. Deliver more than expected. on time. on key, and on tempo.
  7. Practice makes perfect, no one enjoys a sloppy sounding performance.
  8. Talk to the audience. Get them to interact. Dancing is always encouraged.
  9. Keep it fresh. Update your repertoire often, replace songs that don’t work well with the audience.
  10. Make it your own. you don’t have to play the song note for note like the original.

… and most important of all, don’t forget to tip your bartenders and wait staff. :)

March 1, 2015
by Duncan Hopkins

How much UX is just enough?

How much UX is just enough?

How do you know what amount of UX to include in a project? Some companies don’t even consider user experience in the initial project scope — sometimes because of time and budget constraints or they just never think about it. On the other hand, some can overthink the UX, get hung up on research, and don’t react fast enough to get the product into the hands of users to test in a real-life environment. You can’t afford not to have some level of UX in your process. Here are some basic guidelines on how to make it work for you.
The ideal situation is to get a minimal amount of testing of the interface and experience in the hands of users early. Use wireframes or rough comps to get feedback that you can use immediately. Just as important is to iterate as you are building the products and features. This way you can adapt and adjust as needed. You then keep UX as an integral part of the product lifecycle – beginning, middle and end. You can’t do it upfront and leave it, and you can’t do it last and then expect it to work as it goes out the door.
User experience doesn’t have to be complicated and doesn’t have to be expensive but it does need to be an integral part of the entire process. Having the right balance is vital to getting good results. When estimating a project always include UX and user testing within the scope and timeframe and allow time for results and iteration. Include UX as part of your roadmap for future features and always come back and revisit what is working and what is not, and if that feature should still be part of your business strategy. On the other side of the coin, don’t get bogged down with trying to make it right the first time. You will never get it right, and it will never get finished.
Don’t test it on yourself. You are not the customer and will not get a realistic evaluation of how the product works. Include real end users who are not biased, part of your company or family. You would be surprised how well just going out and showing someone a few screens and asking the right questions works. You can get useful feedback just showing someone quick wireframe comps on the phone instead of creating high resolution interfaces where people inevitably get distracted by the details rather than focus on the functionality. There are many decent online tools and services out there for simple user testing. Choose the ones that work best for your app in the right situation. If you are relying on someone else to qualify the testers, always make sure the candidate is the correct persona.
Strategic business questions you should always ask yourself:
  • Why would customers use this app?
  • What would make them immediately download or signup for an account?
  • Why would they continue to use it?
  • How can you make it simpler for the user? Can you remove what they don’t need?
  • Does each feature truly reflect your business strategy and objectives?
  • Who are you competing against?
  • What makes you better or different than your competition?
  • What’s the most important goal you want to achieve? Sign up more users, promote social interaction, subscriptions?
User experience is not new, but it is now getting the recognition it deserves as an vital part of the success of your company and your products. I have enjoyed creating user interfaces and refining user experience for over 20 years. Let me know how I can help you make your business and product a success.
Please contact me via LinkedIn

February 17, 2015
by Duncan Hopkins

Usability Maxims

Arnold Lund asked colleagues working in the human-computer interface (HCI) design field for the rules of thumb they found particularly useful during the design process. He then created this list of 34 maxims (given below in order of priority).

  1. Know thy user, and YOU are not thy user.
  2. Things that look the same should act the same.
  3. Everyone makes mistakes, so every mistake should be fixable.
  4. The information for the decision needs to be there when the decision is needed.
  5. Error messages should actually mean something to the user, and tell the user how to fix the problem.
  6. Every action should have a reaction.
  7. Don’t overload the user’s buffers.
  8. Consistency, consistency, consistency.
  9. Minimize the need for a mighty memory.
  10. Keep it simple.
  11. The more you do something, the easier it should be to do.
  12. The user should always know what is happening.
  13. The user should control the system. The system shouldn’t control the user.
    The user is the boss, and the system should show it.
  14. The idea is to empower the user, not speed up the system.
  15. Eliminate unnecessary decisions, and illuminate the rest.
  16. If I made an error, let me know about it before I get into REAL trouble.
  17. The best journey is the one with the fewest steps. Shorten the distance between the user and their goal.
  18. The user should be able to do what the user wants to do.
  19. Things that look different should act different.
  20. You should always know how to find out what to do next.
  21. Don’t let people accidentally shoot themselves.
  22. Even experts are novices at some point. Provide help.
  23. Design for regular people and the real world.
  24. Keep it neat. Keep it organized.
  25. Provide a way to bail out and start over.
  26. The fault is not in thyself, but in thy system.
  27. If it is not needed, it’s not needed.
  28. Colour is information.
  29. Everything in its place, and a place for everything.
  30. The user should be in a good mood when done.
  31. If I made an error, at least let me finish my thought before I have to fix it.
  32. Cute is not a good adjective for systems.
  33. Let people shape the system to themselves, and paint it with their own personality.
  34. To know the system is to love it.

Reference: Lund, A M (1997) “Expert Ratings of Usability Maxims.” Ergonomics in Design: The Quarterly of Human Factors Applications, Volume 5, Number 3 (July) pp. 15-20.