Posts Tagged ‘design tool’

Viz Series: What is Visualization?

February 27, 2013

In this three-part series, we’ll find out how visualization plays a crucial part in making your favorite Zazzle products and learn more about some of the mystery members of the Viz Team.

Every day on our site, people are zooming in on their one-of-a-kind iPhone case to get their initials just right, they’re designing the perfect slogan on a fitted t-shirt for their favorite pooch and they’re transforming their gorgeous wedding photos into a wrapped canvas work of art.

There’s much more that goes into making it all happen than meets the eye. The technology we use is completely novel — to make that bright red “Keep Calm and Om Nom Nom” mug you’ve been pining for, it needs to be rendered virtually, as though the mug were already sitting on top of your kitchen table. While your mug doesn’t exist (yet), you’re able to see just how it would look, as if it’s already been manufactured. Without our technology, you wouldn’t be able to make your perfect product — exactly to your personal specifications, just how you want it.

Om Nom Nom Mug
Om Nom Nom Mug by carryon

You have Zazzle’s Visualization Team (or the “Viz Team,” as we affectionately like to call them at Zazzle) to thank. Though they tend to hang out in a dark room, questions about who they are and what they exactly do became so numerous (and so pressing) that we decided it was time to shed some light on this team.

We cornered some members (they don’t put up much of a fight) and got the download on visualization (or as much as they could tell us without giving away all their secrets).

Visualization

Visualization at Zazzle can best be summed up as the perfect blend of engineering and art. The team uses proprietary technology and computational photography to make it easy for anyone to upload an image, make design tweaks, and see a product as though it’s already made. Users and sellers don’t have to know anything about 3D modeling — that’s why we have the Viz Team around. The Viz Team is responsible for making it look all too easy.

Screen Shot 2013-02-27 at 1.50.53 PM

Product Magic

A lot of the magic happens when they gather information about each and every product before it launches on our site. Products and samples are examined to see what areas can be customized and where designs can be printed. When they talk to product manufacturers, the Viz Team gets manufacturers to help specify design areas (which later become your design areas on our site).

After they nail down that info, they prep the product samples for a photoshoot — much like for real-life human models or starlets, except the products don’t demand bottled water or take calls from their publicist.

“Special” Photography

Once the Viz Team figures out what one can actually design or make on the specified areas, they take a photograph with “special cameras.” This process is meant to help you: it gives consumers and designers a way to look at the product and see exactly where the design could go once the product is on our site. For more complex products, the team will actually go the distance and build 3D models.

On Site, Ready to Customize

Through “special image processing,” the team locates the design area for the product and then the product goes on our site for your customization.

Once it’s on our site, the product is ready for your designs (using our nifty design tool.) A lot of people don’t hit “the plus button” (shows the high art view of the product), which gives you the precise field of the area that you can design. This makes the Viz Team sad.

Screen Shot 2013-02-27 at 1.44.41 PM

More fun facts: the red dotted line is called the “safe area,” or the area where the image is guaranteed to be printed, the “black area” shows the actual size of the design area, and the “the bleed area,” or red solid line, allows for extra jostling when the product is actually made, so you won’t get uneven spaces of white on your product.

Next up, meet some of the members of our Viz Team. 

Seller News and Updates

February 9, 2013

The Great Design Tool Migration

If you’ve noticed different design tools on some products versus others, it’s not your eyes playing tricks. For the next three months, we’ll be focused on converting roughly 60 design tools from the old to the new platform tool.

We’re working to help you take advantage of streamlined product creation, different fonts and unlimited rotation with our products. We want customers to find what they need — a customer searching for elephant iPhone cases, for example, can now find the design that they want on many more phone styles and options.

(Psstt – Here’s a tool tip for unlimited rotation: Hold down the CTRL key and click the rotate button. This will give you the ability to incrementally rotate images and text down to an exact degree.)

Our Merchandising Team Wants Your Designs

Our merchandising team has plenty in store for 2013 and they want to see your designs! They’ll be reaching out frequently to let you know about upcoming campaigns and how you can get involved. They’re looking for new content and products timed to holidays, so remember to frequently check our Merchandising Forum section.

They’re doing a call for designs for Valentine’s Day right now – don’t miss out.

Royalty Reminder

Just a reminder to have your store royalty updates ready by the 19th of each month. Another tip – if you’re selling at a single rate across all of your stores, you can adjust royalties with a single click by visiting Account Tab/Seller Account/Default Royalty.

Calling All Honey Badger and U.S. Army Fans

The best thing about Zazzle’s recent partnership with the U.S. Army and Randall’s Honey Badger is the chance for you to submit your own unique designs and fan merchandise. We’d love to see your designs for both stores! Remember to create original designs — and keep it in good taste. Don’t use official images or logos that you find on the web.

For more in-depth rules and how to get started, please see Rules and Regulations for U.S. Army Fan Merch and Randall’s Honey Badger.

