UX / UI What now?
UX stands for User Experience. When we refer to the user experience of a digital product, we mean the way it works from the user's perspective - how intuitive and easy it is to use and how well it solves the user's problem. It's the design behind the design. A UX specialist will focus on solving problems for the user by understanding their problems and goals through user research.
UI stands for User Interaction also known as Interaction Design. It is - as it says on the tin - how the user interacts with the design. The polishing, fine-tuning and the bringing to life of the design. Think of it as the icing on the cake, and more. It's the icing, decoration and presentation as well. And because of the clever and thoughtful (UX) baking process, it feels free to stand out front and represent the entire cake because it knows it can rely on the total eating experience to do it proud!
The Internet is full of bad user experiences and this is not because of neglect or malice on the part of website owners, it's more to do with the nature of the medium, as constantly advancing technology can leave older websites behind, often very far behind.
Enter the UX / UI ninja ...
A well conducted UX / UI process can help improve the performance of your website or application, new or existing. The process is not set in stone and most phases overlap somewhat, but this is generally how it goes:
Research & Discovery
The process starts with a client workshop to discuss goals, establish 'must have' functionality and get an idea of your vision for the product. This is an important step and should include the whole team - designers, developers, project managers - and anyone else that will work on the project.
Research the end user group. What do you already know about your customers' problems and goals and what do we need to validate through customer interviews. An important part of the research stage is to check out your competitors, learn from them - but do it better ;)
Information Architecture (IA)
Also known as Site Planning, this is drawing up the overall layout of the site to establish navigational strategies and menu structure. For a particularly complicated menu heirarchy, enlist the help of your customers to find out what makes the most sense to them through card sorting.
The techy part is deciding on data relationships and how content will be set up in the database so that it can be displayed to users in clear and clever ways, making it appear simple to them.
Persona & Scenario Creation
Armed with research, you should be able to establish who will use the product, where, when and how they will use it. Create a personification of the user, complete with name, photo, likes and dislikes. Keep this person (or people - there may be more than one) up-front and centre throughout the design and development process to keep the whole team (client included) grounded and reminded that this product will be used by an actual human being.
Designing, Coding & Deployment
With wireframes as a base, we can fine-tune the design. As mentioned above, the finished design is almost there by the prototyping stage, so the final design stage is mostly polishing and fine-tuning - working out transitions and micro-interactions. My favourite design tool is Sketch, but I'm also loving working with Adobe's latest creation which has - at last - been built for purpose; Adobe XD (Experience Design).
I work closely with the front-end developers on the team who will use my Invision protoypes to direct their work. To maintain a visual identity and consistency across designs, I develop a UX style guide with HTML / CSS examples that becomes the go-to place for front-end development resources so that nothing gets lost in translation.
I always make sure to add some in-app feedback, such as Usabilla or Intercom, and analytics tracking, such as Google Analytics, code so that when the product has been released into the wild, it will be a lot easier to manage continual improvements with visibility into how users are getting on with your product.
Rinse and repeat.
"If we want users to like our software we should design it to behave like a likeable person: respectful, generous and helpful."
- Alan Cooper