UI basics

Overcoming challenges with UI design

Gail Yui
Website design image via Shutterstock

Re-designing a website UI to improve user experience is hard. It requires in-depth research, creativity and a lot of plug-and-play. Most of all, you need to be able to know when to start from scratch, says creative director and UI designer Gail Yui.

Designing a new user interface (UI) is not an easy task. It takes persistence, creativity and a lot of iterations. And while online services continue to grow in complexity and power, users still expect the tools to be simple to use, and the sites, easy to navigate. The overarching goal is to create a user experience that is truly intuitive. If a user finds himself/herself stumbling through pages and unable to utilise the tool and its functions to their full effect, then it’s time to head back to the drawing board.

While it may seem a straightforward notion, it’s important to understand how to overcome the many challenges that come along with UI development, and what to consider when designing to ensure an overall great user experience. With this in mind, here are a few pointers in navigating the challenges with creating or updating a UI and what is needed to leave users satisfied.

Analyse the problem and find the pain points

Website UI design can be a daunting task. Before jumping into the backend, the first step is to analyse the problem at hand and find the biggest pain points for users. No matter how cut and dry the problem might seem, always take some time to gather information and view it from as many angles as possible. For example, a user who can’t find something on your site might be missing it for a number of reasons like the colour of the item, or the location on the webpage, the content surrounding it or the visual hierarchy it has been assigned. The problem might be multi dimensional and the only way to uncover the root issue is to conduct research.

Designers can find out more through a series of internal Q&A sessions, navigating through help tickets, studying website traffic and discussing the project team members. It’s often easy to get caught up in the notion that one answer will make everything work better, which normally doesn’t translate well. Doing research helps set the stage and narrow down the goals of the project before making any rash moves. Once the most significant pain points are gathered, designers can begin to map out a plan that will generate the biggest improvements with the simplest set of solutions.

Putting research to paper, prepare for the worst

With the key pain points in mind, along with the project goals and objectives, designers can begin to sketch on paper. It’s easy to get excited over reinventing a better solution that plays to the product’s strength, but don’t get caught up in the anticipation.

The perfect solution rarely ever comes with the first try. That’s why it’s important, specially in the concerting stage, to give yourself several different revisions before landing on a few that could work based on the agreed upon goals. From paper, you can move to prototyping and creating wireframes and layouts. This stage may take hundreds of tries, but once the basic layout is figured out, we are ready to go into the testing phase.

Peer testing before external testing

Product testing is a vital part of a go-to-market strategy for any company; the same goes for Software as a Service (SaaS) companies. The difference is that SaaS companies are selling their UI along with their services so testing is two fold. Now that we’ve taken all the necessary steps in designing the first iteration of a website’s UI, we run these designs by the internal team because they know the interface best. They will have a keen eye to quickly identify any issues with the flows or navigations. This provides the first line of defence before you expose the product to the public, and allows you to fine tune the design, eliminating any major snags before anyone outside sees it.

Then we are able to at least partially unveil the product to external testers, with whom we can get the most objective feedback. Based on previous conversations with internal testers, you can ask the right questions of the beta testers to get to the core of the UI issues, before unveiling the design to the public.

Iterate, iterate and then iterate

Now that you have both internal and external feedback from testers, designers can iterate on the UI design, whether it’s tinkering with the colours or moving around drop down tabs. While there may be many more iterations throughout the process, it’s important to keep in mind the original goals set at the beginning of the project. Even if you end up back at your starting point, you are able to pick the design that works the best, with the data analysis to back it up. Follow it up by reviewing internal analytics to find behavioural patterns that we could use to better guide the experience.

Re-designing website UI to facilitate better user experience is an intensive process, any way you go about it. It requires in-depth research, creativity and a lot of plug-and-play. You also have to able to pivot quickly and start from scratch at times. It’s important to incorporate the feedback you get in your research along the way to better understand what users want out of your product to create a smooth experience to successfully engage your user.


Gail Yui

Gail Yui is Creative Director at DataHero in San Francisco, covering all design needs from UX/UI to branding and marketing.

Inline Feedbacks
View all comments