This is a brief case study example of a few types of thinking that goes into an interface design, this is a Global telco re-design of their member login dashboard. This particular project is also a responsive solution so there are certain efficiencies and consistencies one must add to the design. In a sense it is mixing common sense with efficiency planning. The experience must work for the user as a pleasurable one, then there are factors like technology and device, back-end limitations, brand guidelines, best practice mobile OS Graphical User Interface sets and even the written language and sentence casing.
As a mobile-first thought out project, simple informative language suited to the brand is used alongside mobile best practice techniques. In general mobile use behaviours one designs around less navigating, particularly with mobile sites due to browsing speeds. By keeping the mobile solution light weight in the build and focusing on the key user functions you can try to have on-page user flows using available technologies such as backbon.js, jQuery, ajax queries and the likes. Animating and changing menu navigation techniques like menu toggles and other show/hide functions help assist in a more plreasurable mobile experience. So when it comes to designing for mobile users, start by thinking of key User tasks first. To keep loading times down use a clean CSS techniques for light loading. When designing responsibly try and account for less work for developers to manually custom deliver code, re-use, template and structure the code sections in an efficient manner.
Forming not only a consistent user experience through design elements, in this project a number of user scenarios were mapped out using consistent language for prepaid and postpaid customers. By keeping the position of elements consistent, any user who changes to post or pre paid plans will have an easy transition. One other consistent theme to note is to make sure that a re-design isn’t too much of an over haul. Sometimes if you have a large following of users you might want to push features in small chunks as not to confuse them into errors and failed tasks from their everyday User Interface experience.
Concept sketch wireframes. Thinktank. Site architecture study. User flow scenario. Back-end limitations. Information architecture. Apply User Testing results & outcomes.
Responsive navigation. Grid system. Efficiency planning. Mobile design element style guide. GUI set up.
The system should speak the user's language, with words, phrases and concepts familiar to the user, rather than system-oriented terms. Follow real-world conventions, making information appear in a natural and logical order.
Design layout. Best practice mobile behaviour driven features.
Even better than good error messages is a careful design which prevents a problem from occurring in the first place. Either eliminate error-prone conditions or check for them and present users with a confirmation option before they commit to the action.
Best practice mCommerce research. Interaction design research. Best practice dashboard UI study.