Seller Spotlight: Lora Severson

November 15, 2012

While some photographers opt for capturing the entire scene, Lora Severson (Lora Severson Photography) prefers the close-up. And for good reason — residing in the countryside of rural Illinois, she’s surrounded by vibrant meadows, colorful flowers and old barns, all of which are detailed subjects for her lens. Known for her original high resolution floral photography, she’s a lover of the rustic and the weathered. We’re glad that she turns her shots into invitations and greeting cards on Zazzle for all of us to enjoy.

I’ve always loved taking pictures, but I wasn’t really serious about it until my kids got older. I poked around some stock photography sites and it really piqued my interest. We have a fantastic arboretum near here that offers certified floral and nature photography classes. I decided to dive right in and it took me about two years at night to get my certification. I knew a lot about photography, but I didn’t know about the technical details, like how you lay out flowers to get the perfect micro-shot.

Soft White Daisy iPhone 5 Case-Mate
Soft White Daisy iPhone 5 Case-Mate by loraseverson

I especially love designing for rural farm, barn ranch and country weddings — they’re especially popular with Oklahoma, Texas, Tennessee and Illinois residents. I’ll incorporate photos of antique farm equipment, rusted wagon wheels and aged saddles. Many customers love to order whole sets of invites, including matching envelopes, thank you notes and custom postage to create a coordinated set.

Rustic Daisy Country Wedding Favor Tags Business Cards
Rustic Daisy Country Wedding Favor Tags Business Cards by loraseverson

There’s a lot of thought and planning that goes into my invitations. I brainstorm how I want to position the space for words, how that fits with the flowers I want to incorporate, and which flower arrangements go well with others. We have all four seasons here, and sometimes when it’s cold and there’s nothing to do, I’ll go outside and look around to see what would make for great close-ups that I can later turn into wedding invites, greeting cards, special occasion announcements and even ornaments. One time I found an old barn that was being torn down, and decided that the barn wood would make for the perfect picture, especially with flowers against it. I find that some of my best photos (and later, products) come from creative serendipity.

Red Barn with Fence Greeting Card
Red Barn with Fence Greeting Card by loraseverson

Rustic Daffodils Country Wedding Favor Tags Business Cards
Rustic Daffodils Country Wedding Favor Tags Business Cards by loraseverson

More than just embroidery…

October 31, 2008

Release O’Plenty

Wow. What a release! If you haven’t noticed already, we’ve just pushed out one of the biggest releases in Zazzle history. Not only are we now doing real embroidery, but we’ve packed this release full of candy-coated goodness! Unfortunately, we’ve hit a couple performance snags, but we’re getting those resolved very quickly – keep your eye on the Zazzle Forums for updates on that front.  For a quick overview, read our main blog post entitled Embroidery AND New Features. In this post, I’m going to get into some detail on some new features of the Zazzle Design Tool.


I’m such a tool(bar)

One of the first things you might notice is the look of our toolbar. We’ve reorganized it to show more options in a familiar menu style.

There are now Select, Edit, and Align options in the toolbar. These features help you select design elements, copy and paste them, and align them relative to each other. Next time you create something, check them out!

Also, if a product contains more than one design area (front and back of a t-shirt, multiple areas of a shoe, etc.) an Area selector appears on the left. This is a quick and easy way to select the different areas of a product to design on. And the best part is that now they contain easy to understand icons.

Oops, I messed up again

One thing a lot of people do is customize an existing design. You see a cool design and want to add your name, or you want to nudge the image a bit higher. If a contributor has allowed customization, anyone can do these things.

Of course, when you start messing around with a design, you may end up with something that doesn’t quite look like you pictured it. What to do?

REVERT! Yes, now there is an option to revert any design to its original state before you started changing things. Revert is located just under the Post for Sale button.


Templates made easy

So here’s the big one. The top banana. The Big Kahuna. El Jefe. Yes, ladies and gentlecontributors, we now have an easy way to make templates! Zoinks!

“You mean we don’t have to double-click somewhere and add cryptic brackets anymore?”

Correct. There is now a template UI!

You can make a product become a template by simply defining which image(s) or text object(s) can be replaced by the buyer.

Example:
Add an image to a product. You will notice an “Advanced options” link on the image object.

Click the Advanced options link to show all advanced options.

One of the options is a checkbox labeled “Make this a template object”. Checking that box will display all the options available for defining this template image placeholder.

