Skip to main content

Malcolm Bull from Concise Digital reveals the fundamentals of web design with 34 years of experience under his belt!
Are you stuck with your ecommerce web design? This UX/UI presentation is for you.

Check it out from the video above. But for the fast readers, here is a text version that takes out the main points.

Introduction

“UI/UX design - is the design of any user interfaces, in which usability is just as important as the appearance.”

At the start of the presentation, Malcolm makes it clear that UI and UX are separate things.
Each of them has its discipline, which is combined to create an effective web design.

That web design has to look good, feel right AND work well for the user in mind.

So, what do UI and UX actually mean?

Malcolm brings up a great analogy to explain the difference between the two components.

UI is the saddle, the stirrups, and the reins. UX is the feeling you get being able to ride the horse.

Try to imagine yourself successfully riding on a horse. You’d feel the wind blow nicely. You can go as far as you would like to. It seems like a nice experience, right? This is what you should provide to your users.

User Experience (UX) Design

Malcolm continues to explain UX design. He says that it is not just about the user’s experience on your website.

“It encompasses all aspects of the end-user's interaction with the company/brand, its services, and its products.”

“You gotta know your users... and you gotta know your product... You've gotta know them as if you weren't you.”

So, do you know how your users are interacting with your business? Do you know what they are looking for from you?
If you don’t, you HAVE to know.

UX needs to be...

UX is heavily based on humans. After all, they are the ones that will ultimately buy your product.
As Malcolm says, things work out so well when you understand human nature.

Now, here are some keywords that you should know related to human nature. These will help you deliver a great UX for your users.

  • Usable: A product needs to be simple, easy to use, and familiar.
  • Useful: A product must fulfil a need.
  • Desirable: The product needs to be attractive with positive emotions.
  • Solvable: The user would be able to find a solution for their problem quickly.
  • Accessible: The product and services should be accessible for everyone.
  • Credible: The brand and its products need to be trustworthy.

Why do you need to remember these keywords?
If you have learnt marketing, you will probably have heard this at least once. Users usually care only about themselves. They search for stuff that will solve their problems. They want things to be as easy as possible.

Are you starting to see how they align with the keywords?
Figure out your user’s problems. How do they want to solve them? Implement that into your product, website and services.

Put customers needs, expectations, and pain points as your foundation and strive for empathy and loyalty. Deliver on these key things better than your competition and succeed.

In other words, “…make that user fall in love” with your brand.

Just make sure that you will keep on moving with your UX designs. Why? Because expectancies change over time. New technologies or trends will occur. If you don’t keep up, your user could lose their love for your brand.

User Interface (UI) Design

Malcolm moves on to explaining UI design.

“UI design is all about how the product's interfaces look and function. It's the space where interactions between humans and a product occur.”

For ecommerce, this “space” would be your website.

Now, how do you make this interaction great? Again, look back at what your users would want.
Malcolm mentions that UI is a very specific discipline. It has a set of rules to follow. But to have good UI, you must understand UX first. To understand UX, you need to understand your users.

What users want in UI

Here are three key points that users look for when navigating through a website. Each of them will come with detailed checklists that you will need to implement in your interface.

  • 1. Users want to feel in control.
    • Reversible: be forgiving to misclicks, let them go back to the former screen, etc.
    • Easy Navigation: show cues and make things predictable, use familiar systems.
    • Acknowledge actions: for example, when your user puts a product in the cart, indicate it.
    • Show when something is happening: for example, it’s better to keep the spinning wheel to show that it is loading.
    • Please both novices and experts: not everyone will know about the specific flow for your product. Let them know while making sure experts can slip past the tutorial.
  • 2. Users want to feel comfortable.
    • Clear clutter: less is more.
    • Don’t ask users for info they have already supplied.
    • Speak the user’s language: don’t use jargon, use words that novices can understand.
    • Fitt’s Law: Utilise big buttons so the user only has to click once.
    • Think accessible: colours, contrast, space, sound, etc.
    • Real-world prompts: for example, using a wastepaper bin icon
    • Error messages: don’t leave the user hanging on a frozen screen.
  • 3. Users don’t want to have to think/work too much.
    • Three click rulenot necessarily limited to three clicks, but keeping things less, easy and intuitive is important.
    • Recognition, not recall: use the same icons and cues throughout your website.
    • Visual clarity: don’t present information all at once, use ‘read more’, group them in tables or number them.

Consistency is also key in UI

Lastly, for UI, Malcolm presents three main points to keep consistent in your design.

  • Visuals: use the same colours, fonts, icons and buttons throughout the entire website.
  • Functionality: make sure the same buttons always work the same way. Menus should correspond with the side menu.
  • Expectations: follow conventions that are commonly seen in other ecommerce websites as well.

See how it connects to three key points that we saw earlier?
Try not to make your users frustrated by being overly sensitive to new stuff.
As Malcolm mentions, users have a ‘goldfish span’, so you don’t want to lose them.

To sum up this UI section,

Deliver a user friendly interface that promotes exploration and makes the user feel 'safe'... comfortable and in control without the fear of going wrong.

Conclusion

Overall, we have learnt that both UX and UI have to be designed in a way that everything is easy-peasy lemon-squeezy for our users. Make sure you use the same conventions as other websites, such as carts and payment.

But also consider what other functions your website might need to enhance your brand experience. For example, if you are selling clothing, make sure that your products can be searched via size filtering. If it’s wine, filter it by colour, and so on.

Remember what Malcolm said, “You’ve gotta know them [users] as if you weren’t you.”
Look at things from a user’s perspective as much as you can.

We hope this helps your ecommerce business and happy designing!

 

This event was sponsored by KeepSpace, a 3PL company based in Perth. We strive to help ecommerce businesses by fulfilling their orders and dreams. If you’re interested in outsourcing your ecommerce fulfilment, check out our services.

Leave a Reply