Klein Visual Launch

It’s been a long 4 months. This past April, I sat down and decided that I wanted a personal portfolio website to showcase my design work. Being the stubborn type, I determined to build it entirely on my own, from scratch, without using any third-party templates or styles.

We have liftoff!

Four months and over 150 hours later, I can call the website completed. It’s been a long road of late nights, learning from my mistakes, crying, and scouring StackOverflow for solutions to obscure JavaScript bugs (not necessarily in that order), but I believe as a result of this project I am a significantly more capable designer than ever before.

A rocky road, littered with snakes and broken glass

The earliest weeks into the project I spent brainstorming site maps and layouts, which I generally sketched on paper. From there, I was able to develop a wireframe layout in Adobe Illustrator. It’s funny all the UI elements you imagine in your head or maybe sketch on paper that don’t work in practice. There’s not enough space for my dreams!

With the wireframe complete, I spent several days creating a “style tile”, a unique tool I read about on this website that enables you to define the overall “visual language” of your site, from backgrounds to buttons. This proved invaluable in keeping my site’s CSS concise.

With all my wireframes complete, I began the arduous task of building the HTML and CSS content. CSS is an amazing, beautiful beast that doesn’t always do what you expect. Fortunately, I learned about and employed the BEM Method in the development of my styles. I quickly found that consistency is the key to keeping code clean and avoiding bugs. For two months I coded, tweaked, retweaked, recoded, and simplified every aspect of my site’s base template.

It was only within the past month I began building out additional pages. To accomplish this, I used the super awesome and open source static site generator Jekyll.

What’s to come?

I’ve learned and accomplished so much more than I thought possible with the resources (and time) available to me. Over the coming months, I hope to share some of the insights I’ve gained into the process of developing a personal website from scratch, and reflect on some of the biggest mistakes I made and challenges I faced.

Stay tuned!

I want to say thanks to all my Instagram followers, without whom I might not have believed anyone would take an interest in my designs or photography.

My biggest thank you goes to my amazing wife who has always supported me unconditionally in all my endeavors, and who provided so much valuable feedback on the design of this site. You rock, babe! <3

Finally, thank you for visiting my site, please feel free to leave your comments and critiques below, and have a great day!