[{"data":1,"prerenderedAt":115},["ShallowReactive",2],{"navigation":3,"\u002Fblog\u002Fhow-i-built-my-own-design-system-from-scratch":25,"\u002Fblog\u002Fhow-i-built-my-own-design-system-from-scratch-surround":110},[4],{"title":5,"path":6,"stem":7,"children":8,"page":24},"Blog","\u002Fblog","blog",[9,13,17,21],{"title":10,"path":11,"stem":12},"[object Object]","\u002Fblog\u002Ffrom-mockup-to-market","blog\u002Ffrom-mockup-to-market",{"title":14,"path":15,"stem":16},"How I Keep Reusing the Same Building Blocks Across Projects","\u002Fblog\u002Fhow-i-built-my-own-design-system-from-scratch","blog\u002Fhow-i-built-my-own-design-system-from-scratch",{"title":18,"path":19,"stem":20},"Why Clear Messaging Beats Clever Copy in Cold Traffic","\u002Fblog\u002Fpsychology-of-color-in-ui-design","blog\u002Fpsychology-of-color-in-ui-design",{"title":10,"path":22,"stem":23},"\u002Fblog\u002Fslow-design-in-fast-paced-digital-world","blog\u002Fslow-design-in-fast-paced-digital-world",false,{"id":26,"title":14,"author":27,"body":31,"date":101,"description":102,"extension":103,"image":104,"meta":105,"minRead":106,"navigation":107,"path":15,"seo":108,"stem":16,"__hash__":109},"blog\u002Fblog\u002Fhow-i-built-my-own-design-system-from-scratch.md",{"name":28,"avatar":29},"Leo Bortoluzzi",{"src":30,"alt":28},"\u002Fprofile.webp",{"type":32,"value":33,"toc":94},"minimark",[34,38,41,46,49,68,71,75,78,81,85,88,91],[35,36,37],"p",{},"When you build websites, automations, and lead flows often enough, the same problems show up again and again. A contact form needs validation. A WhatsApp flow needs a clean handoff. A landing page needs a short path to action. The work changes, but the patterns stay the same.",[35,39,40],{},"That is why I started treating repeated work as a small system instead of a fresh decision every time. I do not want every project to look identical, but I do want the pieces underneath it to be reliable.",[42,43,45],"h2",{"id":44},"start-with-the-repeated-parts","Start with the repeated parts",[35,47,48],{},"The first step is to list the things I keep rebuilding:",[50,51,52,56,59,62,65],"ul",{},[53,54,55],"li",{},"Hero sections with a clear CTA",[53,57,58],{},"Form capture and routing",[53,60,61],{},"Basic lead qualification",[53,63,64],{},"Notification and follow-up logic",[53,66,67],{},"Simple status handling for automation",[35,69,70],{},"Once those patterns are visible, they are easier to document and reuse.",[42,72,74],{"id":73},"standardize-only-what-repeats","Standardize only what repeats",[35,76,77],{},"I do not standardize everything. Only the parts that save time or reduce mistakes. That usually means the flow between the page, the form, the webhook, and the final output.",[35,79,80],{},"If a client needs something custom, I build that on top of the shared pieces instead of replacing the whole stack.",[42,82,84],{"id":83},"keep-the-system-small","Keep the system small",[35,86,87],{},"A good system should disappear into the work. If it becomes a project in itself, it stops helping.",[35,89,90],{},"My rule is simple: if a reusable piece does not make the next build faster or cleaner, it is probably too much.",[35,92,93],{},"That mindset has helped me move faster without losing control of the details.",{"title":95,"searchDepth":96,"depth":96,"links":97},"",2,[98,99,100],{"id":44,"depth":96,"text":45},{"id":73,"depth":96,"text":74},{"id":83,"depth":96,"text":84},"2025-06-02","A simple way to turn repeated client work into faster delivery without turning every project into a rigid template.","md","https:\u002F\u002Fimages.unsplash.com\u002Fphoto-1516321318423-f06f85e504b3?auto=format&fit=crop&w=1470&q=80",{},6,true,{"title":14,"description":102},"lYFAoigvj78szd71Es6gDNouTUfR9gWYlToFCVD2h6o",[111,113],{"title":10,"path":11,"stem":12,"description":112,"children":-1},"I like to think about launches in reverse. Before I worry about scaling, I want to know whether the offer is clear, the page makes sense, and the next step is obvious.",{"title":18,"path":19,"stem":20,"description":114,"children":-1},"Cold traffic needs one clear promise, one clear action, and a short path from ad to result.",1776914397436]