How I Did The Responsive Redesign Of ArtWeb.com In An Afternoon

For 99% of websites, design needn’t take more than an afternoon.

Chris kirkland
4 min readNov 13, 2015
The New Look ArtWeb.com

I’m lazy. Too lazy even to look for a designer.

So I gave myself the afternoon to come up with a new responsive look for ArtWeb.com.

Here’s how I did it:

First Step — Narrow Down the Choices and Satisfice

“This will do, this will be the new look ArtWeb.com.”

The template I liked

I knew in advance I’d like to use the bootstrap HTML + CSS framework, and ArtWeb.com is essentially a gallery of products (art), so that helped me narrow down the number of possible templates dramatically to “bootstrap e-commerce HTML template”.

Given the paradox of choice arising from the bazillion HTML templates/themes on the internets, narrowing down the choice is precisely what you want to do.

Next, you (probably) don’t want to spend ages agonising over making the best choice. Instead. practice satisficing — just choose the first one that meets your criteria of “good enough”.

And so I clicked on the first mostly white and clean design I saw, and after about 5 minutes of thought I decided, “This will do, this will be the new look ArtWeb.com.”

Second Step — Browser Butchery

I was able to explore what the new template would have looked like without spending even a single dollar.

Most modern browsers allow one to directly edit the HTML and CSS of the current page. Using this trick I was able to change menu items, swap images and perform various tweaks of the template I like, before I even committed to purchasing it.

I then took screenshots of the various pages I’d butchered in browser and shared them with the UX team.

I was able to explore what the new template would have looked like without spending even a single dollar (not that I was that bothered about saving the $14 license cost of the template).

More browser butchery

Step Three — Load Up Asana With Tasks

I then simply took the same screenshots I’d given to UX and attached them to Asana tasks for the various different views we’d need our dev team to code into new look.

For each task I added a few notes in addition to the screenshot/layout. Overall, I was able to assign the bulk of the tasks in little more than an hour.

Moreover, I didn’t need to specify everything in the layouts because the template came with sensible defaults (fonts sizes, spacing etc), and some additional details we’re easily explained with text instructions alone.

Step Four — …

Coding the design however took somewhat more than an afternoon, but that’s a rather long and boring Medium post. :)

Step Five—Profit

The bulk of coming up with the design, UX and layout for the new ArtWeb.com took an afternoon. There was some dotting of i’s and crossing of t’s afterwards, but the broad strokes were finished within a couple of shots of espresso.

Conclusions

99% of websites can skip design.
There’s a template for pretty much every type of website, from a bespoke system like ArtWeb to cat websites.

Users (mostly) don’t give a shit about your site’s design, so you shouldn’t either. No need to waste time quibbling on font sets, button colours and “identity” — leave that to the VC-fueled startup branding teams to bicker late in to the night. For the rest of us, finding a template that looks good and matches our needs is 90% of the work done.

If you don’t have an eye for UX or design, then hire someone who does for a few hours and get them to choose a shortlist of templates.

Speaking of templates
Speaking of which, if you’re an artist and you need a website then try ArtWeb.com. We host over 20 thousand artist websites all running smoothly on our easy to use artist’s website builder.

Note: The e-commerce template we used is called Minimal, available here.

--

--

Chris kirkland

Founder ArtWeb.com, Co-founder TokyoCheapo.com. Tech, publishing, hobo entrepreneurship and laser cats.