Choosing the right Interface elements
With 3.6 billion active users worldwide and over 50% of the population now having access to the internet, it’s safe to say we’re a little obsessed with being online.
In came lightning fast connection, and not only are we internet-obsessed, we are now impatient with website usability and function. Pages that take too long to load or are over-stimulating and confusing can result in the loss of business. Just under 50% of your customers will leave your website if it takes longer than 3 seconds to load.
So what can you do to make your website user friendly? All roads lead to UI (or User Interface) design.
We’ve outlined the top 5 interface tips to optimise your user journey for your customers.
Keep it Simple
A simple user interface does not mean a basic website. Creating a space that is easy to use, visually pleasing and innovative can be an art in itself. Over complicating your user interface can result in frustrated customers and loss of business. Making sure that the page loads in a reasonable time, pages are clear and concise and informative will assure that the user can focus on the main reason they are visiting your site.
Use Recognisable Icons
We all know that the icon of a house will take you back to the home page and a shopping trolly will take you to your cart. These icons are recognised world wide and can reduce the necessity for text navigation. Icons are not a tool to reinvent the wheel, keep to familiarity so that the user doesn’t have to spend time decoding your icons.
Follow Design Standards
There are a few design standards for websites that we suggest abiding by. The burger menu on mobile devices for example. You will usually find it at the top left of the page and it will expand to show you the website navigation. This is a familiar position for users as most websites use this format. Changing the position will confuse and frustrate your user. Search bars are another design feature that are usually found along the navigation bar making it easy for the user to utilise if they cannot find what they are looking for. Not being able to find the search bar when the user is already having difficulty finding what they are looking for will most likely end the users experience on your site.
Keep it consistent Using the same font, colour palette and design structure for each page will keep your user engaged. This also relates to the positioning of buttons and tools. Keeping the format consistent will ensure your layout is easy to use and familiar. With over 60% of internet usage accredited to mobile users, making sure that the desktop site and mobile reflect the same user functionality and visual clarity is key to staying consistent with your brand.
Give Feedback
Making sure that your users understand at all times that their request has been acknowledged is an important functionality of your website. Providing feedback when a button is clicked or a page is loading will indicate to your user that their request has been acknowledged. This can be done by highlighting or indenting buttons, loading icons or notifications.
The best tools to get you there
Here are the preferred design tools our designers use at Atlas.
Adobe
Adobe Creative Cloud is a a set of applications and services from Adobe Systems that gives subscribers access to a collection of software used for design, video editing, web development, and photography. Our most used services of Adobe are outlined below.
Illustrator – Used to create vector elements including brand logos, iconography, imagery and different branded elements, Illustrator is unlike photoshop in the way that it uses mathematical constructs to create vector graphics instead of pixels.
After Effects – Although After Effects is known for post-production in film and television, it is popular among UI designers for web animation, motion and GIFs. Including animation on your website can create a visually interactive experience.
Photoshop – Photoshop is mainly used for photo editing and manipulation. Our UI designers frequently use this tool when they isolate an image from a background and edit website photography.
Sketch
Sketch is a layout and UI creation tool used to set up canvas templates so that they are scaled to web pages. Sketch Bring together elements from Illustrator, After Effects and Photoshop. In Sketch you can set up heading styles, button design, and colour palette. You can also save brand guidelines to use across multiple platforms and use symbols that you can use throughout the UI design.
One of the best features of Sketch is that you can universally edit documents across all pages by editing the text, button designs or colour pallet. This can save hours of tedious work.
Craft – Craft is an app created by Sketch to bridge the gap between the sketch and Invision platforms. In Craft you can select artboards to upload to Invision, to transfer all information over to Invision that you can later edit in Sketch and update.
Invision
Invision is a used to visually represent a website design so that the client can see how it will look and function. Invision will take the user through the journey of your website with different interactive functions including buttons and navigation. The designer will also create different InVision boards for mobile and tablet.
Another useful aspect of Invision is the ability to comment on different aspects of the site and converse with the client leaving feedback threads that will notify you when updated with new information.
There are many options when it comes to UI design and a good designer will get to know you and your company before suggesting a process that best suits your brand.
At Atlas we offer an in depth brand discovery so that we understand the exact needs of your company. Our UI designers work in house so you can meet the creatives that will be designing your site face-to-face. Contact us to meet some of our designers today!
