8 Innovative Ideas for Building a Great User Interface

Posted by | March 31, 2015 | Web design | No Comments
innovative ideas

The success of a website is defined by a good user interface. Sites and applications that do not provide a good user experience are often frustrating to users. You could have very good content on your site but if the user interface is not appealing, customers will ignore it.

  • A site needs to be easy to use and navigate
  • It should not be too congested
  • It should have appealing colors
  • A site should have the right balance of graphics and text content

Your goal when designing a user interface should be to please the visitors who will visit your site. You have to consider what they want and endeavor to give it to them in a simple yet tasteful and uncomplicated manner.

Innovative Ideas for achieving a Good UI

Most website and application UIs usually feature links in the form of text. This can be tricky for users especially if they are accessing a site on a device with a small screen.

One way to increase user experience is to add padding to the link or creating the link as a block section. This reduces chances of missing the clickable area.

Block section links are usually ideal for sidebars while padded links are ideal to use within text.

Position all labels properly

Web users access buttons and tabs many times, therefore you should be keen to align the labels within them. Labels placed too high or too low or indented too much to one side are off-putting to users.

Take your time when designing such details and your site will look polished.

Apply contrast elements to text

Use contrast to shift attention to certain bodies of content. If you set all your text in one color and one shade, it becomes difficult for important information to stand out.

For instance, article posts usually have a title, article author and date. Each of these three elements can have a different shade, depending on your intention. If you want the title to stand out, you can create contrast by making the article author and date a shade lighter.

Users have little time to be on your site, therefore the UI design should make it easy for them to find what they are looking for within the shortest time possible.

Use color highlights to grab attention

Use color to call attention to specific actions that you want the visitor to take.

If, for instance, you are selling a product on offer, create your ‘offer’ sign in a warm color such as red or yellow. You can make the sign pop out further by setting it on a background with a cool color such as blue or black.

Though you might feel that everything in the site is important, highlighting too many components will defeat the purpose of using this design element.

Use white space to define blocks of content

A UI in which text and other content seems to flow into one another will be very hard for your users to navigate. Elements such as buttons, navigation bars and headlines also need to stand out distinctly.

Space creates relationships. In a body of text, the title should be near the article body and the spacing between rows in the article body should be tight to create distinct paragraphs.

Tweak your white space until blocks of information stand out clearly.

Tracking

Use the tracking (or letter spacing) feature to adjust spacing on your headlines.  Tracking makes your headlines stand out and look more appealing.

This shouldn’t be a problem to achieve as web design software has the letter spacing capability built in.

Improve usability and look of form elements

  • Look

Custom input fields are plain and can make your site appear boring. You can add more styling of your own to make them aesthetically appealing and interesting.

  • Usability

If your visitors have to input data on your website, make it easy for them by automatically focusing on the input field.

Websites such as Google use this feature and the user therefore doesn’t have to click to input. This improves speed.

Rethink your labels

When a user is about to exit a page, an error message pops up. If your error message has a question and then ‘yes’ and ‘no’ options, the user will have to read the whole text. This is unnecessary.

Using the ‘save’ and ‘cancel options eliminates the need for a long error message as the two short words speak for themselves.

Things to bear in mind when creating a UI

  • Understand the needs of your target user
    • What kind of user are you targeting?
    • What setting will the users be in?
    • Are you designing for mobile or for computer?
    • What kind of information will your target market be looking for?
  • Give your site direction

Your site should have a good flow. Make it easy for users to navigate from page to page, include a ‘back to the top button’. The easier the visitors get around your site, the longer they will stay on. If users like your site, they will bookmark it, recommend it to other users and visit in the future.

  • Work with your goal in mind

If you are designing a site that offers financial information, the UI will be very different as compared to a site that offers entertainment content.

  • Build for different platforms

Your UI should be custom-made for both different screen sizes, giving a good experience to users both on the desktop and on the mobile phone. There are some popular designs that have more popularity and acceptability than others. If you have designed other sites and you have seen a pattern of the ones that work, stick to those.

  • Trying to be cool can backfire

There are some universally accepted ways of doing things in sites such as using checkboxes to choose items on a list. Stick to those simple ways as doing otherwise would confuse your users. The approach to designing a UI should be with care and thoughtfulness. Before you launch your website, test it out on a few users and let them share their experience with you.

Avatar

About Jack

Jack Dawson is a web developer and UI/UX specialist at BigDropInc.com. He works at a design, branding and marketing firm, having founded the same firm 9 years ago. He likes to share knowledge and points of view with other developers and consumers on platforms.

Leave a Reply

Your email address will not be published.

This site uses Akismet to reduce spam. Learn how your comment data is processed.

CALL (416) 855 0322 OR EMAIL US TODAY