Cats of the digital age use a computer

Drawing by hand is great fun, and all maps in the book can be done with pen and paper; each chapter will show you how to do the map with software. Digital tools will result in easier to edit and more readable maps while sacrificing the handmade charm. If you don't intend to sell your maps on Etsy or eBay, but use them as a communication tool, then digital might be the way to go.

I will use different software, my personal favorite for a map type. This, of course, doesn't mean that you need to use that software. This book is not intended to be a tutorial for any of those software products, so just use what's the easiest for you.

In my eight years as a people manager, the most frequent software product I have seen in CVs is Microsoft's Office package, more specifically Word. Although Microsoft Word is rarely among job requirements for a UX job, most people will know the software at least to a basic level. Although people have Word installed on their machines and use it to write shorter or longer texts, most people would not think of it as a User Experience Mapping tool.

On the screenshots, you will see Microsoft Word 2016, but you can use older versions to achieve similar effects. I will not use any feature new to Word 2016. I will use the Windows version, running on Windows 10. Again, you can use the Mac version to achieve the same look and feel. 

To create our journey map, launch Word and Insert a SmartArt Graphic from the Insert tab's Illustrations group, selecting SmartArt:

In the following choose a SmartArt graphic dialog box, click on the type and layout that you want. There are many types available, but for our mapping purposes, Process seems to be the best starting point. With that said, please experiment with other types too.

For now, let's just pick Basic Process:

Now, we can add our textual content. For this demo exercise, we will not specify user groups, just as we only intend to target cat-sitters. To add text to SmartArt, we can use the text pane. If it's not visible, you should click on the control button (that usually looks like a "<" character): 

Once you are in the text pane, simply type in the text. Each top-level list item in the text pane will create a card as a map element. You can even copy and paste a list. If you press Tab, you can add sub-elements; those will be shown on the card as a list:

Remember, for each map, you need to create a structure that can be easily and quickly understood by a miscellaneous passer-by. For our map, it makes sense to name the card by the outcome. 

As the second level, we want to add a short version of the requirements associated with the outcome. Pressing the Tab key at the beginning of the line will enable you to make a first-level item a second-level item, pressing again will make it a third-level item, and so forth. Pressing the Backspace key at the beginning of the line will decrease the level, making the second-level item a first-level, for example: 

At this point, you might realize that the Basic Process SmartArt type might not be the best for our map, as one card is not the result of the previous card, but they are all needed to make our cat happy. Fortunately, you don't need to recreate the SmartArt. You can change the type on-the-fly from the Layouts selection in the Design tab, as follows:

When you hover over different layout types, you can see their effect on our map, while clicking on one commits the change of type. For this map, arguably the best type would be Vertical Arrow List. All of our efforts should lead to fulfilling the opportunity, and they are not necessarily a result of the previous card's fulfillment. You can easily give food and water at the same time, no need to wait until the cat finishes drinking before you put down the food bowl. 

Same as with the hand-drawn map, vertical placements of a color can be a good representation of importance here. Remember, if you draw two cards, one above the other, then people assume that the one above is more important. What's easier to do digitally is to gradually add tints of a color to highlight importance. A tint is the mixture of a color with white, which increases lightness. This means that the most important box will be the pure color, without white mixed in, and we add more and more white as we go down the importance scale.

To do this, Office has an easy solution. Just go to the Design tab and select Change Colors. There, you can find the gradient range of your chosen color. I have picked green because it is often associated with safety or the most important outcome. Moreover, it has a strong emotional correspondence with life, health, and clean environment. It is also the most restful color for the human eye. Another fun fact here is that cats don't see colors like we do. Reds and pinks appear greenish to them, whereas purple is just another shade of blue, but they can see shades of green similarly to how we see the color, according to Nickolay Lamm (http://nickolaylamm.com/art-for-clients/what-do-cats-see/):

You may find it odd that we started with the opportunity on the hand-drawn map, but not digitally. The main difference is that we are using the hand-drawn map as a guide for our digital map. Therefore, we know the opportunity and it's always in our focus, even if we haven't added it to the map yet, but now it's time.

Although you can add shapes inside the SmartArt, sometimes it's easier to add another SmartArt or Text Box next to it. To do so, we will start with resizing the SmartArt, so there is space to the left. In parts of the world where left-to-right writing is more common, it makes sense to add the opportunity to the right-hand side of the page. To resize the SmartArt, move the mouse cursor over the SmartArt's left edge. There should be a dot in the middle when the SmartArt is selected. Click on the SmartArt if it's not selected. Now, the cursor should turn into a double arrow, and you can start dragging it to the left to set the size. Most drawing elements in Word (and other software) can be resized the same way:

Changing any element of the SmartArt is simple and intuitive. Just click on the element, and set the option in the Format panel. For example, I changed the text color for the second-level elements on the following screenshot to better match the rest of the map. This step is, of course, optional:

After you finish formatting your SmartArt, we will add the "Opportunity" as a Text Box; you can find that in the Insert tab's Text group. You can choose a Simple Text Box and format it later: 

Now, you can move the Text Box to the right location by dragging and dropping with the mouse. Then, you can resize it by dragging the dots on the edges to make it the right size:

Optionally, you can change its appearance by selecting one of the Theme Styles or by manually setting your Shape Fill and Shape Outline colors:

Now, you can rotate and add the text for our Opportunity box. If you want, you can rotate the text from the Format Shape panel (Text Options | Text direction dropdown):

The last step is adding a title. You can type in a title as your first line of text in the document. Remember, when creating a title for your map, try to find something that the stakeholders can relate to. Something that stops them in their tracks and starts user-centric thinking based on the subject. 

How to make a cat happy? was my choice, because it introduces the "Opportunity" with simple and short words. Format the title to your liking and publish the final map by printing it. Don't forget that you need to discuss this with your cat-sitter. Both the map and a conversation are needed to solve the problem. In the following chapters, we will delve deeper into facilitating the conversation using the map, but this chapter stops at the finished map: