UX & UI Project Guidelines
These are the basic steps I aim to go through with every UX/UI project both at work and for my side projects. The biggest part of my process is the research and think about the design problem and solution.
- Who are the users? Write down their characteristics and look at it continuously during the project to build empathy. Personas can be used here.
- How and when is the product/system going to be used? In a hurry? While highly stressed? Sitting down and relaxed? While walking/exercising? Inside? Outside? At night? A leisure app will need different considerations compared to for example an alarm system.
- Understand what the stakeholders want from the project. Increased sales? Increased brand awareness? Getting the users to take a certain action (sign up, use something, etc)? Or are you perhaps solving a certain problem?
- What are the most important actions – Red Routes? Write them down and make sure that they are quick and simple to reach (1-3 clicks).
- Create a site map & feature list. Write down all the features that need to be developed for the site, which is very important for the developers to know. Then create a site map: Where do users first land, how can they navigate to the different red routes (most important actions) and which other states will need to be mocked up. How should the basic screen flow look like?
- Ideate design solutions with quick sketches. The first idea is almost never the best. Try to brainstorm and come up with as many solutions as possible.
- Evaluate the different solutions and choose one. Evaluation can be done with peers or through heuristic evaluations. Write the pros+ and cons- for each screen.
- Create mockups and prototype the screens. Make it interactive and make sure every screen is included. Ideally also different screen sizes (desktop, tablet, mobile).
- UI inspiration can be found for example at Dribbble, Instagram and Behance.
- Usability testing on users needs to be done on the prototypes. Preferably on people who are similar to your end-users. Ask them to go through the Red Routes (for example: Finding a product they would want to buy and buy it). Observe if the user is having trouble doing it and where that trouble happens and ask elaborative questions to find out more.
- Heuristic testing. If you don’t have the possibility to do usability testing you can still evaluate the design with design heuristics for example Normans 6 principles (visibility, feedback, constraints, mapping, consistency and affordances).
- Fix the usability problems and test again until the users can go through the tests without problems.
- Ask for feedback. Good feedback can come from many places but preferably by other designers and usability experts.
- Develop the project in code. You could use WordPress themes as a template to build upon for basic websites. There are a lot of free templates available. Building from scratch can be fun too, especially if it’s a rather static page.
- Domain name and a hosting service is needed to upload a something on the internet and on a specific domain name. This costs every month/year.