Share

Add a beautiful interface to an online secure cloud service

The default nature of familarity has almost led to what I term ‘The Death of Web Design’ – as the web as been around for almost 20 years the general public, you people out there, are very familiar with how websites work and you don’t need web designers to re-invent the wheel every time. End users instinctively know how navigation patterns should be. And how they have become hard-wired to recognise these patterns.

As UXers, should be follow these patterns - and try invent news ones as we go along.

My Account

Recent activity

Learned behaviour is something people do very well. Past experience in effective, determines future behaviour. Links change colour to reflect roll-over states, bullet point summaries and call to action (CTAs) always have prominence. Here left navigation signposts the four main gateways.

LokyVault-DesignAndWireframes07

My Account

Contact List

Universal design conventions dictate that when small thumbnails are tapped or clicked, something else happens. Google and TripAdvisor both do this, even Amazon and Yelp – This is an established pattern. It’s simply understood without explanation.

Here searching drop-downs never deviate from what is expected. Users looking for a seamless experience will face resistance on sites they design should there be inconsistencies.

LokyVault-DesignAndWireframes08

My Account

View files

The gestalt laws of similarity and proximity can, for example, be used as guides for placing drop-downs, thumbnails and pagination. Here, positioning and grid structure play an important role and follow these laws.

LokyVault-DesignAndWireframes10

My Account

View files – General

The pop-up mechanism is a useful tool to briefly take the user out of the flow and then back in. This way navigation does not become disorienting and tasks get completed.

LokyVault-DesignAndWireframes12

My Account

Pop Up

Module UX is a clever technique to employ. Especially when the flow becomes complex with many moving parts. One action can lead to a multitude of others, which can change. So, design the flow so one screen does not depend on another. Good for you , good for development.

LokyVault-DesignAndWireframes15 LokyVault-DesignAndWireframes16

My Account

Payment details

Google recently pioneered initiative UX with their treatment of forms and input fields. And love it. Having the ability to edit right there not the page rather than jumping out to a pop-up or another page is not only genius but makes sense. Word processing programs have been doing that for years, why not on payment screens for both mobile and desktop?

LokyVault-DesignAndWireframes17Conclusion

So, for all you budding UXers out there this has been a short UX and UI intro and thought process. My key take-ots here are;

  • Design patterns
  • Learned behaviour
  • Universal design conventions prevent those annoying inconsistencies
  • Gesalt principle – learn them and follow them
  • Edit form – right there on the page

Try and use these processes when designing your next project.

Get in touch

This is but part of a selec­tion of design articles spindlelegs gen­er­ated for the creative community out there. Please con­tact us fur­ther to dis­cuss if your brand really wants to ben­e­fit from this new immersive experience here: info@spindlelegs.co.uk

If something has peaked your interest. Please leave a comment below.