Phase 0: The Concept
There’s nothing worse than a stagnating mind. More and more we try to chase away our boredom by mindlessly scrolling through waves and waves of social media posts. That addictive behavior of scrolling down more and more is what inspired the layout for the Riddled interface.
Get a feed of new riddles delivered straight to the home screen. See riddles that you’ve already done vs. riddles that you have not tried yet. Users gain a sense of accomplishment as their riddle feed fills up with ribbons for every completed riddle.
Best of all, the mind is occupied with interesting and through provoking mind puzzles.
Remember a key word or certain riddle that you want to show to your friends? Use the convenient search function!
Limiting Riddle Attempts was a way to place pressure on the user not to simply joke around in this app but to give honest attempts to the riddles. Inputting an incorrect answer would result in a deduction of “lives” from the riddle attempts.
The Riddle Point System is a method for collecting points based on riddle performance. Certain harder riddles are worth more points, but might be timed. These points can be used to purchase more “lives” as well as provide a standard of progression as users engage in the app.
Social Media Bonus allowed us to incentivize users to share their favorite riddles on social media in exchange for more riddle points. The point amount would have a slight bouncing animation to get the users attention.
Related Riddles provided a seamless method for users to continue through the flow of endless riddle solving without needing to return to the main feed.
Phase 1: Standard Riddle Flow
The End Action after a riddle is completed needed to be crucial to maintain the proper app flow.
Of course, all the proper app tabs are open to the user at all times. We’re not in the business of limiting normal user behavior unless it is crucial to a specific process such as ad delivery or functions where leaving the page could cause an error.
Having more riddles appear AFTER the user answers a riddle (whether the answer is correct or not) was a simple, but very important implementation to this project. It ensured that the riddling would continue uninterrupted.
There were times where it was not desirable for an End Action to funnel users instantly into the next riddle or chain in the sequence of events. In the case of timed riddles it was absolutely necessary for the End Action to be a break rather than a transition.
In an ideal world people would be playing this game uninterrupted. However there is a number of things competing for the users attention. Sometimes people get notifications or text messages, other times something in real life is demanding their attention, whatever the case, timed riddles would prove frustrating of the transition to the next timed riddle was out of the user’s control.
The End Action in this case was to have a break between timed riddles. Now, you might be thinking, “Hey those colors are pretty bright!” and of course, the idea is to have a break, but also to encourage users to continue through the chain of events. If the Break displayed a very bright (and to some people: ugly) pop up, then it would encourage users to tap next just to get that sight off their screen.
Of course, there is a very specific psychology in utilizing bright blue with a smiling logo.
Phase 2: Daily Riddle Challenge
The Daily Riddle Notification
Usually the Daily Riddles will be presented as (1) Easy Riddle (1) Medium Riddle (1) Difficult Riddle. On some special days (3) Hard Riddles might appear for extra challenge, or (3) Easy Riddles for an easy day.
The flow goes from the Daily Challenge page to the riddle of the user’s choice. The pop up as displayed from the previous End Action section gives the users only two options: 1. Move on to the Next Riddle or 2. Return to the Daily Riddle page
Early polling revealed that users did not seem to have a drive to continue solving riddles after the first session. The quest to solving mind puzzles can seem like a lonely journey within one’s head. All throughout the entire user interface, there are hints of other human life. These hints of other human interaction helps the user to feel involved and thus, continue using the app.
The most notable can be found on the Daily Riddles page. At a certain time during the day, the results of the riddles will be revealed. This show the user how their performance stacked up to the rest of the world as well as show the user how difficult the riddle was in general.
From the “Results are In” notification page to the cute images and balloons that make up this notification and the globe in the distance, the idea was to create an experience that feels anything but lonely!
Visualizing the results utilizes both a color coded percentage as well as an arrow pointing to which side of the spectrum your answer belongs on. We utilize both a color coded visual as well as a physical pointer to make it more noticeable for users as well as to help prevent colorblind users from missing out on the action!
In fact, every riddle in the feed has a red/blue bar running below it. Rather than utilize words or boring percentage numbers (which clutter the UI) to display the difficulty of a riddle, a slim bar is used instead.
Riddles with heavy red beneath the bar indicate that the riddle is difficult for most users, while a riddle with a heavy blue bar indicates that the riddle was easy for users.
It is not necessary to the experience that users know the exact percent value, that was only relevant during the daily riddle challenge because the user was most likely engaged in that content themselves.
The difficulty bar represents the percentage without actually giving a numerical value to the user as this information is not necessary and would only serve to distract the user from the necessary on screen notifications.
Transmitting information almost instantly is a great benefit that this UI really utilizes throughout the design. Even the timed riddles do not show an exact time but rather a bar that races to the finish. Users get a feeling of “rush” while trying to finish the riddle before the time runs out.
Phase 3: Visualizing Metrics
The above quantified metrics are poorly displayed. These arbitrary numerical figures paired with seemingly arbitrary labels serves no use or motivation to the user. Of course, this is just a direct display of the database to user action, and it is totally aimless.
However, when these metrics are visualized in a more intelligent manner, new information can be transmitted to the user without even saying a word!
With the addition of a black border around the visualized graph, it becomes instantly recognizable to the user that there is a peak to the metric information as well as where they currently stand relative to that peak.
Now while the labels themselves might not seem straight forward, the visualization still induces the necessary feelings of accomplishment or need for improvement that the user might find interesting.
(Information on each metric can be obtained by clicking on each label.)
All of these feelings and information is transmitted to the user without adding any new words to the page, and in fact, by removing the numerical values, the message is even clearer!
The entire Metrics page is rendered, we can see information such as total points, lives, and the proprietary RQ score which is Riddled’s version of an IQ score.
Quiz Me allows users to take specialized quizzes (Which follow the same flow as the daily riddle timed contests) and allow users to build their metric scores.
Useful information is also displayed at the bottom of the page along with a general settings tab for items such as push notifications to the user’s account and email settings.
All of this is converged into this single page which is larger than the screen, however there is no problem with having a long page as this information is both interesting and useful to the user. Seeing all of it at once is not necessary, though it would display all at once on the desktop version of Riddled.
We hope you enjoyed this walk through of the Riddled app that we designed. There is some crucial and informative design insights that were utilized to create an inviting and fun app experience for people of all ages and hopefully knowing the breakdown of the science behind the fun does not ruin the fun of the app itself!
Challenge your mind with a daily riddle!
NEVER STOP LEARNING! KEEP THE MIND FRESH WITH NEW IDEAS.
CHECK OUT THE REST OF OUR BEST DESIGNS!