For me, this topic was more about the data than the visual. One of my favorite hobbies is traveling, seeing the world. However, I'm not a backpacker, I'm too much of a control freak to not know where I'll be sleeping, but I'm also too much of an introvert to just try and find a place with the locals. Thus, my vacations are more expensive than my typical peer. I have a feeling that I've been on lot of vacations since I was born. Nevertheless, the idea of mapping out my personal vacations; when, where, with whom, was immediately fixed in my mind. But only the vacations where I did not stay at home and I considered it a true vacation (so no business trips) would count.

Data

I can't remember all of my vacations of course, so the first thing I did was mobilize my mother. She has the fact memory of an elephant. It was quite fun to discuss my vague memories of when I was younger than ±12 with hers and together we managed to get a good starting list for my youth. I then went to my dad to browse through old vacation photos and match these with the list to see if the years and locations were correct. However, this took quite some time, because my parents never made picture books. So when I asked my dad for the photos, he pulled out a big box from some dusty place that was stuffed with photos, but not in order. So it took me about 4-5 hours to sort them on year and month (the printing month and year was on most of the photo's backs). And then another 4 hours to look through them, find the vacation photos, discuss with my dad where they were taken and then placing each year or occasion in their own folders. However getting the exact dates was too much to ask for. We didn't have digital cameras back then. So I'll have to figure something out in the visual for that. But at least this exercise has now resulted in a nicely sorted box of my childhood photos.

After I was 12, my parents separated and my typical vacation turned around 180 degrees. Instead of lying on a beach in either France or the Netherlands, me and my dad went to discover Europe; Paris, London, Rome. And I started to keep journals from these trips (writing in whatever notebook I could find). So besides the journals and the ticket stubs of the many musea I could now say exactly when I had been away and to where. And with the advent of a digital camera in 2004 I could use the dates saved in the image files to trace back when I had been away and where.

Sketch

My idea this month was a very simple one. Each year since I've been born would be one row and the weeks in which I've been on vacation would be colored and annotated. Simple as that, just rectangles on rows. However, I wanted to play around with different kinds of annotations to make it easier for myself to see trends; where did I go, with whom, how did we get there, what was the main purpose. Things like that. In the sketch below is my first attempt at creating the annotations, although I expect I'll be trying out some more things once I start building the visual.

However, having made the same mistake before, I knew that what I was sketching above was a poor reflection of reality. There are 52 weeks in a year and typically I'm on vacation during 5 of those weeks. So only 10% of a row is marked. And that will not create a vey nice effect, having so much white space in between. So I started thinking of ways to give the vacation weeks more space and I was reminded of the way time zones run across the Earth, from North to South pole, not at all in a straight line. Maybe I could also squeeze the months in which I wasn't on vacation in that year. Yes, the months wouldn't align perfectly anymore, but I was more interested in seeing trends between vacations, than getting a perfect overview of the periods in which I was away (which is mostly July-August anyway).

I'm not sure if this idea will work, but I'm going to try :)

Code

Due to a very busy month, with 4 conferences to speak at and another in the 1st week of October I thought I had created a simple idea, focusing most of the time in the first half of September with the manual data collection. Well, that turned out differently...

Yes, the idea was simple, but the execution needed a lot of manual and custom code. First step was getting those vacation rectangles in the right location. Due to the idea of the squeezed months (which had no vacation in them) and centering the year around August (the typical vacation month) it took me at least 30 iterations before I had the math and loops in my code working correctly. Of the 3 examples below, which are screenshots throughout all of these iterations, I do like the middle one where I applied a color blending mode for fun. Most vacations were duplicated in there, creating a nice artful overlap.

Next up were the patterns inside the vacations representing the purpose of my travels. I was trying to go for easy-to-decipher patterns. That hopefully the legend wasn't even needed to guess what the pattern portrayed. For a short time I looked into creating SVG patterns, but in the end I found it easier to play around with creating a small line chart or icon on top of the rectangle. I had a lot of fun creating the safari icon in particular (it might be my favorite part of the entire visual, haha).

The icons on top of the rectangles are actually pretty similar to my first sketch; boyfriend = heart, dad = blue circle, pretty straightforward. For my mom I made an icon of a pink small circle with a swoosh downward. That's because my mom had really, really long hair when I was young (as in, below her butt), so the swoosh is her hair.

While going through my data I took note of the people that were my most frequent travel companions. What surprised me is how often I've gone with my in-laws already, haha, so they got their own icon as well (their last name sort of translates to "angel" so that's why the icon is a yellow halo). Since this entire visual is already crazy personal, I didn't mind the icons relating to something that only I would understand, but now you do too!

Although I was using a gradient for the vacations for which I didn't know that exact starting and end date, I wasn't sure what to use for vacations where I couldn't remember how much I enjoyed it. You can only apply 1 gradient to an SVG element and I didn't want to make it elliptical to get the idea of blur in both the vertical & horizontal direction. That's until I read Shirley's write-up for September and she talks about the motion blur filter, and then I was like, of course, I wrote a whole tutorial on that, how could I forget, haha. So I replaced the gradient with the SVG blur filter in either horizontal, vertical or both directions. I did find that the vacations in my early youth, where both the duration and enjoyment are blurred, are a bit like vague spots, but then Shirley said that this was a nice metaphor to how I remember them, just blurry pieces (or nothing at all). Which is absolutely true.

I also tried practically all the line interpolations on the dividing lines between the months, trying out d3 v4's curve options. The one below, although not useful for the final result, was definitely my favorite.

Due to all of these custom touches, such as the icons, the patterns, the legend, the annotations to help people understand my life through vacations more I finally came to the point where this project has more lines of code than my previous project of Olympic Feathers. Not something you'd expect when you compare the two -___-

I kept the interactions to a minimum. Only helping out the viewer with the most difficult thing: knowing which month was which, due to all the squeezing going on. So there's only a small hover going on that highlights the same month throughout the years.

I wanted it to look a bit like a "scroller" I guess. However, here nothing fancy is happening as you scroll down, you're just seeing more of the visual with new annotations. Somehow it also reminds me a bit of a children's book; simple & bright colors, easy icons, a bit of text every now and then.

I have to admit, with the amount of code and hours that it still required, maybe I should've gone for a more complicated sketch/idea that would've looked more visually appealing (but would still take the same amount of time). This one now just looks so.... simple. But as Shirley wrote last month, not every month will be a good month. I just really wanted to try out this idea where the the time scale isn't set in stone, but where you more generally get a feeling of time; "that vacation was at the start of the year", or "that safari was in the summer", so that the vacations themselves get more room to exist I guess.

Below you can see the end result of my Travel project!

What I do like is that I've never made a visual with (such) personal data before. So maybe it's not that interesting visually for other people to go through, but for me personally it has a special place in my heart ^_^

‍