Blog: user interface

When you create technology products, you have to iterate, iterate and iterate some more to get them right. eBlox built the first “virtual sample” product in the promotional products industry about twenty years ago for Norwood Promotional Products. Many things have changed since then; Norwood is now part of Bic, and the kind of technology that was once popular for virtual samples—Adobe’s Flash—has been relegated to the dustbin.

But people still need to present ideas to their clients, so the need for virtual samples is as big as ever. Our longtime client 3M Promotional Markets decided a few years ago that they wanted a virtual sample tool where users could very quickly and seamlessly create sample Post-It® custom printed note pad designs, so we took to pen and paper —ok, not really; we used a bunch of cool programs and prototyping tools. But we made something cool, and you should check it out.

Our primary goal with the 3M Virtual Sample tool was simple: Instant gratification. Most industry virtual sample tools force you to load up popups and deal with a completely different user interface. We wanted something that was built into the existing structure, using the same look and feel as the web site:

The user interface is both simple to use and accurately represents the finished product.

Secondarily, we wanted it to be reasonably bomb-proof. Virtual sample and online design tools often turn into miniature versions of desktop graphic design tools—they’re loaded up with options, transformations, clip art and all sorts of other things that distract from getting the job done quickly. So, we stripped out everything we possibly could to simplify the process. Everything you see is what you can do. No hidden menus, buried features or tricky operations. No funky technology that has problems with different browsers or touch devices. Simple and effective.

We added some cool orientation controls as well, since you can take a Post-It® note and turn the adhesive side however you’d like for printing. You can also quickly swap pad sizes to see different layouts:

Size and orientation controls allow users to try out different layouts quickly.

Finally, we wanted to make sharing easy throughout the process. Most virtual samples let you share them; ours has a one-click PDF spec sheet, with your full sample and all related product information. Each product has a unique ID that can be shared with anyone who needs to see or provide feedback on the sample. And an instant, drop-down Project listing makes it easy to copy and share new projects.

One-click PDF generation creates a fullly-designed spec sheet/sample in seconds.

Please go check it out when you get a chance and let us know what you think!

Categories: Launches

Tags: 3M promotional products user experience user interface virtual sample