[{"data":1,"prerenderedAt":325},["ShallowReactive",2],{"navigation":3,"blog-page":25,"blogs":42},[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":27,"body":28,"description":29,"extension":30,"links":31,"meta":38,"navigation":39,"path":6,"seo":40,"stem":7,"__hash__":41},"pages\u002Fblog.yml","Articles & Notes",null,"Notes on automation, landing pages, paid traffic, and the systems behind them.","yml",[32,35],{"label":33,"to":34},"See projects","\u002Fprojects",{"label":36,"to":37},"About me","\u002Fabout",{},true,{"title":27,"description":29},"BPFVQg6WvZS7C3T1WOwxhwKKf2lEDT_vE6a4ygGZjbQ",[43,127,192,266],{"id":44,"title":14,"author":45,"body":49,"date":119,"description":120,"extension":121,"image":122,"meta":123,"minRead":124,"navigation":39,"path":15,"seo":125,"stem":16,"__hash__":126},"blog\u002Fblog\u002Fhow-i-built-my-own-design-system-from-scratch.md",{"name":46,"avatar":47},"Leo Bortoluzzi",{"src":48,"alt":46},"\u002Fprofile.webp",{"type":50,"value":51,"toc":112},"minimark",[52,56,59,64,67,86,89,93,96,99,103,106,109],[53,54,55],"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.",[53,57,58],{},"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.",[60,61,63],"h2",{"id":62},"start-with-the-repeated-parts","Start with the repeated parts",[53,65,66],{},"The first step is to list the things I keep rebuilding:",[68,69,70,74,77,80,83],"ul",{},[71,72,73],"li",{},"Hero sections with a clear CTA",[71,75,76],{},"Form capture and routing",[71,78,79],{},"Basic lead qualification",[71,81,82],{},"Notification and follow-up logic",[71,84,85],{},"Simple status handling for automation",[53,87,88],{},"Once those patterns are visible, they are easier to document and reuse.",[60,90,92],{"id":91},"standardize-only-what-repeats","Standardize only what repeats",[53,94,95],{},"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.",[53,97,98],{},"If a client needs something custom, I build that on top of the shared pieces instead of replacing the whole stack.",[60,100,102],{"id":101},"keep-the-system-small","Keep the system small",[53,104,105],{},"A good system should disappear into the work. If it becomes a project in itself, it stops helping.",[53,107,108],{},"My rule is simple: if a reusable piece does not make the next build faster or cleaner, it is probably too much.",[53,110,111],{},"That mindset has helped me move faster without losing control of the details.",{"title":113,"searchDepth":114,"depth":114,"links":115},"",2,[116,117,118],{"id":62,"depth":114,"text":63},{"id":91,"depth":114,"text":92},{"id":101,"depth":114,"text":102},"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,{"title":14,"description":120},"lYFAoigvj78szd71Es6gDNouTUfR9gWYlToFCVD2h6o",{"id":128,"title":18,"author":129,"body":131,"date":185,"description":186,"extension":121,"image":187,"meta":188,"minRead":189,"navigation":39,"path":19,"seo":190,"stem":20,"__hash__":191},"blog\u002Fblog\u002Fpsychology-of-color-in-ui-design.md",{"name":46,"avatar":130},{"src":48,"alt":46},{"type":50,"value":132,"toc":180},[133,136,139,143,146,149,153,156,167,170,174,177],[53,134,135],{},"When people arrive cold, they do not know the context yet. That means the page cannot afford to be clever before it is clear.",[53,137,138],{},"I have seen the same pattern across landing pages, lead flows, and WhatsApp handoffs: the cleaner the message, the easier the conversion.",[60,140,142],{"id":141},"message-match-matters","Message match matters",[53,144,145],{},"The landing page should continue the promise made in the ad or outreach message. If the visitor has to translate the idea again, friction goes up.",[53,147,148],{},"The result is usually the same: lower intent, slower action, and more wasted traffic.",[60,150,152],{"id":151},"one-action-is-enough","One action is enough",[53,154,155],{},"I prefer a page to do one job well instead of three jobs badly. That usually means:",[68,157,158,161,164],{},[71,159,160],{},"One primary CTA",[71,162,163],{},"One obvious next step",[71,165,166],{},"One short explanation of value",[53,168,169],{},"That does not mean the page has to be bland. It just has to be direct.",[60,171,173],{"id":172},"less-noise-more-trust","Less noise, more trust",[53,175,176],{},"Design still matters, but mostly because it helps reduce uncertainty. Good spacing, readable hierarchy, and a focused layout make the offer feel more believable.",[53,178,179],{},"The goal is not to impress the visitor. The goal is to help them understand the offer quickly enough to act on it.",{"title":113,"searchDepth":114,"depth":114,"links":181},[182,183,184],{"id":141,"depth":114,"text":142},{"id":151,"depth":114,"text":152},{"id":172,"depth":114,"text":173},"2025-04-15","Cold traffic needs one clear promise, one clear action, and a short path from ad to result.","https:\u002F\u002Fimages.unsplash.com\u002Fphoto-1545239351-1141bd82e8a6?auto=format&fit=crop&w=1470&q=80",{},5,{"title":18,"description":186},"6vmLNdEWzXW4Hye2FkAlk9Hdp4pwAs1LgQ0oTW8D-Q8",{"id":193,"title":10,"author":28,"body":194,"date":28,"description":198,"extension":121,"image":28,"meta":255,"minRead":28,"navigation":39,"path":11,"seo":256,"stem":12,"__hash__":265},"blog\u002Fblog\u002Ffrom-mockup-to-market.md",{"type":50,"value":195,"toc":250},[196,199,202,206,209,212,216,219,234,237,241,244,247],[53,197,198],{},"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.",[53,200,201],{},"That mindset came from working with cold audiences. If the message is vague or the path is long, the traffic will expose it immediately.",[60,203,205],{"id":204},"step-1-make-the-offer-easy-to-understand","Step 1: Make the offer easy to understand",[53,207,208],{},"The first question is not whether the design is pretty. It is whether a new visitor understands what they are getting and why it matters.",[53,210,211],{},"For me, that means one promise, one audience, and one call to action.",[60,213,215],{"id":214},"step-2-build-the-shortest-useful-path","Step 2: Build the shortest useful path",[53,217,218],{},"A launch page should do the minimum required to move someone forward:",[220,221,222,225,228,231],"ol",{},[71,223,224],{},"Explain the offer",[71,226,227],{},"Show enough proof or context",[71,229,230],{},"Capture the lead or action",[71,232,233],{},"Hand it off cleanly to the next system",[53,235,236],{},"If the flow needs extra explanation, I usually remove it.",[60,238,240],{"id":239},"step-3-watch-the-first-signal","Step 3: Watch the first signal",[53,242,243],{},"I do not need a full funnel to know if something is worth pursuing. I need the first signal: clicks, replies, form fills, or qualified conversations.",[53,245,246],{},"That signal tells me whether the traffic, copy, and workflow are aligned well enough to keep going.",[53,248,249],{},"Once the signal is there, scaling becomes a much simpler problem.",{"title":113,"searchDepth":114,"depth":114,"links":251},[252,253,254],{"id":204,"depth":114,"text":205},{"id":214,"depth":114,"text":215},{"id":239,"depth":114,"text":240},{},{"title":257,"description":198},{"From Offer to Launch":258,"description":259,"date":260,"image":261,"minRead":262,"author":263},"How I Validate Before I Scale","The workflow I use to test the offer, the page, and the follow-up before spending more budget.","2025-05-10","https:\u002F\u002Fimages.unsplash.com\u002Fphoto-1556740749-887f6717d7e4?auto=format&fit=crop&w=1470&q=80",8,{"name":46,"avatar":264},{"src":48,"alt":46},"zu23RtCQAYs4jhD5DeWXMZuLcrfeBCCxLoygO9BfyFc",{"id":267,"title":10,"author":28,"body":268,"date":28,"description":272,"extension":121,"image":28,"meta":314,"minRead":28,"navigation":39,"path":22,"seo":315,"stem":23,"__hash__":324},"blog\u002Fblog\u002Fslow-design-in-fast-paced-digital-world.md",{"type":50,"value":269,"toc":310},[270,273,276,280,283,286,294,297,301,304,307],[53,271,272],{},"Speed is useful only when the result still holds together after launch.",[53,274,275],{},"That is why I prefer to automate the boring parts early: form handling, notifications, routing, status updates, and any step that would otherwise depend on someone remembering to do it manually.",[60,277,279],{"id":278},"build-the-flow-not-just-the-page","Build the flow, not just the page",[53,281,282],{},"A lot of projects stop at the visible layer. The page goes live, but the process behind it is still fragile.",[53,284,285],{},"I try to build both:",[220,287,288,291],{},[71,289,290],{},"The interface the user sees",[71,292,293],{},"The automation that moves the lead or request forward",[53,295,296],{},"When those two layers are aligned, the project becomes easier to maintain.",[60,298,300],{"id":299},"keep-the-handoff-simple","Keep the handoff simple",[53,302,303],{},"The best automation is the one another person can understand quickly.",[53,305,306],{},"That means clear field names, predictable steps, and a final result that is easy to check. If a workflow needs a long explanation, it is probably too complicated.",[53,308,309],{},"Fast delivery is good. Fast delivery that survives real usage is better.",{"title":113,"searchDepth":114,"depth":114,"links":311},[312,313],{"id":278,"depth":114,"text":279},{"id":299,"depth":114,"text":300},{},{"title":316,"description":272},{"Automation First":317,"description":318,"date":319,"image":320,"minRead":321,"author":322},"Keeping Projects Fast Without Making Them Fragile","The fastest builds are the ones that remove repeat work early and keep the handoff simple.","2025-03-01","https:\u002F\u002Fimages.unsplash.com\u002Fphoto-1516321497487-e288fb19713f?auto=format&fit=crop&w=1470&q=80",7,{"name":46,"avatar":323},{"src":48,"alt":46},"Rfi-rEWos5m5GK0_qgX5n9yUH4jra5zo5JLBPPpatlE",1776914397435]