When making a design for a website it’s important to also design the UX, or the User eXperience. When you design the UX, you’re designing the feeling users get while using your website. To design the UX there are a couple of basic steps:
Step 1: Research
Before you start making the real design you first need to know some facts. You need to know what is the purpose of the website, what does your customer want and last you need to know as much as possible about the final users, also called the target group.
In large projects you will have the opportunity to really investigate the target group with surveys and interviews, but on smaller projects you will have to do with some online research. You at least should be able to answer these questions:
- Who is the target group?
- When will the target group use the website?
- Which device will they most likely use for your website?
- What is their basic knowledge about computers and websites, for example are they familiar with the hamburger menu or not?
Step 2: Structure
During this step you will decide which element goes where and which animations will be used. To decide this you can make a site map or wireframe(s).
- Site map: This will be an overview of the structure of the whole website, it will tell you more about the navigation structure.
- Wireframe(s): These are very basic structural overviews of the pages. There will be no final design in these images, only frames, lines and basic text to show the location of the different elements.
Step 3: Design
Now it’s time to start to design. In this step you will again start with researching. You can look at other websites for inspiration. If you would like to keep an overview of all the things you liked you can make a mood board. After this you can translate the wireframes into a visual design.
For more information about this subject you can look into User Interface design or UI.
Step 4: Testing
Best practise is to test at the end of each step to make sure you’re still on the right path. In case you didn’t do this you can now test your prototype of first version with your customer and the target group. You might want to test if users experience the experience you wanted to create with:
– Focus groups: When using a focus group, you will test your product with a small group of people that will represent the target group.
– A/B testing: A/B testing means testing two versions of your website. It’s important that both versions are really similar, only with some small differences like colour or the location of a button. If there is too much difference it will be hard to decide which option is the best because it could also be a combination of both.
Now you did the 4 steps it’s time to start coding. When the coding is done you can always test again to make sure that everything is still right.
I also made a presentation about this information, you can find it here
Posted by Amanda de Rijk