Bridging the Designer-Developer Gap

Posted in Tips, Web Design3 years ago • Written by 7 Comments

How are ‘Right brainers’ different from ‘Left Brainers’?

Well, this is not a zoology question being thrown at you. If you are working on a team dealing with websites / apps, and if there is a design team working with a team of developers, you probably would be witnessing the answer to this question every single day you work!

This is an inevitable fact, and it is this difference that makes the two communities thrive, and the best team is the one which finds a way to converge the collective wisdom of both these ‘species’ into the final stage of their deliverable – An ideal human-machine interaction experience, filled with life and satisfaction.

But in reality, most of the teams stumble at this moment, when the ideologies of both of them should be given weight and injected into the final product, and this shortcoming, is the whole essence of this article.

What is the gap?

Every man-made object is created based on a single principle. Make a task easier and faster to accomplish, and for each object/gadget, the ‘form’ (the physical appearance) and ‘function’ (the way it responds and processes the task) plays an important role. The same logic prevails, when it comes to computer-based systems also. Here the ‘form’ is – ‘Look and Feel’ (Usability of UI and Interaction), and ‘function’ is – ‘performance and efficiency’ (Efficiency of the empowering technology implementation)

Talking about computer based interfaces, designers are in charge of ‘Form’, and developers, ‘Function’. In short an app is the work of developers, hidden below the skin and skeleton created by the designers. The vital part is to retain the ‘skin and skeleton’ till the end product without any change whatsoever, and this is the most unattended part of the process in most of the teams. Results are half baked products that are unusable, in spite of the numerous hours of effort put in by the designers, after painstakingly drafting wireframes, Visual Comps, and Prototypes, only to find all those ‘details’ ignored vehemently in the end product. It is not a pleasant experience to find a deployed app, without that gradient on hover implemented, after you spent hours finalizing the color scheme.

This ‘erosion’ in the ‘form’ proposed by the design team, when the product reaches its final stages of development constitutes the majority of the ‘Gap’.

What creates this gap?

There is an array of reasons we can attribute such a gap to. Here are some practical points, which play an important role in bridging the gap.

  • The missing link – Front-end Engineering
  • Awareness of design principles and usability
  • Team work
  • The ‘Hybrid’ designer
  • Passion for the finished product
  • Designer – Developer meetings

The missing link – Front-end Engineering

Often, the role of a design team comes to an end by delivering the Visual comps, by the visual designer, out of the wireframes. The dev team takes over, and from here the erosion starts slowly, ignoring and omitting the details in the design, concentrating only on the ‘function’, to the extent that, the page looks completely disconnected from the visual design.

So apparently, the gap between the Visual comps and the functional page is where the actual work needs to be done.

A front-end engineer comes in really handy in such a scenario, and forms an integral part of a design team, by considerably reducing the gap between the visual comps, and the functional page. An ideal candidate for this position should have expertise in XHTML, CSS and JS, which enables him to create clickable prototypes matching the Visual comps, or at least they’re as close as possible. By the addition of such a skill set, the dev team can concentrate more on ‘function’, as they always do, and the design team can be rest assured that, all the details are captured visually as well.

Awareness of design principles and usability

A developer is not destined to just code the application to perfection. It’s an added boon, in having a design conscious developer on board and avoid some basic mistakes which may have arisen due to lack of basic knowledge of design. Most of the shortcomings and problems that widen the gap between the designer and developer, is the missing knowledge of design principles, and failing to understand the importance of a good design and how it plays an important role in increasing the credibility and usability of a system. A design team working in isolation from a dev team, and vice versa, is not going to be able to bridge the gap. In fact, both the team should co-exist and interact by exchanging ideas and conducting knowledge sharing sessions and talks. This can help build a rapport as well as create a common ground as far as awareness of design is concerned.

This is really important for the sustained growth of a team as a whole, and also helps in eliminating critical differences at any point during the life of an application

Teamwork

It’s the team which gets the credit at the end of a successful project, and every member contributes his part to the bigger cause. Working in a team of designers and developers is always going to be a challenge, where ideas are subject to conflict and solutions are always a result of brainstorming and negotiation.

As always, it takes a lot of team playing skills, to convince the developer to stick to the design guidelines and come up with an appealing application that works and looks good at the same time. Creating a good rapport with the team members is vital, and often it can solve most of the shortcomings related to bridging the designer-developer gap. Both the teams should be willing to tackle any obstacles together, whether design or development related.

The ‘Hybrid’ designer

Delivery of XHTML pages to the dev team, alone doesn’t end the role of the design team in the whole process. He should be able to keep a close tab on the development process and should ideally understand the basics of coding, to tackle a possible deviation from the design guidelines, due to technical limitations and reasons native to the technology used.

This makes a multi-skilled designer, an integral part of any design team. At a time where people are hired based on core skill set expertise, hybrid designers can make the real difference, and its high time the hiring managers realize this and open up the doors for generalization also, rather than concentrate only on specialization!

Passion for the ‘Finished product’

Most of the time, an output-oriented team can have adverse effect on the final deliverable if they don’t see the bigger picture, which is the product itself!

It is the passion to see the final product emerge perfectly, which is missing among most of the team members, which results in those loopholes and shortcomings in the whole product. It’s a team effort and each individual should see that their contribution is towards a larger goal and shed the mindset of just meeting their individual milestones. This is an area where a closely knit team, scores over large teams, with hundreds of members, working together but yet in isolation.

Team rapport is the underlining factor!

Designer – Developer meetings

