As per topic, anybody can advise me pleaase. Thanks
http://www.zazzle.com/personalized_large_t_shirt-235720396763667998

Dani AI

Generated

Following up on the thread: building a Zazzle-style “design your own” interface is best thought of as two distinct pieces — a browser editor for live composition and a separate render pipeline that produces print-ready artwork. , and have already pointed in the right direction; the notes below add practical choices, pitfalls, and a simple client-to-server step.

For the interactive editor use vector-friendly tools so text and logos stay sharp. HTML5 Canvas or SVG are the usual bases (see the Canvas API and SVG docs). Libraries such as Fabric.js or Konva give an object model for draggable text, snaps, layers and export. For realistic mockups (skew/perspective) consider a WebGL or mesh-based approach for the preview.

The backend should produce a final, high-resolution file for the printer. Typical steps: flatten the composed artwork at print DPI (300 dpi is a common target), convert colors to the printer profile, outline or embed fonts, add bleed/safe margins and output a print format the vendor accepts. For server-side rendering use efficient image libraries (for Node, Sharp; for Python, Pillow) and run heavy renders in background workers with caching and CDN storage (Sharp docs, Pillow docs, AWS S3 for storage).

Quick tips and gotchas: detect low-resolution uploads and warn users (required pixels = inches * DPI), sanitize SVGs to prevent XSS, limit file sizes, and consider a manual or automated review step for copyright issues. For sending the browser preview to your server you can export the edit surface; for example use canvas.toBlob(blob => upload(blob), 'image/png') and trigger a background job to produce the final print file.

Recommended Answers

All 5 Replies

What exactly is your goal? To create an ecommerce site? Please take the time to provide some details if you expect any type of help and/or guidance.

To understand what program to used to design the application of "self designing" like zazzle

So, its not really possible to tell what program was used to build this site by just looking at the site and/or HTML source, unless the developer left behind HTML comments that would indicate what was used.

For sure, there is server-side programming. The web application could be customized PHP, or it could have been developed with some type of eCommerce web application that generates the code for the developer.

Member Avatar for Member #46692

They're no doubt using imagick to warp around the contours of the T-shirt. Probably not worth the extra server processing power for sake of aesthetics IMO

It is the same script type used to make all those personalised roadsigns
ajax using imagettftext() to create a transparent overlay. This one is more sophisticated there is a texture map applied to the generated image that closely matches the underlying tshirt.
The layer does not alter the tshirt image, just sits over it

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.