What would be the benefits of knowing JavaScript as a UI/UX designer?

Question

I'm a UI/UX designer and work for a start-up creating a web-based application serving a specific target audience. Although not required for my job, I'm trying to teach myself JavaScript and would like some of the JS experts out there to tell me how knowing JS could help a UX designer and in what respect. Also, I'm wondering how challenging it would be to get familiar with it given that I have some basic knowledge in jQuery and ActionScript3.

Answer 1

The most important reason to learn Javascript is to be able to build what you design. A lot of interaction designers approach their work from a visual standpoint, which worked well for the past decade, but as we move into an era of "web applications" where rich interactivity is increasingly important, it's essential to be able to grasp what kind of behaviour is possible in the browser.

It's also fundamental that you be able to model, to the finest details, how certain interactions work for users. This won't be possible if you don't know Javascript (or a JS library allowing you to do so, like jQuery). And you don't want to leave detailed interaction decisions which fundamentally affect the user experience to a front-end developer who's great at javascript architecture but poor at determining what's important to users.

How far you need to go when learning Javascript is up to you. I don't think most UI tasks require you to understand closures or the intricacies of prototypes since most libraries will cleanly wrap these features in abstractions for you. As long as you can use Javascript to obtain your goals, which is perfectly possible with libraries like jQuery or Mootools, you should be fine.

Answer 2

Having a basic knowledge of any type of technical domain is useful for a designer, you will be able to think what what is possible / not possible, expensive / cheap as you design. For this reason it would be a useful tool. It also may help you prototype solutions for user research (although there are ways to do this that are cheaper than learning javascript).

In terms of actually writing production code, this really depends on the organization you are in. I know some teams where the UX person will stop at wireframing, and some where they will be responsible for wireframing, visual design and front-end HTML / Javascript. I would say the former is more common. I think jobs where you were required to do both would be in the minority.

In terms of learning Javascript? It is actually a really well-designed, intuitive language. There are a ton of books and community resources, and very simple development environment (notepad and browser). So, if you have the knack for programming it would be relatively easy to pick up. Although in terms of depth, a long path to mastery!

If you were thinking about dedicating some significant time to learning JS, I would weigh it up against your other skillsets. For example spending more time learning about User Research may provide more bang for your buck in terms of future UX jobs.

Answer 3

It's the same benefit as knowing how to build a house helps an architect. Understanding the medium one is working with is a good skill to have.

An architect that only knows how to use the pen can still be a good architect, but one that also knows how to pick up a hammer tends to have better insight into the types of building solutions one can come up with.

Specific to JavaScript, I think the main benefit for a web UX designer is that it enables you to prototype directly in the medium of HTML/CSS and JS. You can also better communicate with your UI dev team.

From my own experience, knowing JS has allows us to call out bad vendors who lacked basic UI skills and would claim "That can't be done". We'd just then build the UI ourselves and send it over, leaving them no room to wiggle out of their inabilities.

It also has allowed me to design in code, which is a boon to our IAs and others on the team. We can work much more iteratively. They tweak their wireframes, I tweak the code, and we can go back and forth quickly.

Finally, I think knowing how to build something helps you as a UXer to understand all the individual points of interaction that have to be thought about. I find that it's common for UX people with no code skills to create wireframes that make a lot of sense on paper, but are missing at least half of the interaction specifications required to actually build it.

As for jQuery vs. JS, jQuery is JS--just faster to write. I say learn jQuery and as you learn it, you'll find that you're learning a lot about how JS works as well.

Answer 4

Others have answered that you can build what you design - or at least that it is one route to doing this.

This doesn't just apply to web design. I have seen a number of UX people in different companies using javascript to help design, build and test interactive prototype displays of their physical product designs interactively before taking them further. It happens that in each case, they were using Raphael to mock up the display of their embedded device (these are typically fixed segment LCD displays). It's a quick, cheap and powerful way to determine initial viability.

Javascript is just one of many options for being able to build something that allows you to engage with your concept, but it just happens that there are many easily accessible utilities and examples out there that help make the task (and the learning) easier.

If you do want to experiment, I recommend jsfiddle as a useful resource to play around with javascript and various frameworks.

Answer 5

As many have pointed out, it helps you build your design.

I'd like to enforce that you should be able to build your design. When I make a carousel or other thing in JS/jQuery, what really matters is how fast it rotates, which direction, how many images, if it should fade, etc. Usually those are just parameters and I prefer the person with the idea play with those parameters until perfected rather than me the programmer.

This is the same in the games industry. The game designer should know enough code to tweak parameters. I.e. coder creates jump-function, designer tweaks how high and how fast. Etc.

Also, instead of putting your time into explaining what and how you want it - you can just do it (or at least a prototype of it).

Answer 6

It is useful for you to learn what Javascript can do - e.g.

• play with the JQuery UI demos
• read up on form validation using javascript

But unless you are going to seriously program in Javascript (which you might do since its a start up), I don't think that you will get much UX benefit from learning the basics, you'll more likely end up frustrated.