View it live
Entrepreneurial technologists, Business partners, Thought leaders, Workshop attendees
Inform and engage external audiences about moonshot thinking with a digital card game format. Inspire them to think 10X and take some more moonshots of their own.
Based on existing card game flow and key considerations, explore and push gameplay experiences and design a responsive and visually engaging digital game that excites users.
Following the pandemic where everything transitioned online onto zoom calls, the team at X approached us to digitize their moonshot thinking game to better inform and engage external audiences about moonshots. It was originally a physical card game of problem and technology cards to brainstorm radical solutions.
There was a desire to keep the legacy of the card game while exploring the endless possibilities of the web and unraveling moments of delight. Collaborating closely with clients, we had to solve for their business needs and consider the ultimate objective of inspiring target audiences to think 10X and take moonshots of their own.
Although there were defining moments of gameplay, we were able to push the ways to refresh and reproduce the physical card game through various game interactions and visual art directions.
The result was a responsive web version of the card game that could be played alone, in a group, or accompanying a workshop. We found the perfect balance of presenting moonshot thinking as well as incorporating fun video game references.
Moonshots sit at the intersection of a huge problem, a breakthrough technology, and a radical solution. This game presents you with a problem card and an option to pick between 3 technology cards. You’re able to select your categories and set a time limit.
From the card combinations, you brainstorm radical solutions alone or with a group of people within the time limit. These creative and outlandish ideas are then recorded, discussed, and shared. The game has 10,000 different possible combinations with problem cards mapping to sustainable development goals and the most current ground-breaking technologies.
We presented a lot of interactive directions ranging from options that replicate a physical card game to referencing video games, a more hands-off experience, or more of a guided storyline. The final game was a combination of hand-holding with moonshot introduction but also allowing users to skip it, replicating video game experiences.
With X’s brand and gaming culture in mind, we explored art directions ranging from retro game interface to a modern twist. The juxtaposition of physical card games and 8-bit created a new unique visual branding for Moonshots!. While marrying the two separate realms, we optimize for the usability and understandability of this web game.
X’s brand and colors lent themselves very nicely to recreate the neon of nostalgic video games on an immersive black background. Leveraging the 8-bit appearance to create unique illustrations and iconography for the game while referencing old-school printed type branding in the logo.
We leveraged animation and other web capabilities to create a game that both replicates a card game yet provides a moment of delight.
One of the first ideas we proposed was creating a custom cursor to represent a video game character, whether it is a moon or a spacecraft. It is a fun moment to reflect computer cursor to a first-person video game.
An opportunity for the web experience is the ability for us to reveal more information about the problem or technology on hover. This is especially helpful and mitigates the need for players to search about the problem or technology that is given.
We developed a drag and drop interaction where cards could be moved or thrown around in space. Not only is it a fun interaction but also provides a way to emphasize and highlight cards as you play in a group but also a mindless way to fiddle while you think of ground-breaking and farfetched ideas.
With playing this game while video calling, a big priority is for the game to be fully responsive and maintain the capabilities on tablet and mobile.
On mobile, we take it to a whole new level of feeling like you’re holding cards in your hands: you are able to swipe between the cards to select the technology card and toss cards around during gameplay.
To differentiate between setup and rules, to the gameplay, we removed the 8-bit border for a clean interface so that players could be fully immersed and focused on generating ideas.
The physical card game introduces scale cards to inspire players to think of the problem from another perspective. As we introduce scale, funding, and social cards, we converted them to power-up fuel cells where it almost acts as a lifeline to help people see the problem in a new way or evolve initial ideas.