Applies to Cmsmart Product Designer (NBDesigner) 2.17.0 · Updated October 2026. Every screenshot below is a live capture from the public demo store, taken on the current plugin version.

In short

  • The NBDesigner demo at nbdesigner.cmsmart.net lets you run a real order — design, cart, checkout, admin approval and a print-ready PDF — before you spend a cent.
  • It works because the demo is the same WooCommerce storefront and wp-admin screens a live store runs, not a slideshow: the same designer, the same Orders dashboard, the same Create PDF button.
  • It takes about 20 minutes and no account: open a product, design it, place a test order, then switch to the admin side to see how your team would approve artwork and pull print files.

You are about to put a product designer plugin in front of real customers, or hand it to a print team that turns designs into shippable goods. A feature list can't tell you whether the canvas feels fast on a phone, whether your production staff can approve artwork without training, or whether the exported PDF actually matches the order. Only running an order end to end can.

That is exactly what the public NBDesigner demo is for: not a sandbox with sample screenshots, but a working WooCommerce store running Cmsmart Product Designer (NBDesigner) 2.17.0, open to anyone with no signup. This guide walks through what to test on the buyer side and the admin side, and what each screen tells you about the plugin.

What's the real cost of skipping a hands-on product designer test?

Cmsmart Product Designer's own demo store lets a buyer run a real design-to-order flow, so an evaluator sees the canvas, the checkout and the admin approval screen working together instead of trusting a feature page.

The stakes are higher than they look: the global web-to-print market is projected to grow from $26.59 billion in 2025 to $36.38 billion by 2031, a 5.43% CAGR, as more sellers add on-site customization (Mordor Intelligence, 2026). More competitors means more pressure to get the designer right the first time. Most product-customization plugins are evaluated the same risky way: a features page, a pricing table, a few marketing screenshots, maybe a sales call — none of which answers the questions that decide whether a plugin fits your store:

  • Does the designer feel fast enough for a customer to finish a design in one sitting, on a phone as well as a desktop?
  • Can your print team actually run it? Approving artwork and pulling a print file are admin tasks, rarely shown in a sales demo.
  • Does the print output match what the customer approved? A designer that looks great in the browser is worthless if the exported PDF drifts from the on-screen design.
  • What happens to a reorder, an edit after ordering, or a declined proof? These edge cases are where web-to-print workflows quietly break.
  • How much of this is "in the box," and how much is a custom build for your catalog?

Buyers who skip hands-on testing pay for it later. In Capterra's 2024 survey of software buyers at fast-growing companies, those who used a product trial during evaluation reported a 61% purchase-regret rate within 18 months, against a 68% average for companies that skipped it (Capterra, 2024). Testing before you buy measurably changes how often businesses regret the purchase.

Cmsmart insight: In our delivery work, most pre-purchase surprises come from testing only the buyer side and skipping the admin approval and print-ready PDF step. A shop can love the designer and still discover, after buying, that the approval workflow doesn't match how their production floor actually works. Test both flows before you commit, not just the one your customers will see.

What does a proper evaluation look like?

On the Cmsmart demo, you open a product, design it as a buyer would, then switch to wp-admin and run the same order through approval and print-ready output — seeing the whole chain a real sale would trigger, in one sitting.

Example scenario. A shop owner opens the demo during a coffee break, picks a stationery product, clicks Start and upload design, drops a template onto the canvas, edits the wording and colors, and clicks Process. The design lands in the cart with a live preview and carries through to checkout, where they stop just before payment — no card needed, no order placed. They switch tabs to the admin side, follow the same order through the Orders dashboard, approve the artwork in the Customer Design box, and watch a print-ready PDF appear with a bleed line and a CMYK export ready to download. Twenty minutes in, they know more than any spec sheet could tell them — including exactly what to ask Cmsmart for when their own catalog doesn't fit the demo's defaults.

NBDesigner demo product page with the Start and upload design button
The demo storefront: a normal WooCommerce product page with the designer launcher where "Add to cart" usually sits alone.

How does Cmsmart's solution map to a real store?

Cmsmart Product Designer wires six pieces together — product launcher, online designer, cart/checkout, order dashboard, artwork approval and print-ready output — and the demo runs every one of them on a live WooCommerce install, exactly as your store would.

