{"id":391310,"date":"2022-01-08T12:00:00","date_gmt":"2022-01-08T09:00:00","guid":{"rendered":"https:\/\/en.buradabiliyorum.com\/product-designers-and-developers-dont-always-play-nice-heres-how-to-work-together\/"},"modified":"2022-01-08T12:00:00","modified_gmt":"2022-01-08T09:00:00","slug":"product-designers-and-developers-dont-always-play-nice-heres-how-to-work-together","status":"publish","type":"post","link":"https:\/\/buradabiliyorum.com\/en\/product-designers-and-developers-dont-always-play-nice-heres-how-to-work-together\/","title":{"rendered":"#Product designers and developers don\u2019t always play nice \u2014 here\u2019s how to work together"},"content":{"rendered":"<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_85 counter-hierarchy ez-toc-counter ez-toc-custom ez-toc-container-direction\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">Table of Contents<\/p>\n<label for=\"ez-toc-cssicon-toggle-item-6a368da0c46ce\" class=\"ez-toc-cssicon-toggle-label\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #dd3333;color:#dd3333\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #dd3333;color:#dd3333\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/label><input type=\"checkbox\"  id=\"ez-toc-cssicon-toggle-item-6a368da0c46ce\" checked aria-label=\"Toggle\" \/><nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/buradabiliyorum.com\/en\/product-designers-and-developers-dont-always-play-nice-heres-how-to-work-together\/#How_tension_and_bad_blood_arise\" >How tension and bad blood arise<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/buradabiliyorum.com\/en\/product-designers-and-developers-dont-always-play-nice-heres-how-to-work-together\/#How_to_stop_developers_and_designers_from_getting_lost_in_translation\" >How to stop developers and designers from getting lost in translation<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/buradabiliyorum.com\/en\/product-designers-and-developers-dont-always-play-nice-heres-how-to-work-together\/#Software_tools_to_bridge_the_gaps\" >Software tools to bridge the gaps<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/buradabiliyorum.com\/en\/product-designers-and-developers-dont-always-play-nice-heres-how-to-work-together\/#The_end_goal_Good_tools_good_people_good_culture\" >The end goal: Good tools, good people, good culture<\/a><\/li><\/ul><\/nav><\/div>\n<p>&#8220;<strong>#Product designers and developers don\u2019t always play nice \u2014 here\u2019s how to work together<\/strong>&#8221;<br \/>\n<img decoding=\"async\" src=\"https:\/\/img-cdn.tnwcdn.com\/image?fit=796%2C417&amp;url=https%3A%2F%2Fcdn0.tnwcdn.com%2Fwp-content%2Fblogs.dir%2F1%2Ffiles%2F2022%2F01%2Fproduct.jpeg&amp;signature=a7c7215315bd0c977d0353b36b1ee94f\" \/><\/p>\n<div>Imagine you\u2019re responsible for implementing an <a href=\"https:\/\/buradabiliyorum.com\/en\/category\/download-scripts-themes-apps\/\" data-internallinksmanager029f6b8e52c=\"9\" title=\"Download Scripts &amp; Themes &amp; Apps\" target=\"_blank\" rel=\"noopener\">app<\/a> that shows you swanky caf\u00e9s in your city. Dave, your product designer, has created a beautiful wireframe, and he wants the prototype to be ready within three weeks.<\/p>\n<p>You know how Dave ticks, and you know how this type of request usually ends. With a tight timeline and a few sketchy instructions to go with, you\u2019re definitely not going to impress him. But hey, this is your job, so you do your best anyway.<\/p>\n<p>Three weeks later, you go back to Dave with the finished prototype.<\/p>\n<p>And he\u2019s furious.<\/p>\n<p>According to him, you totally ignored his team\u2019s instructions. You didn\u2019t implement the exact pixels they specified, you didn\u2019t get the color shades perfectly right, and \u2014 oh \u2014 where are all the special effects?<\/p>\n<p>Now you\u2019re mad at Dave and his team, too. During those three weeks, they didn\u2019t check in with you at all.<\/p>\n<p>And now, after weeks of you pushing overnight shifts to get the prototype shipped on time, all Dave wants to see is your manager so he has someone better to yell at.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"How_tension_and_bad_blood_arise\"><\/span><strong>How tension and bad blood arise<\/strong><span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>As a developer, you do your very best to avoid conflicts, and so do productdesigners like Dave. Why, then, do such uncomfortable situations keep happening?<br \/>Some product designers want all their detailed and complex products ready by yesterday.<\/p>\n<p>That\u2019s not because they\u2019re nasty people.<\/p>\n<p>Designers like that tend to lack the technical know-how about all the frameworks and labor that goes into the back-end. It takes more than a little magic to turn a prototype into a working product.<\/p>\n<p>There are also developers who don\u2019t understand the hard work that designers put in, however. They\u2019ll get sloppy with design details like alignment or font choices, and then blame the designers for making the product look shitty.<\/p>\n<p>If it goes totally wrong, the designers will take the shitty product as-is to avoid conflicts. You can imagine the product owner\u2019s reaction when they see the ugly result of their beautiful idea.<\/p>\n<p>Some developers, especially those who are still inexperienced, also make poor engineering choices that make updating a design difficult. This may not show im<a href=\"https:\/\/buradabiliyorum.com\/en\/category\/social-mediaa\/\" data-internallinksmanager029f6b8e52c=\"1\" title=\"Social Media\" target=\"_blank\" rel=\"noopener\">media<\/a>tely, but three years down the road everybody will be frustrated. Technical debt is a beast, and an engineer\u2019s lack of experience racks it up to ten times quicker.<\/p>\n<p>Inexperienced designers can be a plague too, though.<\/p>\n<p>If they don\u2019t carefully consider how their design scales and performs in the long run, there\u2019s only so much developers can do to fix their faults. This ties back to some designers\u2019 lack of technical know-how. Of course, they don\u2019t need to know everything about software engineering \u2014 that would make developers obsolete \u2014 but a little savoir-faire goes a long way.<br \/>Such knowledge would also help designers communicate their ideas in greater detail.<\/p>\n<p>A handful of wireframes, no matter how beautiful they are, aren\u2019t going to replace the value of a prototype that is detailed, dynamic, and created with the underlying technologies and their challenges in mind.<\/p>\n<p>The moral of the story is this: There are myriads of ways to upset a designer if you\u2019re a developer. And if you\u2019re a designer, there are as many ways as there are fish in the sea to make a developer bite you in the ass.<\/p>\n<p>Fundamentally, it boils down to this: Designers and developers speak different languages.<\/p>\n<p>The designer speaks from the direction of the user. They know exactly how the product should look like, feel like, and behave. But they don\u2019t know how to make it happen. The developer, on the other hand, knows about all the tech to build stuff. Ok, not all. But some at least. Developers speak with code. But developers can\u2019t succeed on their own because don\u2019t speak the language of the users.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"How_to_stop_developers_and_designers_from_getting_lost_in_translation\"><\/span>How to stop developers and designers from getting lost in translation<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Maybe get a translator? No worries, that won\u2019t be necessary.<\/p>\n<p>In some companies \u2014 those old-fashioned ones that still do in-person work at least \u2014 product designers and developers sit at the same table. This helps immensely because both teams can see each other working in real-time and learn to appreciate the different challenges that they face.<\/p>\n<p>Also, this maximizes over-the-shoulder conversations and minimizes the need for icky stuffy time-consuming official meetings with everybody. If product designer Dave isn\u2019t sure if a feature is technically feasible, he can quickly ask a developer.<\/p>\n<p>Likewise, if a developer has questions about why a particular feature is necessary, they can quickly tap the responsible designer on the shoulder. This works remotely, too. To make informal discussions more efficient, some companies pair each designer with a developer. The two of them can then discuss as much as they like. This type of informal dynamic resolves problems before they occur.<\/p>\n<p>If pairing developers and designers isn\u2019t an option, and it\u2019s impossible for both teams to work at the same table, scheduling regular check-ins may work. This gives developers the opportunity to review the designs, and the designers the opportunity to give feedback on how the development is going.<\/p>\n<p>Scheduling regular (and often long) meetings that cut into productive time isn\u2019t everybody\u2019s cup of tea, however. If the teams can conduct such meetings in an enjoyable way, nothing speaks against them. But the success of such meetings depends highly on the teams and the overall company culture.<\/p>\n<p>Finally, developers and designers should learn a little about each other\u2019s craft. This means that developers may want to enroll in a software design course. Designers might want to learn more about the software architecture and the programming languages that the developers are using in the team. Designers and developers speak different languages. But if they keep close enough, they start to understand each other.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"Software_tools_to_bridge_the_gaps\"><\/span>Software tools to bridge the gaps<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>For developers, getting a skimpy little wireframe for a complex project and having to code all the details from scratch will take more than an overnight shift. For designers, envisioning computer code in their day-to-day work is daunting. Luckily, there are software tools to the rescue.<\/p>\n<p><strong>Anima<br \/><\/strong><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/www.animaapp.com\/\">Anima<\/a> is a design-to-code platform where designers (and developers!) can develop prototypes and export developer-friendly code at the end of the process. For developers, this code is available in various popular frameworks, such as React, vue.js, and html. Plus, designers can bring their prototypes to life easier than with more traditional design tools because they can add interactive effects like hover effects, entrance animations, GIFs, and more.<\/p>\n<p><strong>Framer X<br \/><\/strong><a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/www.framer.com\/fp\/\">Framer<\/a> integrates with Figma and, like Anima, helps designers make static elements alive and dynamic. That being said, Anima integrates with Figma, too. Whether you use one or the other really boils down to your personal preferences.<\/p>\n<p><strong>Handoff, Visly, Modulz, and more<\/strong><br \/>There are plenty more design tools out there that transform prototypes to code. However, there is one problem with most of them: They don\u2019t address the dynamic part of prototypes like Anima and Framer. This leaves a lot to the imagination of the developer in charge. In other words, it leaves a lot of potential for conflicts on the table.<\/p>\n<p>Then again, the power of software tools is limited. They can help, but can\u2019t solve all the friction that arises between humans.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"The_end_goal_Good_tools_good_people_good_culture\"><\/span>The end goal: Good tools, good people, good culture<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>At the end of the day, we all want happy, productive teams that ship high-quality products and bring value to their customers. But that only works if the teams communicate well with one another, have the right tools to work with, and are embedded in good company culture.<\/p>\n<p>This sounds vanilla, I know.<\/p>\n<p>But so many product designers and developers have horror stories to tell. Misalignment is common because the teams speak in different languages, and operate from different viewpoints. Both languages and viewpoints are necessary. To make them work together, they need to be involved in each others\u2019 processes. Only then can they start understanding each other.<\/p>\n<p>Software design and development can rarely be done by one team alone. If the Daves of this world don\u2019t understand that, that\u2019s not your problem. But maybe you\u2019ll want to speak to his manager before he speaks to yours.<\/p>\n<p><em>This article was written by Ari<span data-sheets-value=\"{\" moutafis=\"\" data-sheets-userformat=\"{\"> Joury\u00a0<\/span>and was originally published on <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/uxdesign.cc\/\">UX Collective<\/a>. You can read it <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/uxdesign.cc\/product-designers-are-clashing-with-developers-and-its-ugly-59e9875d9866\">here<\/a>. Special thanks to Ofir Sever for pitching the idea for this story.<\/em><\/p>\n<\/div>\n<blockquote><p><strong><span style=\"color: #ff6600;\">If you liked the article, do not forget to share it with your friends. Follow us on\u00a0<span style=\"color: #ff0000;\"><a style=\"color: #ff0000;\" href=\"https:\/\/news.google.com\/publications\/CAAqBwgKMLG0nwswvr63Aw\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">Google News<\/a><\/span>\u00a0too, click on the star and choose us from your favorites.<\/span><\/strong><\/p><\/blockquote>\n<blockquote>\n<p style=\"text-align: center;\">For forums sites go to <span style=\"color: #ff9900;\"><a style=\"color: #ff9900;\" href=\"https:\/\/forum.buradabiliyorum.com\/\" target=\"_blank\" rel=\"noopener\">Forum.BuradaBiliyorum.Com<\/a><\/span><\/strong>\n<\/p><\/blockquote>\n<blockquote>\n<p style=\"text-align: center;\"><strong>If you want to read more like this article, you can visit our <span style=\"color: #ff9900;\"><a style=\"color: #ff9900;\" href=\"https:\/\/en.buradabiliyorum.com\/technology\/\" target=\"_blank\" rel=\"noopener\">Technology category.<\/a><\/span><\/strong><\/p>\n<\/blockquote>\n<p><span style=\"color: black;\"><a style=\"color: #ff9900;\" href=\"https:\/\/thenextweb.com\/news\/how-product-designers-developers-work-together\" target=\"_blank\" rel=\"noopener\">Source<\/a><\/span><\/p>\n","protected":false},"excerpt":{"rendered":"<p>&#8220;#Product designers and developers don\u2019t always play nice \u2014 here\u2019s how to work together&#8221; Imagine you\u2019re responsible for implementing an app that shows you swanky caf\u00e9s in your city. Dave, your product designer, has created a beautiful wireframe, and he wants the prototype to be ready within three weeks. You know how Dave ticks, and&#8230;<\/p>\n","protected":false},"author":1,"featured_media":391311,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"fifu_image_url":"https:\/\/img-cdn.tnwcdn.com\/image\/tnw?filter_last=1&fit=1280,640&url=https:\/\/cdn0.tnwcdn.com\/wp-content\/blogs.dir\/1\/files\/2022\/01\/product.jpeg&signature=4a6e25628b218d3895ddfa81881f03dd","fifu_image_alt":"","footnotes":""},"categories":[18],"tags":[],"class_list":["post-391310","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-technology"],"_links":{"self":[{"href":"https:\/\/buradabiliyorum.com\/en\/wp-json\/wp\/v2\/posts\/391310","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/buradabiliyorum.com\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/buradabiliyorum.com\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/buradabiliyorum.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/buradabiliyorum.com\/en\/wp-json\/wp\/v2\/comments?post=391310"}],"version-history":[{"count":0,"href":"https:\/\/buradabiliyorum.com\/en\/wp-json\/wp\/v2\/posts\/391310\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/buradabiliyorum.com\/en\/wp-json\/wp\/v2\/media\/391311"}],"wp:attachment":[{"href":"https:\/\/buradabiliyorum.com\/en\/wp-json\/wp\/v2\/media?parent=391310"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/buradabiliyorum.com\/en\/wp-json\/wp\/v2\/categories?post=391310"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/buradabiliyorum.com\/en\/wp-json\/wp\/v2\/tags?post=391310"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}