Every Thursday at 12.30pm it’s University of Magpie time in our Ideas Cafe. The team gathers round to have lunch and learn new skills from other team members and visiting speakers. 
Now in its third year, our UoM programme runs January to December, ending with our graduation, where the team receive their training certificates.

University of Magpie 16.02.17: UX Design Masterclass 

In this session Soraya and Ruth delivered their top tips for UX design and how they think ‘UX’ when delivering our digital projects. The tips and highlights of their session are:

UI and UX are different things that need to be given consideration when planning digital projects. User Interface (how the site looks) is different from User Experience, but often the UI can improve UX. User Experience is all about how the user interacts with a product, usually a website or software.

PLAN YOUR USER JOURNEY

The first step in the process is planning the user journey. We do this with a content planning exercise we have perfected and then go on to create a sitemap and wireframes. When creating wireframes, choose functionality over beauty (for now). Creating a clear hierarchy for content allows the user to get to the information they need quicker.

THINK IN SCREENS

When designing, think in screens. This is tricky because it will differ between platforms, but will help you to understand how the user sees the site. Plan your grid and make responsive decisions early on such as transitions from one screen size to the next. We prefer to use percentages for width and pixels for height.

KNOW YOUR AUDIENCE

Know your audience and their expectations from the start. Use audience insight to inform way finding decisions such as ‘indicators of what to do next’. We are constantly thinking of ways to make the experience more intuitive for users, this includes features such as animated arrows to indicate what the user needs to do next. Don’t give users a reason to get lost!

THINK RESPONSIVELY

Whilst planning in rollover/hover states on desktop designs, remember that mobile devices don’t have this function. This is where animated indicators can really be useful – such as flashing buttons to indicate ‘press me’ or gifs that automatically show the desired rollover/hover state (i.e. letting you know what is behind a button or image if you were to click it).

Whilst animations have enabled us to do much more with user experience and often save space, remember to think about the page speed as we don’t want large animations to have a negative impact on the experience.

BE ON BRAND

Be consistent! Ensuring your site is consistent throughout makes it easier for the user and gets rid of confusion. The UX should be planned so that it’s in keeping with the brand personality and guidelines of the client you are working with. Whilst thinking of this, consider brand quirks such as using brand personality statements on 404 error messages.

USE WHITE SPACE

As designers, we like our white space (space free from design or text) but find clients don’t always value this space as they can sometimes think less work has gone into the design. White space actually increases user attention by 20% and makes the experience a lot better for them.

Easy reading is a must for user experience. We recommend cutting down word counts where possible. Our insight tells us users prefer to read text at a width of around 700px or less.

GIVE FEEDBACK

As well as error messages and redirects, also think about positive messages that signal success to the user. These can include small things like a ‘thank you’ note after submitting a form which lets the user know they have accomplished something.

DON’T JUST TEST, WATCH THE TEST

Our final tip is to test with different users throughout the process. Rather than just give users a test, watch how someone actually uses your site, track their reactions and don’t presume anything!

Join us, same time, same place next week for another University of Magpie session.