Don’t underestimate the power of your user-interface.

Your website is your business’ first impression online and can drastically affect how visitors view your brand. Smart UI design can be the difference between a repeat visitor and a bounce.

After years of experience designing UI for a plethora of platforms, we’ve compiled our knowledge and put together a list of this top UI design fundamentals we just can’t stress enough.

Next time you start designing a user-interface, remember these fundamentals:

 

1) Know Your Audience

First things first, get to know the target audience. Ask yourself ‘who is the market for this website, why are they coming here, and how can I appeal to them’. Once you understand your target audience, you can design your UI strategically around their preferences.

After countless years designing, our Art Director Ricardo Evangelho knows a thing or two about UI design.

Make sure when you’re conceptualizing you know will be a) interacting most with the platform or b) the desired group the client wants interacting with the platform. When that is put in place, moving onto designing is much easier”.

 

2) Do Prep Work

sketches

Before putting pen to paper…err, mouse to illustrator; make sure you do some prep work. Sketching your ideas will help you flesh out concepts and weed out the bad ones before you waste time developing them.

Sketching your UIs before designing them is a crucial component of UI design (and graphic design in general) and can’t be stressed enough.

 

3) Keep it simple

Visitors on your website are there to find something specific and your UI needs to enable that. By keeping a simple, consistent flow you can usher your visitors to where they need to be – drastically reducing your bounce rate in return.

More the intuitive your UI is, the better your site will perform. After all, no has ever said I wish this website was more complex.

Some websites that demonstrate the power of simple, intuitive UI are MailChimp and Paper (for the iPad).

 

4) White Space is Your Friend

And it’s a friend of your visitor’s too. Just because there is empty space doesn’t mean you should fill it. Overwhelming your visitors with graphics and information won’t do you any favours.

Instead, you should use white space to break up the clutter and draw attention to the important information on your page. Leveraging white space is a very important design philosophy.

 

5) Patience is Not a Virtue on the Internet

rsz_120216125149-stressed-kid-boy-laptop-frustrated-computer-story-top

First impressions mean everything with UI. The first 10 seconds on a page are critical to whether the visitor will stay or leave. If your visitor has to wait too long for your page to load or is met with clutter, the likelihood they leave is very high.

Only after 30 seconds on the website does the probability of leaving balance out. Be sure your landing page is clean, simple and flows visitors towards the content they’re seeking.

Your first impression on the Internet means literally everything. So don’t mess it up, because if you do you won’t have a chance to try again.” – Steve Kanter, CTO of Arctic Empire.

 

6) Create Clear Call-to-Actions

Whatever the purpose of your call-to-action is, chances are it’s important. While your homepage UI should encourage visitors to stay and explore, it’s the call-to-actions job to lay out to the visitor what is expected of them.

Make your call-to-action stand out with its size, colour and surrounding white space – contrast is key. For the call-to-actions copy, use clear, authoritative language to drive users actions. And above all else, limit the number of call-to-actions on your homepage. Leading your visitor to one call-to-action over many always yields better results.

 

7) Remember Contrast

ipod

The power of contrast can’t be understated – especially with web design. Contrast is a great design practice for controlling your visitor’s focus and creating a hierarchy of importance on the web page.

Create contrast with your colours, fonts, text size and imagery to draw your visitor’s eye to specific information and commands.

Some websites that use great contrast are GiftRocket and artist, Kyle Steed’s personal website.

 

8) Offer Feedback

Your websites UI should always be speaking to the user. Whether their action is right or wrong, the UI should inform the visitor of their action. Visual cues or simple messaging can show the visitor whether the action they anticipated was processed.

Offering your visitors feedback is especially useful for assisting those who are having trouble navigating your site. By providing where they went wrong and how they can avoid the issue in the future is essential to retain visitors.

 

9) Learn from your Mistakes

It’s often said when developing user-interfaces that you need to fail fast and iterate often. We’re all human and we all make mistakes, it’s how you rebound from your mistakes that define a person.

It’s not a failure, it’s an opportunity to grow. Use the knowledge learned from your mistakes to improve the quality of your UIs going forward and become an overall better designer.

The latest designer to join our team, Sabrina Saer, can vouch for this:

Don’t get comfortable, monotony is the enemy of design. Learn from your mistakes and keep coming up with new ways to design.

 ————————————————————————————————————————————————

Are you a design nerd too? Let us know in the comments if you have a fundamental we missed. We would love to hear from you! And don’t forgot to Share this using the buttons below! 🙂