The demo runs on WordPress and WooCommerce — the ecosystem behind 40.1% of all websites (W3Techs, October 2026) — using the same building blocks every NBDesigner store uses:

  • Product launcher. A "Start and upload design" button opens a chooser: upload a finished design, or design online from a template.
  • Modern online designer. The canvas where text, cliparts, photos and templates combine, with a Preflight Check before the buyer proceeds.
  • Cart and checkout. WooCommerce's own cart and checkout, carrying the design preview and an Edit design link.
  • Order dashboard (Cmsmart > Orders). Every design order with its production status, from Awaiting review to Shipped.
  • Artwork approval. The Customer Design box on the order screen, where a shop manager accepts or declines the artwork — locked against further edits once approved.
  • Print-ready output. Create PDF and the Cmsmart Cloud renderer produce the file that goes to the press, with SVG, PNG and CMYK/ICC exports alongside it.

All six are in the plugin today and on the live demo. What it won't show is anything specific to your catalog: a custom price matrix, a connection to your MIS or ERP, or a design area shaped to a product the demo doesn't carry. Those stay custom development — see below.

NBDesigner chooser dialog: upload a full design or design here online
The launcher chooser: a buyer picks "Upload a full design" or "Design here online" before the canvas opens.

What's the business value of 20 minutes on the demo?

Running one real order through the Cmsmart demo replaces a stack of sales calls and feature pages with first-hand proof: a working designer, a verified approval step and a print-ready file you can open yourself.

What you testHow it shows up in your businessKPI to track
The buyer flow (product → designer → cart → checkout)You know exactly what your customers will see, on desktop and mobile, before launchTime-to-decision on the plugin evaluation
The admin approval flow (Orders, Customer Design box)You confirm your own production team can run it without a training callHours spent in vendor Q&A before purchase
The print-ready output (Create PDF, Download design)You see a real PDF with bleed and ICC color, not a promise on a spec sheetReprints avoided from file mismatches after go-live
Edge cases (reorder, decline, edit-after-order)You find out now whether the workflow matches how your store actually sellsSupport tickets avoided in the first month

A simple way to frame the cost of skipping this: (hours your team spends configuring a plugin that turns out to be the wrong fit × your team's hourly rate) + (the cost of migrating again if it doesn't work out). Twenty minutes on a live demo is cheap insurance against both numbers.

How to test the NBDesigner demo step by step

Open nbdesigner.cmsmart.net, run one design through to checkout as a buyer, then follow the matching order through wp-admin — the full set of steps below takes about 20 minutes and needs no account.

Buyer side — place a test design (stop before payment):

  1. Open the live demo at nbdesigner.cmsmart.net and pick any product — the Invitation stationery item is a quick one to start with.
  2. Click Start and upload design to open the chooser.
  3. Choose Design here online (try Upload a full design separately if your buyers will submit finished artwork).
  4. In the Modern designer, pick a template, edit the text, and run Preflight Check before continuing.
  5. Click Process to save the design.
  6. Back on the product page, confirm your saved design shows as "Your artwork" next to Add to cart, then add it to the cart.
  7. Open the cart and confirm the line item carries a design preview and an Edit design link.
  8. Go to checkout, fill in placeholder billing details, and confirm the design appears in the order review — then stop before entering payment. No order is placed.
NBDesigner Modern online designer with an invitation template open on the canvas
The Modern designer (2.17): templates, text and Preflight Check in one canvas, opened straight from the product page.
WooCommerce cart line item showing the saved design preview and Edit design link
The cart carries the design preview and an Edit design link on the line item — test that it survives to checkout.
NBDesigner product page on a mobile viewport with the design button above Add to cart
Don't skip mobile: the same launcher and designer run at 390px wide, where a large share of buyers will actually land.

Admin side — follow the same order through production:

  1. Open Cmsmart > Orders and note the status counts (Awaiting review, In production, Completed) and the per-order production status.
  2. Open an order and check the production timeline — Placed, Paid, Awaiting review, In production, Shipped, Delivered.
  3. Open the Customer Design box on the WooCommerce order screen and test Accept on the artwork; note that once approved, the design is locked against further edits — the approved-artwork lock shipped in 2.17.
  4. Open Design detail to see the design stored per line item, exactly as submitted.
  5. Open the Create PDF tab and check the print-ready PDF status (Ready, Rendering, Failed or Not rendered) — this is the print-ready PDF that matches the order, not a resized mockup, a fix shipped in 2.17 for custom-size products.
  6. Click Regenerate print-ready PDF and confirm a fresh certificate and timestamp appear.
  7. Open Download design and test the SVG, high-resolution PNG, CMYK JPG (with ICC profile) and PDF exports.
  8. Check Cmsmart > Files to see production files, DPI and preflight status across every order — useful for spotting low-resolution uploads before they reach the press.
