
So you are doing your own personal website. Do it like you where doing it for a client.
I have recently started the process of designing my personal webiste. As designers we want our websites to be outstanding, our desire is to show a reflection of our work and of course to help us achieve our personal goals.
I had tried before to launch a personal website with some basic features as my portfolio, about myself page, blog page, etc. But every time I wanted to launch it I failed so bad. End up wondering why I have failed if I am perfectly capable to do it.
Pretty often I see how most of my design colleagues’ websites are just a template (mainly Wordpress) with tiny code modificaciones, a couple of widgets in the sidebar and lots of gifs. After they have set up their site there is this thought that comes across all my friends:
“I have bought this awesome template but it takes a lot of time to set up, it needs expensive plug-ins and at the end my website doesn’t look much as I thought I would look”.
I made the same mistake over and over, just like my friends. The awesome template is not that marvelous anymore and I end up having an online portfolio that I detest trying to update it with new templates with no clear direction.
Just a few days ago I decided that it was about time to have my portfolio back online but this time I knew I needed to take a different road to don’t crash again.
What I’ve done wrong all this time?
So there I was in front of the mirror pretending I was a client asking myself that I would do different if I was asking somebody else to do this job.
Now, imagine that a customer comes to you with an idea for a website or app. What would you do to make a great design for him or her? I think that asking yourself this kind of questions is actually the point to start making yourself your personal website.
Most of the time we don’t give to ourselves the added value that we give to our clients. And that is a huge mistake.
It is proven that following a step-process to design a website is a good practice to avoid making mistakes. Digital design takes a lot of time and just a setting up template does not mean having a website. There are many steps in the process of designing so I believe it is a good idea to follow for yourself the same process you will follow for a client. You, more than anyone else deserve it. Some of the steps that I consider essentials would be:
- Define your objectives. What’s the purpose of your website, why do you need one. This can be a sort of briefing.
- Make some interviews. The thing is that when we start a digital project we often interview the client, their customers, we do workshops with stakeholders, and often perform other research techniques as shadowing, etc. Now, you do not need to do all that but you certainly need to get out of your home or studio and ask people that surrounds you how do they see you, what values they think you have. This will give you tons of ideas for a fresh start.
- Create a moodboard with your designs, other people designs, photos that you like, magazine clippings, etc. Play around with the moodboard, categorize images by color, size, shape and try to come up with stories. That will help you to identify a pattern in your artwork.
- Concept your website. Since we conceptualize for clients why don’t we do the same for ourselves. Remember that a concept can be an image, a color, a sentence, etc.
- Do some sketches and wireframe your site. “We will do wireframes since we can focus mainly in the functional part rather than visual”. Sounds familiar? There is a value in doing wireframes. There is no need to make a detailed wireframe, a high-level old-school wireframe would be enough. At this point you can start looking for a template that matches your greyscale layouts if you do not know enough html and css to code it yourself.
- Design it. Open your favourite design program and start applying colours, typographies, moving around images, trying out some buttons styles, shadows, etc. Now it is time to set up the template with your designs.
- Set an MVP. You don’t need to have all finished in a week. Set different goals and scale the effort.
- Prove your designs with one project of your portfolio. When you are happy enough move on and apply your designs to the rest.
- Test it. Open it from different computers, mobiles, tablets, etc. You know that, what it looks great on your Mac may not look great in the rest of devices. You may picture somebody openning your website from a 24 inch iMac and allucinating with your work. But most people will look at your site while they are procrastinating somewhere eating a snack or commuting from home.
- Perform an heuristic test, it won’t take you more than 20 minutes. It is basic by we frequently forget.
- Test it again. Change your site. Test it again. Change your site. Test it again. Change your site. Test it again. Change your site. Test it again. Change your site. Well, you get the point.
I know this list may look just too much but at the end it takes less time to do things correctly than jackrabbit from one place to another within a template. When you start a process, you know what step to take next so you won’t get lost or asking yourself what to do next or which way to go.
Thanks for reading
I will keep writting about web design, UX&UI and art direction. Please follow me to read my posts.