The Mystery #4 Is Resolved: Chirpy Birds, Lost Numbers and Pretty Slow Wheels
Email Newsletter
Weekly tips on front-end & UX.
Trusted by 200,000+ folks.
Check the frontend report!
Take a break with a 3D game built on Netlify!
Start with a free demo —
Sponsor OWD on GitHubExperiments and side projects are wonderful ways to challenge yourself and explore areas that you wouldn’t usually consider exploring. That’s what Smashing Mystery Riddles are for us: little experiments that challenge us to come up with something new, original and a bit crazy—every single time. The ideas are usually a synthesis of the things we discover, stumble upon or try out ourselves—and oh my, they take quite some time to get right.
The most recent riddle took quite a lot of time spent fiddling and getting right (and Guillaume, the designer, wasn’t that happy about all the changes that our tests required). The basic idea was simple: as usual, you have a series of animated GIFs containing clues. One animated GIF leads to another, and every animated GIF contains a key (or keys) that have to be discovered. Once you uncover all the keys, you construct a solution and send out a tweet containing that solution. Doesn’t sound too difficult, does it?
Well, it shouldn’t be too easy, either. Obviously we didn’t want everybody to see all the GIFs right away, so finding keys was essential for moving from one level to the next. In the past, we prompted users to change filenames, search for Twitter handles, and construct words out of letters. This time it was all about finding the right hashtags on Twitter. Once you search for just the right hashtag, you should discover a link to the next level; that is, a link to the next animated GIF.
But how did we make it work? Obviously we had a number of keys scattered across the animated GIFs, but we couldn’t just send out tweets with hints for the next level from the same Twitter account—it would be too easy to discover, right? So we needed to distribute the tweets and hashtags—the keys—among many accounts. We could have gone ahead and created a number of anonymous Twitter accounts (in fact, that’s what we did for the second riddle—and it was damn difficult to find available ones!) but we needed specific Twitter handles for the riddle, and unfortunately most of them weren’t available (for example, 3flowers or 6numbers).
So what could we do? Well, here was an idea: if you have 25 keys to share, what about asking 25 friends and colleagues to each send out a tweet with the hashtag and a link to the next level? It’s quite unlikely that anybody would follow all of your friends at once and therby discover all the keys in their timeline right away. So, that’s exactly what we did. But of course we didn’t want the tweets to be sent out too late or too early, since we wanted to build up the momentum of the riddle. And you can probably see where it’s heading: we depended on 25 people sending a tweet at approximately the same time. And this is where things weren’t quite smooth. The riddle went live at 7pm CET and while most tweets were sent out in time, some weren’t. As a result, we had to pull out all the stops, send a few quick follow-ups and, in the end, relax the rules of the riddle since not all keys could be discovered right away.
To be honest, we kind of anticipated that this could happen. That’s why each level had a few more keys hidden than necessary, just to make sure that nobody got stuck on a level, not able to progress further despite doing everything right. Also, we had to be careful when choosing links leading to different levels, so we distributed a few different link shorteners as well—if you looked specifically for smashed.by links, you wouldn’t be able to find all the critical keys.
But let’s take one step back first and go through the riddle step by step from the very beginning.
Level 1: It Might Get Windy In Whistler
As mentioned above, the partials of the final Twitter hashtag were distributed among the tweets from our friends and colleagues. But these tweets first had to be found using the hashtags retrieved from the animated GIFs. In fact, you had to pay attention to the file name, count objects in the animated GIF (for example, three chairs) and search for them on Twitter (#3chairs). Plus, a tip suggested to watch out for a hint in one of the frames in each GIF. You know what that meant: running diffs or checking the frames in Preview or Photoshop!
So how do we start? Well, the first GIF doesn’t look too hard, does it? What have we got here? #1bicycle, #1sign, #1character, #1road, #2wheels, #2trees, #2poles… but it all doesn’t really bring us anywhere. There are two electricity lines and one road line! What about #3lines? No, still nothing!
Ah, wait a second! What about the file name? “It might get windy in Whistler”. Could that be a reference to the #1scarf? Not really. Or perhaps it refers to the area around the scarf? Indeed, the only things we haven’t checked are… those cheeky birds! There’s one bird on the cyclist’s shoulder; two chirping on the cables; two sleeping on the trees; three fluttering in and out; and—ah!—two more birds peeking out of the trees as the bicycle goes by. That makes for #10birds.
But wait a second, we were supposed to look out for hints in one of the frames. Hmm. Could it be that one frame in particular is special? If so, which one would it be? Maybe the number that we’re looking for? Bingo! Can you spot the “10” on the left pillar? That must be our clue! Ten birds? #10birds it is!
Once you search for #10birds on Twitter, you’ll discover a tweet from our editor Michel Bozgounov, sent out exactly at the time when the riddle was published:
Initially we wanted to hide another bird behind the red road sign, or brand the bicycle as “BIRDIE”, but these “birds” would have been way too small and difficult to find. Maybe next time?
Alright, #10birds is the first hidden key. Now let’s move to the next level and find the two hashtags hidden in the next GIF!
Level 2: Choosing The Name For The Cat
We have to find two hidden hashtags now, so let’s see what we can find. If we read the file name, we know that the guy at the window is trying to come up with a name for the cat—the same cat driving the caged bird crazy.
But, if you keep looking at it, isn’t something going on in the cage? Let’s focus on the cage and check it frame by frame. Following the same logic we applied on the previous level, let’s look through the first ten frames—there aren’t that many objects here, after all. Aha! The fourth frame of the GIF reveals a little “4” sitting in the cage—sneaky!
Apparently, then, we have to watch out for objects that appear in fours. #1chair, #1table, #1flower, #1cage, #1bird, #1cat, #3apples—we can safely exclude all of them! There are a few devices on the table—and what’s hidden under the TV screen? A remote control? That would make… #5devices! Not quite what we are looking for, but apparently that’s a key, too!
Great! That’s one of the keys. And talking about the TV screen: is it just a distracting wallpaper, or could it be a hint for what we’re looking for? That logo on the TV looks familiar. Isn’t it the Dharma Initiative logo from Lost? Well, if you remember that, you probably remember the Lost numbers—4 8 15 16 23 42—that Desmond had to type into a machine to keep the island safe (or, to put it slightly differently, to save the world). Could it be that we’re looking for #6numbers? Bingo! Now you can start to feel pretty awesome ;-) That one was hidden fairly well!
Alright, but what about that “4” that we’ve discovered? All those devices on the table look like they have stickers on them, or not actually stickers but browser logos. And there are four of them—Mozilla Firefox, Chrome, iOS Safari and Chrome Mobile—so doesn’t that make… #4browsers?
Nailed it! But we still haven’t figured out the name of the cat, have we? It really isn’t easy. In fact, our conference organizer Cat received a few emails from people asking her about the cat’s name (that was a bit surprising, and quite clever) but—being the consummate professional she is—she told the truth and informed everyone that she didn’t know. But that was a neat little strategy to try.
Some readers were creative and came up with interesting names—one of them was the idea we abandoned because our testers didn’t come up with it in our tests: since one of the keys on the next level was #7apples, naming the cat Lion as a reference to OS X 10.7 would make perfect sense (heads up, ARothuis!). Good one, and definitely worth a little reward.
In fact, the cat’s name was supposed to be Browser and if you counted the number of browsers in the GIF correctly, the hidden key would be #5browsers. But yes, yes, of course, we knew that it was pretty difficult to guess the name, so we decided not to be too strict about it and accepted #4browsers as well.
Alright! The hidden keys on the second level were #5devices, #4browsers, #6numbers and potentially #5browsers. It was critical to find the first two keys since we knew that not everybody knows or has watched LOST (in fact, some members of our team weren’t very fond of the idea in the first place!).
Level 3: Never Miss The Big Picture
Again, two hashtags have to be discovered, and it doesn’t look like the number of objects is getting smaller from one riddle to the next.
That mysterious character seems to be absorbed with browsing and at the same time enjoying the multiscreen experience watching TV.
The file name says “never miss the big picture”. Could it be a reference to the big TV screen? The football world championship is on, and there are a few fans waving Brazilian flags. Is that a clue or a yet another sneaky distraction? Well, we can find 22 fans on the screen, and since the TV is on, it’s safe to assume that the mysterious guy biting an apple is a fan, too. Are we looking for #23fans?
Looks like it’s a dead-end. In fact, it doesn’t look like the twenty-third frame has any hidden hints. What about the other frames? Wait! Did you see that? Isn’t there something happening in the shadow under the desk? Let’s take a closer look!
Voilà! But what does it mean? “Never miss the big picture”? Let’s take a look at the picture on the right-hand side. It has two hills and six trees. But there’s another tree on the left-hand wall as well! Are we looking at #7trees?
Yaaaay! Alright, so what about the second hidden hashtag? Now those apples look very suspicious, don’t they? We have three apples on the plate next to the TV screen; one apple is falling down from the tree on the left wall; one apple on the table; one apple in the hand. It makes for #6apples. Doesn’t look right. Ah, isn’t it a Mac? Duh. Alright, #7apples then? Makes sense! It’s like seven-o-rama!
But that can’t be it, right? Indeed! What else are we missing? Well, what else have we got? Two books next to the TV screen, ah, what are those paper items on the books? They look like tickets, don’t they? Yes, #2tickets was one of the clues!
Thinking about the file name again, it looks like we kind of missed the big picture… How ironic! Of course, we also have a window, and doesn’t the mysterious character browse between… windows? How many windows do we have? Six! Well, that would make it #7windows, right? Indeed!
So here we go, #7trees, #7apples, #2tickets or #7windows. It was critical to discover that final hashtag (which was the hardest) on this level, plus one of the other ones. OK, there is just one level ahead of us — so let’s get to it!
Level 4: Thank God It’s Friday!
Even more objects and two more hashtags! Well, thank God it’s the final level, and apparently it’s Friday, too! So let’s look closely at what we’ve got here. The mysterious character is reading a newspaper with animated ads; we have a sunny weather forecast on TV; the cat (Browser) is playing with a ball; but we also have a calendar on the wall and a car on the shelf. So what could they mean?
Let’s check things one by one. The main animation appears to happen when the guy is reading the newspaper. We have “20% sale” on an ad in the newspaper, but it doesn’t look like #20sale is a clue. Bummer. What about #11lines of text in the newspaper? Still nothing. But when the car drives by and the guy pulls down the newspaper a little, we can see two flowers displayed in the picture with a tree! With a flower right next to the window it would make #3flowers, right?
Right! OK, that wasn’t too difficult. But what about the second hidden hashtag? Now, the cat looks suspicious—but we already tried #1cat on the previous levels, and it wasn’t helpful. There’s a Canadian maple leaf residing on a map, so are we looking for #2maps? Nope. Those sneaky distractions!
We also have berries right next to the map, and they look like… strawberries! In fact, we have exactly twenty strawberries in the cup, so perhaps we are looking for #20strawberries?
Okay, but it was worth the try! Now, let’s check the frames to see if we were looking for all the right things. Well, it doesn’t look like there is anything special hidden in the third frame, but the hint clearly stated to watch out for the file name and for the differences in the frames!
What’s left? Well, the only two missing parts are the calendar and the car in the right corner. But wait! Did you see that? A flash in the calendar?
Aha! So the clue is “8”. But what exactly does it mean? Are there really any objects in the picture that occur eight times? Or should we be looking for #8december2014 instead? The file name says “Thank God it’s Friday”, so perhaps we are looking for #5december2014. Oh! It all must be a part of the confusing plan! But hang on, let’s get back on track here.
The only other remaining thing is the car. In fact, there are three cars in the image, with five windows, four headlights and… eight wheels! So, is it all about #8wheels?
Alright! Now we’ve got to the bottom of this! The hidden hashtags on the final level are #3flowers, #5december2014 and #8wheels. The last one was the critical one and had to be discovered to pass the level.
Yes! Phew, now you solved the mystery, and as it turns out you really are awesome! The secret hashtag now can be constructed out of all the clues you’ve found and should be tweeted to @smashingmag. Now that was quite a journey, wasn’t it?
Secret Level: Cannot Stop Watching The Game
Not quite, warrior! You might have noticed four days marked on the calendar, and of course they aren’t marked by chance. These are the days when SmashingConf Whistler is going to take place! And if you count the number of days, you’ll end up with… #4days!
It wasn’t necessary to discover this level, and it was quite difficult to find and crack, but if you did discover it, and found the right idea, you would have earned a reward as well.
For this level, it was perfectly fine to find something that would make sense: such as #1crazyperson running on the field or #0goals. In fact, Alejandro de Arriba figured it out, and unfortunately the other hashtags were incorrect.
Alright! Now we are done. We kindly thank everybody who sacrificed the integrity of their Twitter accounts for sending out totally unrelated, weird, confusing and potentially annoying tweets from their thoroughly curated Twitter accounts. It’s much appreciated!
Mystery Solved! And The Winners Are…
As mentioned above, you didn’t have to discover all the secret hashtags, but we were looking specifically at the critical hashtags, so the winner of the riddle would need to get them right. If we bring all hashtags together, we’ll get something like this:
#10birds4browsers6numbers7windows7trees3flowers8wheelsor…
#10birds #4browsers #6numbers #7windows #7trees #3flowers #8wheelsBoth formats would work. Some of you were quicker than others. While the previous riddles took approximately an hour to solve, this one was quite easy to crack. Since not all tweets were sent out in time, we had to relax the rules a little. The first correct hashtag was tweeted by @jaicab_ 20 minutes after we hit that shiny “Publish” button, with more and more tweets containing the right answer shortly after that. In fact, it turned out that our dear readers are absolutely smashing indeed: #10birds, #6numbers and #7windows.
The first place was earned by the person who was the quickest to solve the riddle. We allocated prizes to the other lucky winners randomly. The winners can select any prize of their choice (be it a bag, a Smashing Library account, printed books or anything else). And they all get the Smashing Cody Stress-Relief Ball, too. All winners will be contacted shortly. The winners are:
- Jaimie Caballero has won a roundtrip to Whistler and the full Smashing package (took 20 mins to find the solution),
- Rakesh Katti
- Daniel Marklund
- ARothuis
- Andrés Muro
- Paul Rose
- Gabriel Forn
- Lucian Mocanu
- Anthony McLin
- undefined !function
- Alejandro de Arriba
Congratulations! And thanks to everyone who participated! We hope we didn’t waste too much of your productive work time (and didn’t cause too many headaches either).
Behind The Scenes
Just like in all the previous riddles, we worked with talented Guillaume Kurdjian on a series of animated GIFs for the riddle. This time the discussion thread wasn’t very long, but we had quite a number of conversations of how to find digits properly, and how many objects would have to be hidden in the GIFs. This time we ended up with 25 different GIFs, drafts, and ideas that were thrown away, as well as the ones that made it to the final stage.
As usual, all designs were a series of iterations to make the overall riddle not necessarily perfect, but just right. So a big “thank you!” to Guillaume for following through and being so enthusiastic and kind about all the changes made.
So this is it! It was quite a journey, but we hope it was worth it. We are really sorry about all the unproductive hours that you spent solving the riddle. Well, kind of. Now, are you ready for the next round? ;-) Stay tuned!
Further Reading
- The Smashing Mystery Riddle Is Resolved: When Purple Rain Meets Felix The Cat
- The Mystery #5 Is Resolved: Northern Lights, Windmills And The Game Of The Century
- The Mystery #3 Is Resolved: A Story Of Muffin Crumbs, Shady Characters And Invisible Letters
- The Smashing Mystery Riddle #8, An Emoji Edition
(vf, mrn)