Cmsmart Orders dashboard listing every design order with its production status
Cmsmart > Orders: every design order with status counts and a filter by order or customer.
Order detail screen showing the production timeline, line item design and customer panel
Order detail: the production timeline, the line item's design file, and quick actions like Download print PDF.
Customer Design approval box with the artwork accepted and the notify-customer form
The Customer Design box: accept or decline artwork, then notify the customer — this is the approved-artwork lock in action.
Create PDF tab showing the print-ready PDF status rendered by the cloud renderer
Create PDF: print-ready status, paper size, margins and bleed line, rendered by Cmsmart Cloud.
Download design panel with SVG, PNG, CMYK JPG and PDF export options
Download design: SVG, high-resolution PNG, CMYK JPG with an ICC profile, and PDF — the formats a print floor actually needs.
Video thumbnail for the Cmsmart NBDesigner WooCommerce product customization demo
Video: a walkthrough of the Modern WooCommerce product customization UI (Cmsmart on YouTube).

Going further: what can Cmsmart build on top of the demo?

Once you've tested the demo, Cmsmart's team scopes the gap between what you saw and what your catalog actually needs — custom price matrices, ERP/print-API connections, or a tailored approval flow — and builds it as a project, not a plugin setting.

The demo runs on a generic catalog with default settings. Real stores need more — here is what we most often build on top of it, and why:

  • Custom price matrices and print options. Quantity breaks, material, finish or combinations no default option set covers — we build and configure the exact price matrix your catalog needs; see our print pricing option walkthrough.
  • ERP, MIS or print-API integration. The demo's order dashboard is self-contained; a real print shop often needs orders flowing into an MIS or print API automatically — an integration build, not a toggle. See our print API integrations guide.
  • Catalog-specific design areas. Car wraps, packaging dielines, gang sheets and other non-standard products need design areas shaped to the product, not the demo's flat stationery template.
  • A B2B or branded approval flow. Multi-step PO approval or a white-labeled proofing screen instead of the default Customer Design box.
  • AI preflight tuned to your tolerances. The built-in AI preflight catches common issues; stricter or industry-specific checks (bleed rules, Pantone matching) are a custom pass on top.

Every one of these follows the same delivery path: discovery call, solution design, build in sprints, QA against your real catalog, launch, then support — the process behind the Cmsmart project delivery model. Or start from the free Lite plugin to prototype on your own store first.

Get a custom product designer quote

Cmsmart insight: A demo running stock settings will always look simpler than your real catalog. Before you sign anything, check how the price matrix and print options behave with your actual SKU count and option combinations — not just on the one product you tried.

Why work with Cmsmart

Cmsmart has built web-to-print and product-customization stores since 2012 as a division of Netbase JSC, with 6,300+ client projects and a 4.2-star Trustpilot rating from 404 reviews.

Proof pointDetail
Track record6,300+ client projects, 4,600+ delivered, since 2012
Scale1,800+ live stores running today, in 80+ countries
Custom development500+ custom development projects since 2012
ReviewsTrustpilot: 4.2 / 5 (404 reviews)

"We have had the NB Designer plugin installed for three years and have experienced absolutely no problems during that time... The designer works exceptionally well across all devices and allows us to create the exact customisations required to perfectly fit our products and our business model." — Web Developer, United Kingdom, Trustpilot

That same team runs the demo you've just tested and takes on the custom work it can't show.

Frequently asked questions

Is the NBDesigner demo free to use?

Yes. The demo store at nbdesigner.cmsmart.net is open to anyone, with no account and no cost. You can design, add to cart and reach checkout; stop before entering payment and no order is placed.

Do I need to install anything to try it?

No. The buyer flow and admin screens above all run in your browser against the live demo store. Installing the plugin on your own WooCommerce site is a separate step, for when you're ready to configure it against your real catalog.

Can I test the admin and approval side, not just the storefront?

Yes — that's the step most evaluators skip. Follow the admin-side steps above (Orders, Customer Design box, Create PDF, Download design) to see how a shop manager approves artwork and pulls a print-ready file.

What plugin and WooCommerce version does the demo run?

Cmsmart Product Designer (NBDesigner) 2.17.0, released October 2, 2026, on a current WooCommerce install — the same version this guide's screenshots were captured from.

Can Cmsmart customize the designer beyond what the demo shows?

Yes. Catalog-specific design areas, custom price matrices, ERP/print-API integrations and branded approval flows are scoped and built as custom development — see "Going further" above.

How long does it take to get a custom quote after testing the demo?

Submit the project proposal form with what you found on the demo and what's different about your catalog; Cmsmart's team follows up to scope a discovery call.

Ready to move past the demo?

You've seen what Cmsmart Product Designer does today. Tell us what your catalog needs, and we'll scope the build.

Plan my product designer project See the product designer customization service