Designing your own website is really difficult. You are your own client, you know what you like but for some reason you are just never done!
If you do a site for client, you will normally have to work with their goals and your taste has nothing to do with it. You are there to make their vision possible.
I have tried to design my website for a while now. My first mistake was hammering in my head:
Luisa, you are not a designer.
True, I don’t have the chops, I don’t have the problem-solving thinking skills that designers have but this doesn’t mean I can’t, with a little bit of work, create something from nothing.
I have a side project and I wanted to design a site for it, I wanted it to serve one purpose, I wanted to use it to learn a bunch of things on the way and I needed it to feel like home.
Some of my questions:
1. Should I hire a designer?
The answer was pretty obvious. I can’t afford one yet, plus I wanted to do the exercise myself.
2. Should I go through my process to build my site?
I have a questionnaire, I have my layouts, I have my planning guide for clients, should I follow that?
3. Should I create my own graphics?
For the moment, my site is mostly text and watercolour illustrations which I photograph or scan. Unless I become fluent in illustrator, I don’t need custom graphics at this time.
4. Should I concern myself with branding? Do a branding exercise?
My side project is less of a business than a place to put my thoughts so, no, not at the moment.
5. Do I have a vision?
Short answer, No.
Ok, I know this goes against everything that we read about in web design but hear me out…
My brother-in-law is a woodworker, he and my sister have been married for 15 years and it was only last year that she had her kitchen cabinets finished. It’s the same with designers.
Any designer who sets out to design their own website will spend months if not years working at it, and when it’s almost ready they want to start over. So if you’re going the DIY route it won’t really help to have a vision set in stone.
So what did I do?
Here it goes:
Moodboards are helpful but I discovered that a Moodboard for your own design project takes time. You can’t sit an afternoon and pin images like crazy and draw a conclusion. My moodboard has been brewing for a while. I’m ashamed to say how long though. It started with bold Mexican colours, it ended with the subdued South-of-France tints.
2. Design in the browser if you’re coding yourself.
Unless, of course you require lots of illustrations, you need a graphic for your header, you are planning on adding lots of font-icons or SVG etc. Maybe you might consider designing in photoshop, but what I have learned over the past year is that good typography can sometimes lift a design way more than graphics. It happens when we decorate our home as well, if we buy wall art we get tired of looking at it over the years. Of course it depends on your aesthetic and your taste, but I really recommend you design in the browser so you can get the feel of your site immediately.
3. Do a quick style-tile or if you’re more ambitious, as you design build your style-guide, either way get your palette, fonts and buttons, straight quickly. My style guide was a sticky on my mac, since I’m not into pre-processors yet and generated a Kuler color palette.
4. If it’s your personal website and you are learning to code as you go, I strongly suggest you create a static site with the help of a static-site generator like Jekyll or Middleman. You will see all the pieces working together: creating templates, layouts, includes, modular code, git and github. I can’t recommend this enough.
5. Use Github to keep track of the things you want to tweak, add or change using issues. I found this to be the ultimate to-do list. Forget Trello, Wunderlist et al.
(Actually use Github for everything! Even free hosting!)
6. Document your process. Bookmark the tutorials that were useful, thank the people who wrote them, choose a reference site like the Mozilla Developer Network or any other of your choice and get comfortable using it so you speed up when you need help. Visiting Google search results makes you waste time, plus if you really want to understand how an element or property works, better to read the standard than to copy and paste code.
Lastly if you’re so inclined, write a blog post about the experience.
My side project is a website where I explore creativity from a different perspective, far, far away from the popular adage of “Do what you love (and then turn it into a job)”, I want to explore what is talent, artistic expression and creativity and what happens when you discover your one true creative outlet, how to protect it, how to hone it and how to be joyful in creating.
Designing the website was part of it. This is the current version which will certainly evolve.
Do you design without considering yourself a designer? How do you go about it?