As mentioned, it is really important to take the ideas of both the designers and developers and make it something productive and useful. Meetings comprising both these ‘species’ together would serve the purpose. There would be some initial hiccups, due to the contrasting opinions, but believe me, its worth the effort, and the rapport and confidence that such a meeting instills within the team will be really commendable and helpful for completing better products in the end.

The Result

With the awareness of usability and user experience moving up the ladder, products are going to be judged based on their performance and ease of use, and it’s really vital to bridge this gap as early as possible, and move towards the world of usable and straight forward human-machine interaction, which leaves an ever lasting impression on the user.

If you enjoyed this article, get email updates (it's free).

Join over 77,235 Subscribers Today.

12 Written ArticlesWebsite

A User Experience designer with specialized experience in front-end engineering, i have over time developed a strong passion in being associated with product-based teams. The unified goal and challenges that a product's life cycle offers is simply unbeatable! For me, proficiency in tools takes the back seat when it comes to User Experience Design, and i believe one has to be passionate and equally agile to be a key part of the team. I bring to the table the diverse hands-on experience on various facets of experience design, and have played key roles in the team bridging the gap between design, dev and biz groups within product teams. My vision is to be the key hand behind the UX design of a world-class product in a team of passionate and uber-smart techies and designers! Specialties: Information Architecture, Wireframing, Heuristic Evaluation, Web standards, Interaction design, Semantic markup, OO CSS, Usability Review

7 Comments Best Comments First
  • tyropel

    Friday, June 24th, 2011 14:17

    1

    The article is really helpful bro. Great work :)

    0
  • Mike Jarema

    Friday, June 24th, 2011 20:15

    3

    Hi Ranjith,

    Great article, I’ve seen this gap first hand a few times and you’ve captured both the essence of it and given some useful tips on how to address it head-on. I think the key point is the team-wide passion for the product (guided the careful influence of a solid product manager). If every member of the team is also a passionate user of the product, then everyone’s interests and goals are aligned.

    Quick notes for you – the link on this page to your twitter account is broken and on your personal webpage neither your blog link nor your CV link work. It’d be a shame for this great exposure to be wasted due to a few broken links.

    - Mike

    0
    • Ranjith Kumar

      Saturday, June 25th, 2011 08:03

      5

      Glad that you liked it Mike. Thanks for pointing out the broken links. By the time you read this … those would ve been fixed. :)

      0
      • Walter

        Friday, July 1st, 2011 10:39

        6

        Hi Ranjith, if you are an UX enthusiast then why don’t you help the community by creating some good UI,UX tutorials.

        0
  • Siddhartha Sinha

    Friday, June 24th, 2011 19:44

    2

    This is the article that I was looking for.

    0
  • Flavio Mester

    Friday, June 24th, 2011 20:21

    4

    I’m some kind of ‘hybrid’ myself. I think that’s what pushing me more and more towards interface design for people using our website creation tools. But who knows? I may end up tilting more towards the left site of my brain.

    0
  • Hector Hurtado

    Thursday, July 21st, 2011 02:15

    7

    I enjoyed your article, even though I think it is a bit biaised towards designers. You see, I too walk the fine line between these two roles. And yet, I feel that for both worlds to meet, designers must be aware of difficulties that may arise when implementing something obvious and trivial to their eyes. Browser compatibility, PNG support, and CSS sprites come to mind.

    At the end of the day, when both parties understand that content is king, and that less is not only more, but often better… the magic operates — though admittedly, I am biaised towards minimalism :)

    Interesting subject!

    0
  • Hector Hurtado

    Thursday, July 21st, 2011 02:15

    7

    I enjoyed your article, even though I think it is a bit biaised towards designers. You see, I too walk the fine line between these two roles. And yet, I feel that for both worlds to meet, designers must be aware of difficulties that may arise when implementing something obvious and trivial to their eyes. Browser compatibility, PNG support, and CSS sprites come to mind.

    At the end of the day, when both parties understand that content is king, and that less is not only more, but often better… the magic operates — though admittedly, I am biaised towards minimalism :)

    Interesting subject!

    0
  • Flavio Mester

    Friday, June 24th, 2011 20:21

    4

    I’m some kind of ‘hybrid’ myself. I think that’s what pushing me more and more towards interface design for people using our website creation tools. But who knows? I may end up tilting more towards the left site of my brain.

    0
  • Mike Jarema

    Friday, June 24th, 2011 20:15

    3

    Hi Ranjith,

    Great article, I’ve seen this gap first hand a few times and you’ve captured both the essence of it and given some useful tips on how to address it head-on. I think the key point is the team-wide passion for the product (guided the careful influence of a solid product manager). If every member of the team is also a passionate user of the product, then everyone’s interests and goals are aligned.

    Quick notes for you – the link on this page to your twitter account is broken and on your personal webpage neither your blog link nor your CV link work. It’d be a shame for this great exposure to be wasted due to a few broken links.

    - Mike

    0
    • Ranjith Kumar

      Saturday, June 25th, 2011 08:03

      5

      Glad that you liked it Mike. Thanks for pointing out the broken links. By the time you read this … those would ve been fixed. :)

      0
      • Walter

        Friday, July 1st, 2011 10:39

        6

        Hi Ranjith, if you are an UX enthusiast then why don’t you help the community by creating some good UI,UX tutorials.

        0
  • Siddhartha Sinha

    Friday, June 24th, 2011 19:44

    2

    This is the article that I was looking for.

    0
  • tyropel

    Friday, June 24th, 2011 14:17

    1

    The article is really helpful bro. Great work :)

    0

Comments are closed.

54.205.166.220 - unknown - unknown - US