Code and the UI/UX designer

Now I know that many of you designers are rolling your eyes at my title and that's okay because what designer really wants to wrestle with the code when we could be making the world a more beautiful, usable place. I too have done so on numerous occasions when it comes to trying to be a designer in a dev focused team.  In an ideal world, all of the designs we produce would magically translate into beautiful, function, super easy to use apps.

Unfortunately, we don't live in an ideal world. We live in a world where time, money and the limitations our dev counterparts can and will impact how our designs get translated into functional applications.

Don't get me wrong - functionality is important, super important. But lets not forget that the user's first and overall impression of the company is strongly shaped by their ability to use the products and tools your company provides them. When we place functionality at the forefront, at the expense of design - UX and UI, it leaves the user frustrated and dissatisfied.  Functionality won't solve the user's pain point if they can't figure out how to do something, or when they are presented with a poorly coded interface which has them questioning whether or not the site is spam or not.

I've found that having a strong background in writing front-end code allows me to more quickly understand and communicate with the other members of my technical team. I can not only identify the UI bugs, but also give the people writing the code specific instruction on how to fix it.

Visual/UI Designers who get the wonderful task of writing design guidelines would really benefit from this knowledge because it should help inform them as to how to write better guidelines.  I have received a number of design guideline documents from a number of well respected design agencies in Seattle that have been written in a way that if you are a developer, you won't be able to implement most of it.

Give developers a pattern library with code snippets and it will dramatically increase the quality of your interfaces and cut down on the dev cycle since the UI is established and ready to plug and play.

Designers looking to learn more about HTML/CSS as it relates to website and web app development, I recommend spending some time getting familiar with Twitter's Bootstrap Framework and Zurb's Foundation Framework. So much of the initial set up is templated out for you, and the documentation on how to use it, is really well done.

Bootstrap has wider adoption and more extensions and plugins for those who need to build out robust web and hybrid mobile apps, but Foundation has a gentler, more design friendly learning curve.  As I got into more application based front-end web development, Foundation was what I used in the beginning.  When T-Mobile switched over to Bootstrap, I took the time to learn the differences and made the adjustments.

Using a framework to set up a pattern library is one of the BEST things you and your company can do to maintain and extend your brand from a UI perspective. 

What about you? Have you found having coding knowledge to be helpful as a designer? Thoughts?