Coding is no longer just a 'bonus skill' for User-Interface Designers. Today's UI landscape is far different from just five years ago. The rise of Lean and Agile UX has converged processes, and the explosion of mobile and tablet has taken us into a device agnostic era. For UI Designers, this means a responsibility to be more holistically integrated throughout the iteration process - as well as increased technological complexity. But beyond this, knowing how to code improves your design fluency, and makes you a more proficient designer - but one of the biggest benefits is the ability to build rapid prototypes for true iterative design and testing. It's all covered in 27 slides. Thank you for viewing and for sharing. - Lawrence Black

1. Why Today’s UI Designers
Need to Know How to Code
Lawrence Black, Founder Pivoture.com

2. ‘Before I consider
hiring you as my
UI Designer, I
have a question’
“Can you code?”
The Following is
A Valid Question

3. I’m a UI Designer, not a Developer.
But my portfolio speaks for itself
“
”
The
Designer’s
Rebuttal

4. Stating the Obvious:
‘Don’t you already have
people who code?’

5. “You must be looking for
one of these”
Population
Unknown
Last Sighted
@Pivoture*
Known Habitat
Your Product
Manager’s dreams
* shameless plug by @lawrenceb143
The Unicorn Designer

6. This is an increasingly debated topic
within the UX Community:
1. http://uxmastery.com/how-much-code-should-a-user-
experience-designer-write/
2. http://quotient.net/2012/07/should-a-ux-designer-know-how-
to-code/
3. http://blog.uxpin.com/1702/should-designers-code/
4. http://www.uie.com/brainsparks/2011/05/31/why-the-valley-
wants-designers-that-can-code/

7. We created this deck
to explain why coding
has become an
integral asset for
User Interface
Designers in 2014
and beyond.
Our
Contribution

8. For years, coding has been
confined to Engineering.
So why are we having this
discussion now?
Why Now

9. Within the last 5 Years the User Experience world
has seen radical change
Process
Convergence
Device
Agnosticism

10. Design and
Development
are no longer
black box
assets.
Process
Convergence
How products are
being built, managed,
and optimized has
completely changed.
Gone are the days of
passing designs over a
wall to developers.
Lean and Agile have
shown us a better
way.

11. Process Convergence
Internet Search
Volume:
‘Lean UX'
The Rise of Lean and Agile UX
Lean UX
2005-Present
Source:
Google Trends
Internet Search
Volume:
‘Agile UX'
Agile UX
2005-Present
Source:
Google Trends

12. Process Convergence
Acceptance
Requirements
Deploy
Design
Coding
Waterfall

13. Lean and Agile UX
Discover
& Define
Design &
Prototype
Validate
& Test
Code &
Build
Measure
& Learn
Teams are More:
Cooperative
Cross-Functional
Communicative
Co-Located
Process Convergence

14. The Impact of Process Convergence on UI Designers
For UI Designers, process
convergence means you are being
relied upon to be more holistically
integrated throughout the entire
iteration process. Knowing how to
code greatly improves both your
ability to communicate and the degree
to which you can contribute and
participate.

15. The explosion of
mobile and tablet
means not just
increased design
complexity - but
increased
technological
complexity. It’s not
enough to think solely
in terms of responsive
‘design’.
Today’s users
are device
agnostic.
Device
Agnosticism
Game Changer #2:

16. 0.00%
2.00%
4.00%
6.00%
8.00%
10.00%
12.00%
14.00%
16.00%
18.00%
20.00%
Aug,2012
Sept,2012
Oct,2012
Nov,2012
Dec,2012
Jan,2013
Feb,2013
Mar,2013
Apr,2013
May,2013
Jun,2013
Jul,2013
Aug,2013
Sept,2013
Oct,2013
Nov,2013
Dec,2013
Jan,2014
Feb,2014
Mar,2014
Apr,2014
May,2014
Jun,2014
July,2014
Mobile and Tablet Web
Traffic Growth Aug 2012-Present
Device Agnosticism Source: NETMARKETSHARE

17. The Impact of Device Agnosticism on UI Designers
Knowing how to code is a valuable asset
when designing responsive experiences.
Here [mobile and tablet] in particular,
the ability to ‘design in code’ and
manipulate CSS (@media) styles in a
sandbox gives you significantly more
choice and control over the care and
attention to detail your product’s mobile
User-Experience receives.

18. CSS: The most important language for designers.
Knowing CSS improves your fluency
as a UI designer and increases the
fidelity of your designs.
CSS proficiency also means being
able to design to the full limits of the
browser, using native styling, which,
with the addition of CSS3, has
become more robust than ever.

19. A Important Note re: jQuery
While the main focus of this deck is to
encourage UI Designers to learn CSS and
HTML, it’s important to note than
familiarity with jQuery is paramount for
UI Designers who want to design products
within the context of today’s best front-
end interface technology. Without this,
your IXD capabilities are restricted by
what you know is feasible. Don’t limit
yourself only to design patterns.

20. Learning to code
does more than
make you a more
proficient Designer.
It allows you move
beyond the limited
scope of paper and
digital wireframes
and into the realm
of…
Moving
Beyond
Wireframes

21. RAPID PROTOTYPING

22. Rapid Prototyping is for more than
just early stage startups.
Building rapid prototypes allows
you to get working designs in front
of stakeholders and users for true
iterative design and testing.
Rapid Prototyping

23. Wireframe Prototype
Rapid Prototyping

24. Benefits of Rapid Prototyping
 Improved feedback & analysis
 Native views (responsive)
 Native styling (fonts opacity, hover)
 Interactive pixels = improved testing
 Faster acceptance and iteration
 Better suited for lean, agile
methodologies
 Higher fidelity = better attn to detail

25. RECAPPING
5 REASONS
WHY UI
DESIGNERS
SHOULD
LEARN
HOW TO
CODE
 Increased iterative
participation for today’s
processes
 Greater mastery over
responsive interfaces
 True UI Design Fluency
 Ability to design to the full
capabilities of the browser
 The ability to build rapid
prototypes

26. “I can’t imagine not
knowing how to code -
especially since it’s the
medium I design in.
I use Firebug and an
auto-refresh plugin to play
with a given node until I
feel it’s ‘right’ –usually
somewhere around the
15th iteration, but that
number used to be a lot
higher.”
Lawrence Black
lawrence@pivoture.com
Pivoture.com/contact
@lawrenceb143
Solutions
Connect with Me
Our Services

27. Join our Weekly Best
Practices Mailing List
ENJOY THIS?
Thank You for Your Time.