02 Design Phase - Build a website from scratch


In the second part of the "Build a website from scratch" series we look at the design phase. It starts with some scratchy drawings on paper. It moves to building a prototype of the home pages. We look at colours, fonts and font sizes.

I draw it out on Adobe XD. This creates a prototype of the home page. Normally, I'd prototype both a mobile and desktop version off all pages on the site. I was conscious of how long that would take.

Colour Scheme

I used coolors.co to come up with a colour scheme. I opted for a neutral blue/green combo.

ACME Colours.png


I chose Monserrat as the base font. It is simple and clear. It comes in a variety of weights and suits both text and headings.


Draft Design



This one is quite long at just over 40 minutes. Most of them will be much shorter.

Yoiutube video thumbnail

Posted in Tutorial on Jun 24, 2021