When you select “Make this a template object”, you have access to four options:

  1. Product page label – This is the label that the customer will see on the product page. Use something descriptive here, like “Your picture” or “Your logo”.
  2. URL parameter name – If you are using the Zazzle API to pass data to this product from an external source, this is the parameter name the API will use. Avoid spaces or special characters. You can safely ignore this field if you are not working with the API (see the Zazzle API documentation for more information).
  3. Inner fit/fill mode – For images.If your template allows the buyer to replace your placeholder image with one of her own, this setting determines how the buyer’s image replaces yours. The options are none, fit, or fill.

    none
    – If you set Inner fit/fill mode to none, the buyer’s image simply replaces your placeholder image, and may be larger or smaller than the placeholder.fit – Selecting fit will resize the buyer’s image to fit inside of your placeholder image object’s dimensions. This will ensure that their image is not cropped.

    fill
    – Selecting fill will resize their image to fill the entire dimensions of your placeholder image. If the buyer’s image is wider or taller than your placeholder, this may result in zooming and cropping of the customer’s image.
  4. Allow editing on product page – Keep this checked if you want to enable EZ Templates on your product page. Unchecking this option is usually only done when working with the Zazzle API.

Once you have filled out all the options, click Post for Sale. You are then presented with the normal Post it for Sale page. Notice the checkbox labeled “This product is a template”. This tells you that the product contains template objects, and that it will be posted for sale as a template. Only uncheck it if you decide at this point to not allow customer personalization of this product; otherwise keep it checked.
Congratulations! You have just created a template product!

Lock it up!

Sometimes, you may want to create a template product but have items that are not changeable by a customer. Now you can simply check the box labeled “Lock this image” or “Lock this text object”. This will essentially lock the item and not allow any editing of it whatsoever (can’t delete it, move it, resize it, etc.)

That’s all there is to it, folks!

Face the Typeface…or Meet FontZee!

June 30, 2008

I gotta tell you…playing around with Zazzle’s text tool is fun. There are so many cool fonts to choose from that I don’t think I’ve ever actually seen them all. I always end up finding one I like before I explore deeper.

But therein lies a problem…with so many fonts to choose from, it takes a long time to test each one out to see if it works in your design. Add to that the fact that you would find a font, select it, the font chooser would go away, your design would get updated, and THEN you make the decision whether it works or not. If it doesn’t, you start all over and open the font chooser dialog again. Phew.

Well, be weary no longer, folks! There’s a new font selector in town, and he’s kicking picas and taking names! I call him FontZee. (Hey, why not? We have Maggie the magnifier!)

Bask in FontZee’s glory:

Cool, beautiful, easy...it\'s Fontzee!

So what’s so great about it?

  • Fonts are organized better…each font category now lists how many fonts it includes
  • Select a font and see it update on your design immediately! This is the big one for me. Now I can scroll through and select a font, immediately decide whether it works, choose another one, etc.
  • Recently used fonts are now saved in the dialog
  • The font dialog actually loads a bit faster :-)

See, people? It’s the little things that make me happy!

The name FontZee is not official, nor does Zazzle promote the use of it. It is simply a product of this editor’s sick mind, and any similarity to any person, living or dead, is purely coincidental. The end.

New design tool features…

March 3, 2008

These new features are so cool, I just have to cross post here in the Tech Blog! Line things up accurately…check! Space things out evenly…check! Follow the link for details…

Please form an evenly spaced single line

To keep things on the tech topic, here’s a little CSS tip on how to center a block element inside another block element. Here’s a CSS class:

.centerme {
  margin-left: auto;
  margin-right: auto;
  width: 140px;
}

And here’s the HTML:


<div style="width: 400px">
<div class="centerme">This is text inside a DIV tag.</div>
</div>

The idea here is that we are setting the left and right margins of the parent DIV to be equal (auto), and the inner DIV, with a width of 140px, automatically gets centered. Neat.

Please form an evenly spaced single line…

March 3, 2008

One thing that has always frustrated me when designing a product on Zazzle has been the inability to place text and images precisely and accurately. For example, when adding two or more text objects, I usually want them to line up with each other. Until now, that was a manual trial and error process that usually ended up with a comment like, “Close enough!”

Well, we can now say goodbye to the eye strain, goodbye to slightly irregular designs, and goodbye to micro-mouse attempts at non-attainable perfection. Introducing the align dialog!

Align Dialog

Now, when you have multiple items selected in the design tool, you can bring up this dialog from the Edit menu and select what type of alignment you need! YAY! It is finally possible to accurately line up all your text or images!

Align left

How cool is that? What? You want more? Wow, you guys are picky. Fine. Hmmm, let’s see. What else do we have in our little bag of tricks?

How about Vertical & Horizontal Spacing!

What is that, you ask? Well, in very simple terms, it’s an algorithmic construct designed to eschew random or unequal voids in the midst of visually rendered binary objects. (duh!)

Ok, maybe it’s easier to show you an example:

Space evenly
Yes, from the Edit menu in the design tool, you can space selected objects evenly either horizontally, or vertically! Combined with the Align dialog, this gives you a great set of tools to start you on your way to precision-greatness, and save you from prematurely going bald by pulling out all of your hair. Word to your mother.

Follow

Get every new post delivered to your Inbox.

Join 631 other followers

%d bloggers like this: