I wanted to redo the web site for my mobile app development company, Biscotti Labs, because it had some stale design and content. DrupalCon 2013 is coming up fast, and I’d rather update the site before rather than after. Also, I wanted to make the site responsive for smartphones and tablets.

I’ve been a little bit frustrated with ThemeForest templates - they’re usually far too complex, present way too much information, and turn out to not be built on top of any kind of reusable framework. Additionally, I decided not to run the site on a CMS, but instead just make it a single page site with a static HTML file.

There are several front end development frameworks to make the job a little easier, but the one I’m most familiar with is Twitter Bootstrap. You can buy a pre-built theme for Bootstrap from several marketplaces, but I decided to give the WYSIWYG Twitter Bootstrap editor JetStrap a shot - it’s from the same great team that built Codiqa, the visual design and prototyping tool for jQuery Mobile.

JetStrap makes pretty clean HTML and CSS, and I took what they had, edited in their interface, and then downloaded the HTML and assets locally. My next step was to use some resources from my favorite design marketplace, MediaLoot. I went with a set of flat Photoshop vector icons, scaled them up to 512x512, and then used those to provide some visual context for the various solutions and services. JetStrap included some hot-linked blurred background images in the HTML, so I replaced those with blurred background images from another MediaLoot image set.

Overall, I’m pretty happy with the design of the site, though I certainly need to tweak it, and test it on a few mobile devices.