Problem

Vistaprint’s new company mission was to be the take care of the marketing needs to small businesses. One of the biggest parts for a business to establish their brand is to have a logo, and this was identified as a major pain point with our user base. It was hard to find a reliable design or design agency, those designers often charged more money than our customers were willing to pay, and they were often unhappy with timeframe as well as the quality of the final result. Vistaprint wanted to utilize algorithmic design and Machine Learning to create a logo generator tool so that users could create a logo for their business for free, thus increasing sales of custom-printed merchandise.

User & Business Goals

We wanted our logo generator tool — Logomaker — to be used by customers who didn’t have strong design skills to create professional-looking logos on their own in a matter of minutes. We also wanted to make sure that the logos that users were generating were unique and specific to their business and their tastes, instead of other competitor services whose logos, while looking high-quality, often times looked very similar to logos it was generating for other users.

Low barrier of entry: Most small business owners had neither the ability, time, or interest to design a logo themselves. This product was geared for those people; they couldn’t be expected to do their own art direction, they just had to know what they liked once they saw it.

High-quality results: Logomaker needed to be able to generate logos that looked like they were created by a professional designer. Most tools are flexible enough to create impressive results with a skilled enough user, but we wanted to make sure that it was easy for anyone to get great results.

Customizable: Other competitor logo generators produced good results, but there wasn’t a lot of variety among them. That meant that if you used their product to create a logo for your business, you might see a very similar looking logo on other businesses. We wanted to make sure that our logos were personalized and custom. We noticed that users also responded positively when they felt like the logo matched their business’s personality and characteristics. We needed to provide enough levers for the user to feel like the logo they created were unique to themselves and their business.

From Vistaprint’s perspective, they wanted to provide users with logos for free with the expectation that once a user had a logo and brand, it would encourage them to order more custom-printed merchandise. Their key conversion metric was the amount of Logomaker users who went on to use their logo in subsequent purchases.

Solution

There were three components to Logomaker’s user experience:

Survey: The user is first presented with a few screens that ask them basic questions about their business: the company name, what kind of industry its in, and what kinds of symbols or imagery they think would go well with their business.

Gallery: All the user-provided information was fed into the algorithm to determine relevant graphics, colors, and typefaces. Those would then be combined into various layouts and create a logo. The user would be brought to a gallery of different personalized logo possibilities that they could scroll through to pick the one they liked the most.

Editor: If the user found a logo in the Gallery that they loved, then they could choose it and be done. But if they found a logo that they liked but wanted to tweak a little, they could bring edit it and make more fine-grained changes to the logo. Aside from changing the font, colors, and sizes of any of the logo elements, they could also add a monogram or border to their logo. We wanted to make sure that while the Editor gave enough controls to customize a logo’s precise details, it still had the guardrails to always produce a well-designed logo, even despite a user’s poor design decisions.

Designing the algorithm

The UI and user’s experience of Logomaker was only half of the challenge: the more complicated task was designing the algorithm and the feedback loops to inform the Machine Learning to produce logos that looked like they were made by a professional designer. I worked closely with the engineers to establish a new job function in the organization that was the intersection between engineer and designer: a technical/creative hybrid that could provide guidance to the creation of algorithms that were intended to have designed outputs.

One of the new types of logos I worked on was the Monogram logo, which used the business name to generate a monogram to use as the graphic of the logo, with all of its different kinds of variations. When implementing monogram variations, I defined the system that enabled a range of variations, including:

• Number of characters (1-3)
• Background type (none, solid, outline)
• Background shape (rectangle, circle, polygon, graphic)
• Graphic sizing (full-width, small)

After the alpha release of Logomaker, I focused most of my time on making improvements to the design algorithm. While the functionality and the user experience of Logomaker was working well, the actual logos that were being generated still weren't good enough to convince people that it was done by a design professional. Here are some examples of the type of guidance I provided to engineers to improve the algorithm.