{"version":"1.0","provider_name":"Patricio Mas","provider_url":"https:\/\/patriciomas.cl\/en","title":"Atomic Design Components - Patricio Mas","type":"rich","width":600,"height":338,"html":"<blockquote class=\"wp-embedded-content\" data-secret=\"I56WWJnrdP\"><a href=\"https:\/\/patriciomas.cl\/en\/portfolio\/atomic-design-components\/\">Atomic Design Components<\/a><\/blockquote><iframe sandbox=\"allow-scripts\" security=\"restricted\" src=\"https:\/\/patriciomas.cl\/en\/portfolio\/atomic-design-components\/embed\/#?secret=I56WWJnrdP\" width=\"600\" height=\"338\" title=\"&#8220;Atomic Design Components&#8221; &#8212; Patricio Mas\" data-secret=\"I56WWJnrdP\" frameborder=\"0\" marginwidth=\"0\" marginheight=\"0\" scrolling=\"no\" class=\"wp-embedded-content\"><\/iframe><script type=\"text\/javascript\">\n\/* <![CDATA[ *\/\n\/*! This file is auto-generated *\/\n!function(d,l){\"use strict\";l.querySelector&&d.addEventListener&&\"undefined\"!=typeof URL&&(d.wp=d.wp||{},d.wp.receiveEmbedMessage||(d.wp.receiveEmbedMessage=function(e){var t=e.data;if((t||t.secret||t.message||t.value)&&!\/[^a-zA-Z0-9]\/.test(t.secret)){for(var s,r,n,a=l.querySelectorAll('iframe[data-secret=\"'+t.secret+'\"]'),o=l.querySelectorAll('blockquote[data-secret=\"'+t.secret+'\"]'),c=new RegExp(\"^https?:$\",\"i\"),i=0;i<o.length;i++)o[i].style.display=\"none\";for(i=0;i<a.length;i++)s=a[i],e.source===s.contentWindow&&(s.removeAttribute(\"style\"),\"height\"===t.message?(1e3<(r=parseInt(t.value,10))?r=1e3:~~r<200&&(r=200),s.height=r):\"link\"===t.message&&(r=new URL(s.getAttribute(\"src\")),n=new URL(t.value),c.test(n.protocol))&&n.host===r.host&&l.activeElement===s&&(d.top.location.href=t.value))}},d.addEventListener(\"message\",d.wp.receiveEmbedMessage,!1),l.addEventListener(\"DOMContentLoaded\",function(){for(var e,t,s=l.querySelectorAll(\"iframe.wp-embedded-content\"),r=0;r<s.length;r++)(t=(e=s[r]).getAttribute(\"data-secret\"))||(t=Math.random().toString(36).substring(2,12),e.src+=\"#?secret=\"+t,e.setAttribute(\"data-secret\",t)),e.contentWindow.postMessage({message:\"ready\",secret:t},\"*\")},!1)))}(window,document);\n\/\/# sourceURL=https:\/\/patriciomas.cl\/wp-includes\/js\/wp-embed.min.js\n\/* ]]> *\/\n<\/script>\n","thumbnail_url":"https:\/\/patriciomas.cl\/wp-content\/uploads\/2024\/08\/Figma-atomic-components.png","thumbnail_width":1074,"thumbnail_height":727,"description":"As Product Design Lead at uPlanner, we embarked on a transformative journey to enhance our design process by transitioning from creating bespoke user interfaces (UIs) in Adobe XD to implementing a robust component system in Figma based on Atomic Design principles. This shift was driven by the need to streamline our design workflow, improve collaboration across teams, and ensure consistency across our digital products. Challenge Our design team initially relied heavily on Adobe XD for UI design, producing highly customized interfaces for various projects. While this approach allowed for creative freedom, it led to several challenges: Inconsistency: Each interface differences [&hellip;]"}