Difference between a UX Designer and UI Developer and Web Developer

  • Date
    October 25, 2013
  • Client
    Ritesh Narang
  • Tags:
    Designing, Development website
View Project

About

User Interface Designers are the guys behind interaction design, storyboarding, usability, user experience and visual design of the application or website, while User Interface Developers are the guys who are responsible for taking what designers did and code user-facing part of the application or website (on the web, those are usually the guys who know absolutely everything about cross browser issues, progressive enhancement, HTML, CSS, JavaScript and such – on iOS those might be simply developer who knows Objective C).

User Experience (UX) Designer = Research + Design
UI Developer = Design + HTML/CSS/JS
Application Developer = Back-End coding + HTML/CSS/JS etc.
As much as I’ve tried to avoid it, I just haven’t been able to prevent myself from creating a Venn diagram to visualise this.

ux-vs-ui-dev-skills-simple

These different combinations of skills bring with them a different perspective and focus on what each person does.

UX Designers combine their research and design skills together to understand the user needs and produce concepts/solutions/designs that people want to use. This requires a focus on human behaviours, psychology and understanding why people do what they do. It’s all the soft squishy, creative stuff on the right-side of the brain. Most UXers can tell you what it should do and why it should do it, but can’t actually build something that works.

Application Developers (which is a very broad and hopefully inclusive term for your average technical skill set) build the underlying functionality which makes the product work. It’s all about code, logic and the left-side of the brain. Often heard from Developers is “I can make it work, but it won’t look pretty“. Meaning that they can craft HTML that will technically work, but it may not create a very good impression for anyone who is influenced by the look of it (which means your average end user).

UI Developers fill the middle ground by combining both design sensibilities and technical skills together. They are skilled at making something both look good and function in a browser/device at the same time. They have the production skills to be able to produce visual designs in Photoshop and then turn them in to HTML code that deals with the wonders of browser compatibilities. This requires in-depth understanding of how browser rendering engines behave to be able to implement a design for the web that renders correctly and get all those pesky pixels to line up perfectly.

Of course this is very much a generalisation and it is possible to find people who work effortlessly across all these different skills-sets. I need to make the caveat that every person has different strengths and weaknesses. My point here is about the commonalities that define UX Designers, rather than each individual’s unique differences.

There is an age-old discussion out there on should designers know how to code? which often ends up concluding that ideally, yes they should. However the kind of people who can effortlessly switch between focusing on code and user needs are a rarity. The mindset required for each is generally quite distinctly different. Most people just aren’t wired up to do both. At the very least, even if they can, switching between them in their day-to-day role on a project tends to hinder their ability to do either well.

Breaking down Design further

Of course this is very much a simplification of the four areas covered in this diagram Research, Design, HTML, & Back-End. With just one wave of a Venn diagram I have lumped an entire technology industry in to just one circle. ??At the risk of complicating the main point of this post, I do feel the need to break down the area of Design a little bit more as it’s the area that I feel most non-Designers struggle to understand the differences between the design disciplines, and the different the backgrounds that UXers come from.

Within the context of Software Development, I would argue that design is primarily all about Visual Design, Interaction Design & Information Design.

It has to be said that the line between these three design disciplines is very blurry and rarely possible to separate entirely (the best way I’ve seen them articulated is in Jesse James Garret’s JJG Elements of UX).

This is how I would expand my diagram and the roles to include them:

ux-vs-ui-dev-skills-expanded
To further expand the distinction between the roles:

  • UX Designers focus on the structure and layout of content, navigation and how users interact with them. These don’t normally (but can) try to be perfect from a visual perspective. The types of deliverables they produce include site-maps, user flows, prototypes and wireframes, which are more focussed on the underlying structure and purpose of the software.  The visual appearance does impact on these, but can be created as a separate layer that is applied over the top.
  • UI Developers focus on the way the functionality is displayed and the fine detail of how users interact with the interface. They produce the visual comps and functioning front-end code. This is very much about polished final production quality outputs.

The different disciplines within UX Design can be expanded further to paint a much more comprehensive picture. The best way I’ve seen it articulated was put together by Dan Saffer in his book Designing for Interaction. He represents the different disciplines of User Experience Design like this:

ux_disciplines

This article will explain the differences between the skills and capabilities of a web developer and UI developer, and give you some advice when choosing one for your business.

Difference Btwn a Web Developer & UI Developer?

Within Information Technology, UI stands for User Interface.

In order to understand the significance of UI, it is necessary to think a little bit about the layered nature of a typical web application.

Many such applications are divided down into logical functions, or layers, including:

  • The user interface: web-pages and associated apps.
  • The applications layer: programs written in computer language that sits behind the user interface, doing things as required to service requests coming from the UI.
  • Network layers: those elements of an application that might be responsible for moving data to and from your server and the front end of a website.

In order for your total application environment to work, your solutions provider will need to have all the skills necessary to build or customise the various layers required. In some cases, those skills may all reside in a single individual or in other situations you may find a number of different individuals who specialise in individual layer components.

Unfortunately, not all organisations necessarily use identical terms interchangeably and there may be differences between interpretations of these terms from one company to another. Even so, broadly speaking, you might find that a web developer will typically be assumed to have the skills necessary to build an entire end-to-end web solution.

By contrast, a UI developer may have a more discipline-specific skill set associated with building the front-end graphical pages that your users and customers will typically see and interface with.

Within the web design and building industry, it is not unusual to find people with predominantly graphic design backgrounds who are also UI developers capable of building very attractive and eye-catching front-end user interfaces.

They may, however, not be particularly skilled in some of the highly technical components that might sit behind that user interface that would more typically be the domain of web developers and web programmers.

Essentially UI developers are typically more associated with the look, feel and usability of an application.

How Do You Get Started?

The skills required to develop a suitable user interface should not be underestimated.

However technically clever and useful your website or the products/services it offers are, if the site is not easy for your potential customers to use then it may be a significant disincentive to them progressing their business with you through the site.

As part of an initial quotation for the design and build a website, your provider should give you a design overview of the user interface area. Whether that is constructed by a single individual or indeed the same individual that builds other components or layers, might not be something that particularly concerns most customers.

What Web Developers Are Out There?

Two examples of web and UI developers include:

  • HSMoore, London: a large organisation providing high-tech web-based solutions
  • Ampheon, London: a web development company operating since 1994 and having their own dedicated development team of IT specialists.

Prices

Once the extent of your requirements have been quantified, it will be possible to issue you with a priced proposition.

As a very rough guideline, a simple information provision website might be yours for a little as a few hundred pounds. A more functionally-rich transition-based system might be priced starting at perhaps £1500 upwards.

Next Steps

Simply fill in the above form and we will connect you to IT experts who will be able to offer you advice on how to go forward to a full quotation.

Best Web Design and Development company, India.
Working with UI DESIGNER, has been a great experience for Us, When we assigned our project to them it was the first time we outsourced a project to India, we had been working with local companies looking for a long and stable relation and a reliable partner to work with but using local companies we had to change many times over the last 3 years.
UI DESIGNER Freelancer From India
Date published: 08/21/2014
5 / 5 stars

Founder Ritesh Narang UI Designer
435, Ward No 17, Shiv nagar, Bhattu Road, Street No 1
DLF Building, Fatehabad, Haryana 125050
Phone: +91-9017404999 Phone: +91-7042866778