{"id":1702,"date":"2024-03-29T03:01:38","date_gmt":"2024-03-29T10:01:38","guid":{"rendered":"http:\/\/proxystudio.uxpin.com\/?p=1702"},"modified":"2024-03-29T03:01:53","modified_gmt":"2024-03-29T10:01:53","slug":"should-designers-code","status":"publish","type":"post","link":"https:\/\/www.uxpin.com\/studio\/blog\/should-designers-code\/","title":{"rendered":"Should Designers Code?"},"content":{"rendered":"\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"512\" src=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/08\/Should-Designers-Code-1024x512.png\" alt=\"Should Designers Code\" class=\"wp-image-31410\" srcset=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/08\/Should-Designers-Code-1024x512.png 1024w, https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/08\/Should-Designers-Code-600x300.png 600w, https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/08\/Should-Designers-Code-768x384.png 768w, https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/08\/Should-Designers-Code.png 1200w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<div style=\"height:20px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p><span style=\"font-weight: 400;\">The argument about how design fits into the workflow of web development is a constant struggle.<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">We often hear designers say, \u201ccan we develop these new onboarding flows and put them into the app?! It will massively improve our conversions.\u201d<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">Then, developers come back with \u201cno. Those onboarding flows are much more complicated than you think, and they use elements we\u2019ve never coded before. I don\u2019t think we should do this.\u201d<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">And that\u2019s just a basic example.<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">Let\u2019s take that situation and scale it up to a team of 20 developers and 5 designers. The result is inconsistencies in design patterns, broken onboarding flows, one week of wasted developer time, slow mobile web-pages, and one date picker that looks like it\u2019s from 1995.<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">Here at UXPin, we\u2019ve seen this situation happen over and over again. <\/span><a href=\"https:\/\/www.uxpin.com\/merge\" target=\"_blank\" rel=\"noreferrer noopener\"><span style=\"font-weight: 400;\">UXPin with Merge technology<\/span><\/a><span style=\"font-weight: 400;\"> <\/span>helps designers build interfaces with coded components from MUI, Ant design, and more. The components look like flat UI components on the surface but they are, in fact, ready for production<span style=\"font-weight: 400;\">. <\/span><a href=\"https:\/\/www.uxpin.com\/merge\" target=\"_blank\" rel=\"noreferrer noopener\">Try UXPin Merge for free<\/a><span style=\"font-weight: 400;\">.<\/span><\/p>\n\n\n\n<section class=\"discover-merge\">\n    <div class=\"discover-merge__container\">\n        <div class=\"discover-merge__left\">\n            <p class=\"discover-merge__heading\">Reach a new level of prototyping<\/p>\n            <p class=\"discover-merge__text\">Design with interactive components coming from your team&#8217;s design system.<\/p>\n            <a href=\"https:\/\/www.uxpin.com\/merge\" target=\"_blank\" rel=\"noopener\">\n                <button class=\"discover-merge__button\">Discover UXPin Merge<\/button>\n            <\/a>\n        <\/div>\n        <div>\n            <img decoding=\"async\" src=\"https:\/\/uxpin.com\/studio\/wp-content\/themes\/uxpin-juggernaut\/img\/cta-banner-merge.png\" class=\"discover-merge__image\" alt=\"\">\n        <\/div>\n    <\/div>\n<\/section>\n\n<style>\n.discover-merge {\n    margin: 40px 8px;\n}\n\n.discover-merge__container {\n    display: flex;\n    max-width: 690px;\n    height: 200px;\n    padding: 20px;\n    padding-left: 24px;\n    border-radius: 4px;\n    background-color: black;\n    box-shadow: 10px 10px #9999ff;\n    align-items: center;\n    justify-content: space-between;\n}\n\n.discover-merge__left {\n    width: 50%;\n}\n\n.discover-merge__left p {\n    margin: 10px 0px !important;\n    color: white !important;\n    font-size: 18px !important;\n}\n\n.discover-merge__heading {\n    font-weight: bold !important;\n    color: white !important;\n    font-size: 18px !important;\n}\n\n.discover-merge__text {\n    margin: 0 !important;\n    line-height: 22px !important;\n}\n\n.discover-merge__button {\n    width: 174px;\n    height: 44px;\n    margin: 10px 0px;\n    border: none;\n    border-radius: 2px;\n    background: white;\n    color: black;\n    font-size: 16px;\n    text-align: center;\n}\n\n.discover-merge__button:hover {\n    cursor: pointer;\n}\n\n.discover-merge__image {\n    max-width: 320px !important;\n    height: 200px;\n    margin-right: -19px;\n}\n\n@media (max-width: 760px) {\n    .discover-merge__container {\n        height: auto;\n        margin: 10px;\n        align-items: left;\n    }\n}\n\n@media (max-width: 500px) {\n    .discover-merge__container {\n        flex-direction: column;\n    }\n\n    .discover-merge__left {\n        width: 100%;\n        align-items: normal;\n    }\n}\n\n<\/style>\n\n\n\n<div style=\"height:20px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-where-does-the-designer-to-developer-disconnect-come-from\"><span style=\"font-weight: 400;\">Where does the designer to developer disconnect come from?<\/span><\/h2>\n\n\n\n<p><span style=\"font-weight: 400;\">We see a disconnect between designers and developers, as the designers are tasked to imagine what could be, and the developers are tasked with the materialisation of it.<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">Some people say the solution is that designers should learn to code. If designers could code, then they would understand the challenges at play when developing the product.<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">On the other hand, some people say that developers should design. If developers just had a better design mind from the get-go maybe we wouldn\u2019t need the designer at all.<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">As we know, both of these perspectives are completely wrong.&nbsp;<\/span><\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-developers-and-designers-two-completely-unique-roles\"><span style=\"font-weight: 400;\">Developers and designers: two completely unique roles<\/span><\/h2>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"750\" height=\"301\" src=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/08\/1_48-1.png\" alt=\"1 48 1\" class=\"wp-image-31415\" srcset=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/08\/1_48-1.png 750w, https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/08\/1_48-1-700x281.png 700w\" sizes=\"auto, (max-width: 750px) 100vw, 750px\" \/><\/figure>\n\n\n\n<p><span style=\"font-weight: 400;\">Developers have a specific skill set. They know deeply how to put websites and apps together. But understanding how a user will respond to an app is not intuitive. The UX needs to be researched and reiterated. It\u2019s a full time job to study your users and identify how they move through your app.<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">Designers need to be looking at their population of users to <\/span><a href=\"https:\/\/www.uxpin.com\/studio\/blog\/how-to-design-behavior-the-behavior-change-matrix\/\"><span style=\"font-weight: 400;\">identify how they behave<\/span><\/a><span style=\"font-weight: 400;\">. Constant and reiterative design needs to occur before an app can be positioned well to cope with the behaviour of users.&nbsp;<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">UX designers have a unique skill set for <\/span><a href=\"https:\/\/www.uxpin.com\/studio\/blog\/14-design-psychology-articles-for-ux-practitioners\/\"><span style=\"font-weight: 400;\">understanding user psychology<\/span><\/a><span style=\"font-weight: 400;\">, and they need to be focused on careful experimentation on pages.<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">But how do developers cope with the constant demands of designers while simultaneously building the product according to the customer\u2019s needs?<\/span><\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-we-need-a-tool-that-helps-designers-use-code-without-coding\"><span style=\"font-weight: 400;\">We need a tool that helps designers use code without coding<\/span><\/h2>\n\n\n\n<p><span style=\"font-weight: 400;\">Even if a designer knew how to code, the challenge of optimizing design implementation would remain. Understanding the whole product\u2019s existing components, functionalities, and branding takes a ton of time, regardless of who is doing the work.\u00a0<\/span><\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"750\" height=\"300\" src=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/08\/2_45.png\" alt=\"2 45\" class=\"wp-image-31417\" srcset=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/08\/2_45.png 750w, https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/08\/2_45-700x280.png 700w\" sizes=\"auto, (max-width: 750px) 100vw, 750px\" \/><\/figure>\n\n\n\n<p><span style=\"font-weight: 400;\">If we\u2019re aiming to <a href=\"https:\/\/www.uxpin.com\/studio\/blog\/figma-design-system-vs-uxpin-design-system\/\" target=\"_blank\" rel=\"noreferrer noopener\">design in a way that re-uses the most pre-existing components<\/a>, we would still need someone to go and catalogue everything existing in the app to date. As well, other analysis would need to take place to make sure the <a href=\"https:\/\/www.uxpin.com\/studio\/blog\/figma-to-react-plugins-and-alternatives\/\" target=\"_blank\" rel=\"noreferrer noopener\">designs fit the exact parameters<\/a>.<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">We can\u2019t assign this operations job to the designer or the developer, as both of these roles are already <a href=\"https:\/\/www.uxpin.com\/studio\/blog\/ui-design-vs-ui-development\/\" target=\"_blank\" rel=\"noreferrer noopener\">well defined<\/a>. The designer\u2019s role is already a full time job, with <a href=\"https:\/\/www.uxpin.com\/studio\/documentation\/ux-artifacts\/\" target=\"_blank\" rel=\"noreferrer noopener\">deliverables<\/a> related to UX research, UX design, and conversion rate optimization. A developer has their hands full with <a href=\"https:\/\/www.uxpin.com\/studio\/blog\/web-based-application-development\/\" target=\"_blank\" rel=\"noreferrer noopener\">building and coding features<\/a>.<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">We need a real solution that <a href=\"https:\/\/www.uxpin.com\/studio\/blog\/breaking-silos\/\" target=\"_blank\" rel=\"noreferrer noopener\">improves the design and development workflow<\/a>.<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">We need a tool that outlines all of the existing components and elements in a specific repository in a <a href=\"https:\/\/www.uxpin.com\/studio\/blog\/design-with-code-tutorial\/\" target=\"_blank\" rel=\"noreferrer noopener\">visual, drag and drop way<\/a>. This would allow designers to pick and choose from the menu of existing components while making new designs.<\/span><\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-introducing-uxpin-merge\"><span style=\"font-weight: 400;\">Introducing UXPin Merge<\/span><\/h2>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"750\" height=\"320\" src=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/08\/3_39.png\" alt=\"3 39\" class=\"wp-image-31419\" srcset=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/08\/3_39.png 750w, https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/08\/3_39-700x300.png 700w\" sizes=\"auto, (max-width: 750px) 100vw, 750px\" \/><\/figure>\n\n\n\n<p><a href=\"https:\/\/www.uxpin.com\/merge\" target=\"_blank\" rel=\"noreferrer noopener\"><span style=\"font-weight: 400;\">UXPin with Merge technology<\/span><\/a><span style=\"font-weight: 400;\"> is a design tool that leverages dev tools through Git and Storybook integrations. Sounds great, but what does that mean?<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">First, we have <\/span><a href=\"https:\/\/www.uxpin.com\/merge\/git-integration\" target=\"_blank\" rel=\"noreferrer noopener\"><span style=\"font-weight: 400;\">Git integration<\/span><\/a><span style=\"font-weight: 400;\">. Merge allows you to import existing components from your Git repo into UXPin design editor.\u00a0<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">Second, we have an integration with <\/span><a href=\"https:\/\/www.uxpin.com\/merge\/storybook-integration\" target=\"_blank\" rel=\"noreferrer noopener\"><span style=\"font-weight: 400;\">Storybook<\/span><\/a><span style=\"font-weight: 400;\">, an open source UI development tool.<\/span><\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"750\" height=\"301\" src=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2024\/03\/logo-storybook-1.png\" alt=\"logo storybook 1\" class=\"wp-image-52629\" srcset=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2024\/03\/logo-storybook-1.png 750w, https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2024\/03\/logo-storybook-1-700x281.png 700w\" sizes=\"auto, (max-width: 750px) 100vw, 750px\" \/><\/figure>\n\n\n\n<p><span style=\"font-weight: 400;\">UXPin has built an integration with Storybook that <a href=\"https:\/\/www.uxpin.com\/studio\/blog\/review-uxpin-storybook-integration\/\" target=\"_blank\" rel=\"noreferrer noopener\">allows you to use your existing design components directly in Storybook<\/a>. This means you can use a library of your existing design components when building out your next UI changes.<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">Then, you can just pass the design to a developer and have him use the code that he already has to build your new product.<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">Let\u2019s dive in deeper.<\/span><\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-part-1-uxpin-merge\"><span style=\"font-weight: 400;\">Part 1 &#8211; UXPin Merge<\/span><\/h3>\n\n\n\n<p><a href=\"https:\/\/www.uxpin.com\/merge\"><span style=\"font-weight: 400;\">UXPi<\/span><\/a><span style=\"font-weight: 400;\"><a href=\"https:\/\/www.uxpin.com\/merge\" target=\"_blank\" rel=\"noreferrer noopener\">n<\/a><\/span><a href=\"https:\/\/www.uxpin.com\/merge\"><span style=\"font-weight: 400;\"> Merge<\/span><\/a><span style=\"font-weight: 400;\"> is a drag-and-drop UI builder for creating interfaces with coded components. It has built-in libraries available on trial and paid plans.<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">It also allows you to import your design components from your Git repository or Storybook into the UXPin editor. This integration is currently only for the React framework, allowing you to pull in <a href=\"https:\/\/www.uxpin.com\/studio\/blog\/top-react-component-libraries\/\" target=\"_blank\" rel=\"noreferrer noopener\">React components<\/a> and work with them directly in UXPin.\u00a0<\/span><\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"750\" height=\"369\" src=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/08\/4_28.png\" alt=\"4 28\" class=\"wp-image-31421\" srcset=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/08\/4_28.png 750w, https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/08\/4_28-610x300.png 610w\" sizes=\"auto, (max-width: 750px) 100vw, 750px\" \/><\/figure>\n\n\n\n<p><span style=\"font-weight: 400;\">Your components will get stored in your UXPin design libraries, and any new components or updates will automatically sync into your library.<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">The functions of your components, and how they function, are also directly visible in your UXPin editor. This allows you to see mouse-overs, auto-fills, text field suggestions, emphasis animations and more directly in your UXPin editor.<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">Everything that you design with UXPin Merge will be coded exactly to spec by your developers. Why? Because all of the code in your design already exists in devs\u2019 Git Repo. Your developer won\u2019t have to make anything new.<\/span><\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-part-2-the-uxpin-storybook-integration\"><span style=\"font-weight: 400;\">Part 2 &#8211; The UXPin Storybook integration<\/span><\/h3>\n\n\n\n<p><span style=\"font-weight: 400;\">The <\/span><a href=\"https:\/\/www.uxpin.com\/merge\/storybook-integration\" target=\"_blank\" rel=\"noreferrer noopener\"><span style=\"font-weight: 400;\">UXPin storybook integration<\/span><\/a><span style=\"font-weight: 400;\"> allows you to use your existing design components, imported from Storybook- public or private. As in Git integration, you can change properties and add new interactions to parts of the ready components if you want to.<\/span><\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-consistency-achieved\"><span style=\"font-weight: 400;\">Consistency achieved<\/span><\/h2>\n\n\n\n<p><span style=\"font-weight: 400;\">UXPin Merge solves DesignOps problems quickly. Designers use components that are already existing in order to do their design. If they need to change items, they know exactly which components to change, as well as every page that will be affected once that change is made.<\/span><\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"512\" src=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/08\/Header_UXPinStorybook-copy-1024x512.png\" alt=\"Header UXPinStorybook copy\" class=\"wp-image-31423\" srcset=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/08\/Header_UXPinStorybook-copy-1024x512.png 1024w, https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/08\/Header_UXPinStorybook-copy-600x300.png 600w, https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/08\/Header_UXPinStorybook-copy-768x384.png 768w, https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/08\/Header_UXPinStorybook-copy.png 1200w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p><span style=\"font-weight: 400;\">There aren\u2019t three versions of the same component throughout your site, making your site easy to build, change, and keep consistent.&nbsp;<\/span><\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-should-designers-learn-to-code\"><span style=\"font-weight: 400;\">Should designers learn to code?&nbsp;<\/span><\/h2>\n\n\n\n<p><span style=\"font-weight: 400;\">Why learn to code if you can do your job with a no-code interface.<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">For designers, learning to code will give you a wider perspective, and give you more life experience to draw from when designing your app. However, it\u2019s not necessary to learn to code when you can improve your design-dev communication by using the right tools.&nbsp;<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">Therefore, as the world trends towards making code more accessible, our answer to this question trends towards \u201cno\u201d. Designers should improve themselves not by learning to code, but by getting better and better at design.<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">We build teams so that we can bring people with different skills together. We need people who are thinking about UX 100% of the time so that our apps can actually measure up to the needs of our users. We need people who can code rapidly, and we need them to code without being weighed down by UX design questions.&nbsp;<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">With <\/span><a href=\"https:\/\/www.uxpin.com\/merge\"><span style=\"font-weight: 400;\">UXPin Merge<\/span><\/a><span style=\"font-weight: 400;\"> we can bring these two sides together so that the two sides of our web development teams can actually work together easily.<\/span><\/p>\n\n\n\n<div class=\"wp-block-buttons\">\n<div class=\"wp-block-button is-style-fill\"><center><a class=\"btn btn-flat btn-large btn-content-width\" href=\"https:\/\/www.uxpin.com\/merge\" target=\"_blank\" rel=\"noreferrer noopener\">Discover Merge<\/a><\/center><\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>The argument about how design fits into the workflow of web development is a constant struggle. We often hear designers say, \u201ccan we develop these new onboarding flows and put them into the app?! It will massively improve our conversions.\u201d Then, developers come back with \u201cno. Those onboarding flows are much more complicated than you<\/p>\n","protected":false},"author":3,"featured_media":31410,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[3,6],"tags":[],"class_list":["post-1702","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-blog","category-ux-design"],"yoast_title":"","yoast_metadesc":"Should Designers code? That's the extremely often asked question. Read an analysis that provides sufficient answer. Infographic included","acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v27.4 (Yoast SEO v27.4) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>Should Designers Code? | UXPin<\/title>\n<meta name=\"description\" content=\"Should Designers code? That&#039;s the extremely often asked question. Read an analysis that provides sufficient answer. Infographic included\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.uxpin.com\/studio\/blog\/should-designers-code\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Should Designers Code?\" \/>\n<meta property=\"og:description\" content=\"Should Designers code? That&#039;s the extremely often asked question. Read an analysis that provides sufficient answer. Infographic included\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.uxpin.com\/studio\/blog\/should-designers-code\/\" \/>\n<meta property=\"og:site_name\" content=\"Studio by UXPin\" \/>\n<meta property=\"article:published_time\" content=\"2024-03-29T10:01:38+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-03-29T10:01:53+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/08\/Should-Designers-Code.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1200\" \/>\n\t<meta property=\"og:image:height\" content=\"600\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"UXPin\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@uxpin\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"UXPin\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"8 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/should-designers-code\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/should-designers-code\\\/\"},\"author\":{\"name\":\"UXPin\",\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/#\\\/schema\\\/person\\\/e0326509b38ce2a3ce62e40ddde9cf8e\"},\"headline\":\"Should Designers Code?\",\"datePublished\":\"2024-03-29T10:01:38+00:00\",\"dateModified\":\"2024-03-29T10:01:53+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/should-designers-code\\\/\"},\"wordCount\":1237,\"image\":{\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/should-designers-code\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/wp-content\\\/uploads\\\/2021\\\/08\\\/Should-Designers-Code.png\",\"articleSection\":[\"Blog\",\"UX Design\"],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/should-designers-code\\\/\",\"url\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/should-designers-code\\\/\",\"name\":\"Should Designers Code? | UXPin\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/should-designers-code\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/should-designers-code\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/wp-content\\\/uploads\\\/2021\\\/08\\\/Should-Designers-Code.png\",\"datePublished\":\"2024-03-29T10:01:38+00:00\",\"dateModified\":\"2024-03-29T10:01:53+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/#\\\/schema\\\/person\\\/e0326509b38ce2a3ce62e40ddde9cf8e\"},\"description\":\"Should Designers code? That's the extremely often asked question. Read an analysis that provides sufficient answer. Infographic included\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/should-designers-code\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/should-designers-code\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/should-designers-code\\\/#primaryimage\",\"url\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/wp-content\\\/uploads\\\/2021\\\/08\\\/Should-Designers-Code.png\",\"contentUrl\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/wp-content\\\/uploads\\\/2021\\\/08\\\/Should-Designers-Code.png\",\"width\":1200,\"height\":600,\"caption\":\"Should Designers Code\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/should-designers-code\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Should Designers Code?\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/#website\",\"url\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/\",\"name\":\"Studio by UXPin\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/#\\\/schema\\\/person\\\/e0326509b38ce2a3ce62e40ddde9cf8e\",\"name\":\"UXPin\",\"description\":\"UXPin is a web-based design collaboration tool. We\u2019re pleased to share our knowledge here.\",\"sameAs\":[\"http:\\\/\\\/www.uxpin.com\",\"https:\\\/\\\/x.com\\\/@uxpin\"],\"url\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/author\\\/hello\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Should Designers Code? | UXPin","description":"Should Designers code? That's the extremely often asked question. Read an analysis that provides sufficient answer. Infographic included","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.uxpin.com\/studio\/blog\/should-designers-code\/","og_locale":"en_US","og_type":"article","og_title":"Should Designers Code?","og_description":"Should Designers code? That's the extremely often asked question. Read an analysis that provides sufficient answer. Infographic included","og_url":"https:\/\/www.uxpin.com\/studio\/blog\/should-designers-code\/","og_site_name":"Studio by UXPin","article_published_time":"2024-03-29T10:01:38+00:00","article_modified_time":"2024-03-29T10:01:53+00:00","og_image":[{"width":1200,"height":600,"url":"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/08\/Should-Designers-Code.png","type":"image\/png"}],"author":"UXPin","twitter_card":"summary_large_image","twitter_creator":"@uxpin","twitter_misc":{"Written by":"UXPin","Est. reading time":"8 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.uxpin.com\/studio\/blog\/should-designers-code\/#article","isPartOf":{"@id":"https:\/\/www.uxpin.com\/studio\/blog\/should-designers-code\/"},"author":{"name":"UXPin","@id":"https:\/\/www.uxpin.com\/studio\/#\/schema\/person\/e0326509b38ce2a3ce62e40ddde9cf8e"},"headline":"Should Designers Code?","datePublished":"2024-03-29T10:01:38+00:00","dateModified":"2024-03-29T10:01:53+00:00","mainEntityOfPage":{"@id":"https:\/\/www.uxpin.com\/studio\/blog\/should-designers-code\/"},"wordCount":1237,"image":{"@id":"https:\/\/www.uxpin.com\/studio\/blog\/should-designers-code\/#primaryimage"},"thumbnailUrl":"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/08\/Should-Designers-Code.png","articleSection":["Blog","UX Design"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/www.uxpin.com\/studio\/blog\/should-designers-code\/","url":"https:\/\/www.uxpin.com\/studio\/blog\/should-designers-code\/","name":"Should Designers Code? | UXPin","isPartOf":{"@id":"https:\/\/www.uxpin.com\/studio\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.uxpin.com\/studio\/blog\/should-designers-code\/#primaryimage"},"image":{"@id":"https:\/\/www.uxpin.com\/studio\/blog\/should-designers-code\/#primaryimage"},"thumbnailUrl":"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/08\/Should-Designers-Code.png","datePublished":"2024-03-29T10:01:38+00:00","dateModified":"2024-03-29T10:01:53+00:00","author":{"@id":"https:\/\/www.uxpin.com\/studio\/#\/schema\/person\/e0326509b38ce2a3ce62e40ddde9cf8e"},"description":"Should Designers code? That's the extremely often asked question. Read an analysis that provides sufficient answer. Infographic included","breadcrumb":{"@id":"https:\/\/www.uxpin.com\/studio\/blog\/should-designers-code\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.uxpin.com\/studio\/blog\/should-designers-code\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.uxpin.com\/studio\/blog\/should-designers-code\/#primaryimage","url":"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/08\/Should-Designers-Code.png","contentUrl":"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/08\/Should-Designers-Code.png","width":1200,"height":600,"caption":"Should Designers Code"},{"@type":"BreadcrumbList","@id":"https:\/\/www.uxpin.com\/studio\/blog\/should-designers-code\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.uxpin.com\/studio\/"},{"@type":"ListItem","position":2,"name":"Should Designers Code?"}]},{"@type":"WebSite","@id":"https:\/\/www.uxpin.com\/studio\/#website","url":"https:\/\/www.uxpin.com\/studio\/","name":"Studio by UXPin","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.uxpin.com\/studio\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/www.uxpin.com\/studio\/#\/schema\/person\/e0326509b38ce2a3ce62e40ddde9cf8e","name":"UXPin","description":"UXPin is a web-based design collaboration tool. We\u2019re pleased to share our knowledge here.","sameAs":["http:\/\/www.uxpin.com","https:\/\/x.com\/@uxpin"],"url":"https:\/\/www.uxpin.com\/studio\/author\/hello\/"}]}},"_links":{"self":[{"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/posts\/1702","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/comments?post=1702"}],"version-history":[{"count":7,"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/posts\/1702\/revisions"}],"predecessor-version":[{"id":52632,"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/posts\/1702\/revisions\/52632"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/media\/31410"}],"wp:attachment":[{"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/media?parent=1702"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/categories?post=1702"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/tags?post=1702"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}