CASE STUDY: Jigsaw Puzzle
YEAR: 2019–2020
Jigsaw Puzzle is a mobile app for puzzle enthusiasts of all ages. Users get a free daily puzzle, and have to wait for 24 hours before engaging with the next free puzzle. This update encourages users to interact with other features, customize their experience, and get them back to solving puzzles.
Principal Product Designer
UX Research: user interviews, competitive analysis, foundation research, usability testing
UX Design: ideation, wireframe flows, low and high fidelity prototypes, play tests
UI Design: visual, interaction, and motion design, design systems, technical documentation, presentation
Figma, ProtoPie, Photoshop, Adobe Illustrator, Adobe Animate, Adobe After Effects, Balsamiq Mockups
Foundational research was first conducted using screener surveys within the app and a representative sample of users was interviewed.
Users may appreciate receiving free daily puzzles, but the content should align with their interests to maintain engagement.
While users may have preferred categories, they may are also open to exploring new puzzles or genres, especially if they are recommended based on their preferences or interests.
A diverse group of participants was selected to ensure that underrepresented user groups were included in the study. Through analysis of participant feedback, three recurring pain points were identified:
Irrelevant Daily Content: Users were often presented with free daily content that did not align with their interests or preferences.
Accessibility Challenges: Individuals with dexterity issues found it difficult to play larger puzzles due to limitations in their physical capabilities.
Confusing Interface Elements: The unlabeled features on the in-game puzzle screen were unclear, leading users to avoid interacting with them.
The team was given a better understanding of user behavior, needs, and motivations after the data was analyzed and shared.
The following design objectives were determined based on the user's pain points:
Personalized Puzzle Recommendations:
Develop a recommendation system that suggests new puzzles tailored to the user's preferences, considering their favorite categories.
Incorporate a feature that introduces users to puzzles that are slightly outside their comfort zone, encouraging them to explore new genres or difficulty levels.
Enhanced Accessibility and Inclusivity:
Implement features that make the game more accessible to players with disabilities, such as adjustable font sizes, color schemes, and customizable controls.
Ensure that all in-game content is inclusive and avoids stereotypes or offensive images.
Consider adding options for players to adjust the pace of gameplay or difficulty levels to suit their individual needs.
PROBLEM STATEMENT
Donna is a recently retired senior citizen who likes playing jigsaw puzzles, who needs an app that can recommend a wider range of puzzles to choose from that are relevant to her interests because she finds it satisfying to solve new puzzles, and the challenge of larger puzzles keeps her mind sharp.
Competitive Audit
To assist in constructing the core and most crucial aspects of the Jigsaw Puzzle app, it was necessary to look at both direct and indirect competition. A competitive audit revealed not only flaws, but also what worked in terms of features and functionality within the puzzle space.
After interpreting quantitative data from analytics services such as Smartlook and Leanplum, as well as conducting interviews with the core target audience and employing intercepts, I was able to synthesize these findings into a spectrum of player personas, create empathy mapping, user journey maps, and identify the frustrations and opportunities that they face while using this live-service.
With this information, and considering the identified holes in the feature's experience, navigation, and visual design, I worked with the team to create a list of "How Might We" questions to assist in generating ideas and guiding the design in the proper direction.
The main aspects of this update were to make the mobile experience more user-friendly, to customize information, and to emphasize the accessibility pass and promote inclusivity.
The end result was a list of improvements, along with supporting UX artifacts and working prototypes, to increase player satisfaction.
By organizing and structuring information in a clear and intuitive manner, IA helped to improve findability, accessibility, and overall efficiency. Through user research and data analysis, the team identified areas where the existing IA was falling short. By implementing targeted changes, we were able to create a more user-friendly and effective live-service.
This improved IA ensured that users could easily find the information or features they needed, while also making the game more accessible to users with disabilities. Clear labeling and intuitive navigation helped users with impairments and contributed to a more efficient user experience. This, in turn, led to increased engagement and retention.
The current hierarchical Information Architecture had to be restructured into a Hub & Spoke model to accommodate the planned new updates. This model was user tested for 'time taken' and demonstrated a significant increase in navigational efficacy.
Once these crucial design steps were completed, ideation on a solution began through user flows, layouts, paper wireframes, and finally digital wireframes. These techniques helped to quickly develop the core structure of the program and align the team early on. This process also refined the layout and reinforced the desired goals of the system.
With the addition of new features, I updated the information architecture to make it more effective in managing these changes while still allowing for future feature upgrades and rapid development.
The goal of the usability testing was to see how easy it was for participants to do certain tasks on the redesign while using remote testing and in-app event monitoring for qualitative and quantitative data. The research was compiled and shared with the team and stakeholders after participants were requested to complete certain actions. The goal was to identify pain points, look for patterns, and analyze trends.
The footer navigation feels more natural, like on my iPhone!
— Participant #3
Participants didn’t like the hierarchical navigation system, especially when they were casually browsing the Puzzle Store screen. When they visited a deep link, they had to tunnel back several times.
Participants liked the new bifurcated section for organizing their puzzle library.
Participants appreciated seeing a countdown timer indicating when the next free puzzle would be available.
The hierarchical navigation system was replaced with a flat navigation system with the introduction of the new toolbar. Participants preferred using the new toolbar to navigate the app.
There were sections in the app where experience-driven navigation systems were used to surface new content (e.g., at the completion screen users now get recommendations for puzzles within their preferred category).
While most participants found it convenient to navigate the sub-screens of My Puzzle with one finger, they responded favorably to the secondary menu bar at the tip and felt it was easier to grok information and navigate the sub-sections, according to Card Sorting tests to determine how users expect to see their information grouped on the app.
The new Free Daily Puzzle dedicated module, which allows users to access additional free content and has a timer that alerts them when the next free puzzle is available to play, was preferred by participants.
This prototype was created in ProtoPie and shows the various features, user flows, and puzzle solve screen updates, screen transitions and motion design language.
The majority of users’ session time is spent solving the puzzle. This update focuses on what they care about the most: improving their experience in the puzzle solve screen. A "lock the screen view" feature for users with arthritis has been introduced, and with this feature enabled, they are able to solve a section of the puzzle more easily. Users can also choose to increase the magnetic attraction between two connecting puzzle pieces. Users can now choose between larger, more difficult puzzles. Analytical data now reveals a significant increase in the number of larger puzzles being started.
With this update, users now have the choice to select between two new themes: light mode and dark mode.
Users who are sensitive to light or who like to play in low-light circumstances may benefit from the dark theme, and may minimize their eye strain.
The app has been translated into five additional languages. Each puzzle includes a caption informing users of the puzzle they solved, and puzzle packs now include informative language.
This accessibility option has helped acquire a larger international audience.
Periodic usability testing and surveys uncover new information that allow the product to be tailored to the needs of the users.
Accessibility should be a top focus while designing for all users. It has made the experience more accessible to everyone and has had numerous curb-cut effects.
Interactive demos are sometimes more valuable than a slew of static designs. It not only gives the team a clear direction for what they are building, but it also gives them a clear understanding of the true nature of interaction.
Get in touch at
California, USA