Realistic Tap Handle Mockup – TapJacket
Fixed and rebuilt the live product mockup on TapJacket’s Insert Designer (React + Canvas, GoDaddy Airo).
Fixed uploaded artwork not showing in the preview
Built a realistic cylindrical wrap with no stretched logos
Artwork follows the curved top and bottom of the tube
Zoom, position and rotation update the preview live
Changed only the mockup code, so the rest of the site stayed exactly the same
Tested with real customer designs and installed securely without needing the client’s password
Result: customers now see exactly how their finished TapJacket will look before ordering.
#React #WebDevelopment #Frontend #backend #ProductMockup #fabricjs #canvas #JavaScript
0
5
🚀 I'm building Brandwell, an AI personal-branding coach for developers, freelancers and job seekers (currently in development).
It scores your profiles across 10 platforms, then fixes them: the new AI Rewrite Studio took a generic headline from 20 to 95/100, and Job Match shows your honest fit for any role.
Under the hood, pages now load in ~30 ms instead of 2 s, credentials are encrypted, and it's load-tested with 30 users at once.
Next up: weekly progress emails and PDF reports. I'd love your feedback!
#AI (https://www.linkedin.com/search/results/all/?keywords=%23ai&origin=HASH_TAG_FROM_FEED) #PersonalBranding (https://www.linkedin.com/search/results/all/?keywords=%23personalbranding&origin=HASH_TAG_FROM_FEED) #BuildInPublic (https://www.linkedin.com/search/results/all/?keywords=%23buildinpublic&origin=HASH_TAG_FROM_FEED) #PHP (https://www.linkedin.com/search/results/all/?keywords=%23php&origin=HASH_TAG_FROM_FEED)
0
30
Built a browser-based lamp engraving configurator and learned that "just render the text" is never just that.
Customers pick a lamp, place their text, and get a laser-ready file.
Three problems that turned out to be deeper than they looked:
🔹 Script fonts. Mapping characters to glyphs isn't typography. Terminal letters kept their connecting strokes because OpenType rules were never applied. Fixed by shaping the full text run with HarfBuzz the same engine Chrome uses, so contextual alternates, final forms and ligatures come from the font itself. Verified pixel-by-pixel against the browser's own rendering.
🔹 Millimetres, not pixels. The SVG drives a laser cutter, so every glyph is measured in real mm against engraving zones. Text auto-shrinks to fit, never crosses a boundary, and holds an 18 mm minimum letter height.
🔹 Unique order numbers. Browser counters collide when two customers export at once. Moved to a server-side counter with flock tested with 20 simultaneous requests, 20 unique numbers.
Precision work beats clever work. Every fix was verified by measuring ink pixels, not by looking at the screen.
🔗 Live demo: https://lnkd.in/d9nGb-QX
(https://lnkd.in/d9nGb-QX)#WebDevelopment (https://www.linkedin.com/search/results/all/?keywords=%23webdevelopment&origin=HASH_TAG_FROM_FEED) #JavaScript (https://www.linkedin.com/search/results/all/?keywords=%23javascript&origin=HASH_TAG_FROM_FEED) #OpenType (https://www.linkedin.com/search/results/all/?keywords=%23opentype&origin=HASH_TAG_FROM_FEED) #SVG (https://www.linkedin.com/search/results/all/?keywords=%23svg&origin=HASH_TAG_FROM_FEED) #Manufacturing (https://www.linkedin.com/search/results/all/?keywords=%23manufacturing&origin=HASH_TAG_FROM_FEED)
0
99
Digital SaaS Product Landing Page – Responsive Marketing Website
A modern landing page for a digital SaaS product, designed to explain the product quickly, build trust and turn visitors into sign-ups.
Sections I built:
• Hero with clear call-to-action and product preview
• Feature highlights, about section and product statistics
• Team showcase, testimonials and blog section
• Newsletter subscription, contact area and polished footer
Highlights:
• Fully responsive on mobile, tablet and desktop
• Clean, reusable Tailwind CSS components
• Lightweight code for fast loading
Stack: HTML · Tailwind CSS · JavaScript
Live: https://digital-saas-landing.netlify.app/
0
76