Design Hacking for Engineer Founder

Imju Byon
GreenSprout
Published in
2 min readJan 10, 2017

How to design your web site like a pro when you are not designer

I didn’t have budget to hire designer and worse, I didn’t have much experience of front end skill such as css, here is how I survived to design my site, http://greensprout.co.

Buy Well Designed Bootstrap Theme

First, you can buy a bootstrap theme to give you head start. The price of bootstrap theme is not high and you can find them in theme marketplace easily like ThemeForest or WrapBootstrap.

Bootstrap is a well known and widely adopted css framework thus you can find many help when you get stuck. Also, someone good at front end already spent quite sometime to look good in their theme, so it is null brainer to go with Bootstrap theme.

You may say that I want to save some money by going with free theme. But they are usually lack of documentation and support for upgrade. I can live without upgrade but not enough documentation was a killer for me.

Theme sample pages in my bootstrap theme

As a non designer, I didn’t have a good eye on what component may look good on my website. The theme that I bought wasn’t best looking, but it has a lot of samples of many UI components thus this was very helpful for me.

Choose your model site

What site inspires you most? In my case, I liked AirBnB’s UI strategy of using image and map data with good excerpt of header information about listing in the search. This became a theme for my search result page and looked alright.

Search Result Page from GreenSprout.co

Then I used EventBrite as an inspiration for my class registration page. You can choose two or three sites to mix for your creation.

Color Selection

I used most of color selection (ex. it has base red, blue, grey, orange selections and base color for fonts.) provided by the theme. The theme was created based on trend with text light font with grey color. It looks good at first, this wasn’t helpful for reading content because there is not enough contrast on text. I changed to use darker color for text font.

If you are looking to change overall color scheme, https://coolors.co/ is a good place to pick a cool color scheme for you.

When I was daunted by so many decisions to make, the methods mentioned above helped me move forward in design side of my project. I hope it finds useful for someone who doesn’t have design skill.

--

--