Sketch Tips: How to use the content generator plug-in

September 2, 2020

Professional digital design tool Sketch may be one of our favorite applications. Not only is the UI incredibly simple to master, but there is also a huge community of developers and designers that make a dizzying array of plugins, templates, and other goodies to make it an even more useful tool. In this HoA series, we take a look at some of our favorites. Today, we’ve got the skinny on Content Generator, a plugin that makes creating placeholder and filler content a snap.

Content Generator is one of our favorite time-saving plugins for Sketch. This free tool gives you a rich array of dummy content to populate your mockups with. Thanks to Content Generator, you no longer need to rack your brain or scrounge around for realistic content. Nor do you have to enter it by hand. Content Generator provides the ways and means to see what your site or app will really look like once it goes live and attracts users.

To get started, open up the Sketch Toolbox plugin (which you should definitely download if you haven’t already). In the search box, type “content.” The Content Generator plugin should be the first result to come up. Click Install. Simple as that.

To use your freshly installed plugin, click Plugins from the main Sketch menu, then select Content Generator Sketch Plugin. Four categories of dummy-content to choose from will appear:

  • Geo
  • Persona
  • Photos
  • Text

These four categories should cover nearly every dummy-content demand you’ll come across. Suppose, for example, you need a bunch of names, faces, emails, locations and, of course, text to populate your mockup of a community site. Furthermore, suppose you don’t want to use the same names, faces, text and so on again and again.

Without Content Generator or a similar plugin, you will have to scrounge for realistic content and enter it manually. Unless you have hours and hours to spare, we wouldn’t recommend this approach. On the other hand, with Content Generator, the whole process is practically automatic.

Sticking with the example of designing a community site, let’s suppose you wanted to start with images and names of community members. Simply select the shapes in your sketch page or screen where you want the headshots to appear. Then go to Content Generator and select Persona >> Images. You can then choose female, male or gender-neutral photos. Then watch as all of the fields you selected on your page or screen suddenly populate with corresponding faces. It’s really that easy.

To add names to your faces, select the fields in your mockup where you want the names to appear. Next, return to the Content Generator menu and the Persona category, but select Names this time. Then watch as the fields you selected in your mockup magically populate with names to go along with the faces in your community.

You can continue through this same process to add locations. First, choose a country, then (at least in the case of the U.S.) select State, City or even Full Address.

Although the Persona category is enormously helpful (as is the Geo category and the Photos category), the Text category is where Content Generator gives you the greatest degree of control. The free plugin gives your four options to choose from:

  • Custom string
  • Dummy text
  • Enumerate
  • Time ago

For the purposes at hand, let’s drill-down on Dummy text. Here Content Generator offers not only your run-of-the-mill Lorem ipsum text, but Hipsum (short for “hipster ipsum”), among other options. Suppose your community skews relatively young. Depending on your audience, you might choose Hipsum to populate the respective profile bio fields and conversational content throughout your community mocks. Content Generator makes it easy not only to put something more familiar than Latin in there, but has a Replace feature that makes it easy to mix up the dummy content for a more varied and realistic appearance.

Content Generator: a must-have plugin for Sketch

We’re big fans of Content Generator, and now you can see why. This free plugin saves you tons of time, populating your screens and pages with a variety of photos, names, email addresses, locations and even hipster ipsum if the need arises. Either way, Content Generator will save you hours or even days of effort racking your brain or scrounging around for realistic dummy content. And thanks to the plugin’s tight integration with Sketch, the content will flow directly into the corresponding fields you select. The result: you can now get a quick and realistic sneak peek of what your future site or app will really look like.

To learn more about the wonders of Sketch and how we use it to create beautiful, human-centric designs and mock-ups, hit us up.