A reader-made appendix to The Sketch Handbook by Christian Krammer
I hit a roadblock today as I was reading through The Sketch Handbook by Christian Krammer- the Craft plugin wasn’t randomizing my text or photo data when I used the duplicate feature. It also seems like many others have been experiencing this issue as well with the new version of Sketch, so here’s a quick and easy alternative for those reading the book in 2019.
Procuring your own custom data
In Christian Krammer’s original example from The Sketch Handbook he is populating fields using Craft’s text plugin with cities and countries for his Visit Austria app- but I’m Korean, and I want to make a Visit Korea app with dummy text that matches my context better.
I started by googling up a Wikipedia page quickly of all Korean cities. These were nicely packaged in an online tabled list.
Two things that we can do from here. Either A) download a plugin that allows us to copy just the column or B) copy the entire table and paste it into Microsoft Word. Since I’m kind of lazy, I did option B.
We want to save just the first column of information to use for our dummy data in Sketch. To do so, let’s do the following:
- Get rid of all the hyperlinks first by using CTRL + A (select all) followed by FN+COMMAND+SHIFT+F9 (remove hyperlinks).
- Select the column and copy it.
- Paste the column into any text editor and delete any extra lines. I personally like to use Brackets!
- Save the list as a text file and we’re ready to move to Sketch!
Open up Sketch and use the shortcut CMD + , (open preferences). Go to the Data tab and click “Add Data.” You’ll be prompted to select a text file. Pick the one that we just created and make sure it is checked on selection!
Duplicate and randomize your data
We’re going to start with Christian Krammer’s example. Here we have a symbol with an rectangle with an image fill and some text fields that we will want to populate.
We’ll start by using Craft’s duplicate tool, which still works- but doesn’t randomize the outputs. You can alternatively just copy/paste or alt drag if you don’t have the Craft plugin.
Once you have the generic cards spread out, let’s add randomized data using our custom text file we installed earlier. If you’ve set up your symbol correctly, all you have to do is click the little overlay icon and select your data set to populate.
And with that you now have custom randomized images and text without having to click through every single card!
This also works if you need custom text for foreign languages, which may prove useful to some designers.