Alas. I have to face it. My design chops are terrible.

The design sensibilities of the A-list web apps these days are just amazing! They look beautiful. They animate and transition as smooth like butter. The colours. Oh.. The colours…And the icons.. Oh.. The icons..

I’m not sure if you’ve seen Dribbble.. but wow. There are some amazing designers out there doing some amazing work.

Add to that all the amazing stuff happening in mobile. And.. Well..

The bar is pretty high.


flickr photo shared by ch.weidinger under a Creative Commons ( BY-NC-ND ) license

Even for guys like me who spend most of our time developing enterprise apps that are often intranet hosted, the bar is getting higher. Clients are developing an appetite for beautiful and usable.. And so are we as developers! Which is awesome, but challenging for us guys who are more comfortable writing unit tests than working with HSL colour codes :-)

So what to do to keep pace? Here’s what I’m doing…

Option Now: Template your way to success!

My current commercial project is built around JSF2. I know people have a hate/hate relationship with JSF, and it’s not for everyone, but this year I’ve done productive work on Microsoft, Node.js and Java stacks, and the JSF stuff is just as productive to me as anything else.

But by default JSF apps look terrible.

Enter Primefaces Themes.

In my case, Adamantium.

[](“Adamantium Theme”)
Adamanitum Theme by Primefaces

I’m just finishing off giving a complete facelift to an internal corporate app using Adamantium and it looks absolutely fantastic. The animations are buttery smooth. The colours are vibrant and engaging. Even the gray shades look good. And the icons… Oh.. the icons.

If you’re doing any work with JSF or Primefaces at the moment, it is totally worth investing in one of Primefaces Premium themes and layouts. They will give your app a beautiful, modern, professional feel, even if you have zero design skills.

And while it can be difficult to get funding for external hourly-rate design work, the fixed price of a template is easy to cast vision for! You should just go buy one!

Option Next: Don’t just sit there, copy your way to success!

Working with a template is itself a learning experience. It gives you insight into how real designers do things. You get to see how they approach laying out a dashboard, how they handle the user experience of navigation, where animation works, and how you need more whitespace!

As a software developer, I’ve had a few cracks at learning design skills, and never had much success. In my latest effort, I’m just templating my designs off people who know what they’re doing. It’s called copywork, and it’s the kind of deep practice that levels you up along the way!


flickr photo shared by marc thiele under a Creative Commons ( BY-NC-ND ) license

I’m totally convinced that my design sensibilities are there - I certainly recognise that the things I’m producing don’t look and feel great from a UI perspective… which means that I’m just a bunch of copywork practice, persistence and volume of work away from having some better design skills!

Watch this (someone visually unpleasant) space for improvement. :-)

Get some inspiration!

Need some inspiration as a developer to get back on the design horse?

You have to watch this 2 minute video on the creative process - it will totally inspire you as a developer to lift your chops.

The most important possible thing you can do is do a lot of work. It’s only by going through a volume of work that you’ll actually catch up and close that gap and the work you’re making will be as good as your ambitions. It’s normal to take a while. And you just have to fight your way through that. Ira Glass

Now go buy a template, go to school on how they did it, and get busy leveling up on some copywork!