Work     UI/UX     Visual     Archive     About






Spring 2022
7 weeks

The_Game of Design_ is a digital board game of a designer’s journey


The AIGA Design Census is a comprehensive report of 9432 entries that displays factual and emotional aspects of the design industry. Our team wanted to showcase the intricate levels of data by creating an interactive board game that allows designers to learn more about their place in the community.

I was responsible for developing branding, illustrations, and UI/UX prototypes.
Team
Dorothy Li
Maggie Ma

Skills
Branding
Illustration
Web Design
Data Visualization








Concept - A Digital Board Game 

How might we educate designers about their place in the current industry?


As designers, we go on unique journeys to grow and discover ourselves. Our board game visualizes realities of the design industry by curating personalized gameplay based on the user’s background in design.





The Site


The site uses characters of a board game for players to navigate, with each block sparking an interaction. To create a sense of unpredictability, the overall board is hidden until the user reaches each block.


 


Landing Page

Instruction Page



User Flow

Interacting with Data


The user navigates through 25 blocks of the board by interacting with cards that appear on each block. By inputing their answers on the cards, the user gather stickers as a reward. As the final takeaway, the user would receive a personalized sticker collection to learn more about the statistics related to themselves, to and share with other people.









Card Type 01

About Me Card



Invites user to input answers based on personal experience and background.









Click to view variations






Card Type 02

Reward Card


Presents user with a reward scenario, in which they will learn facts about the industry and earn a happy face sticker.

 




Click to view variations




Card Type 03

Obstacle Card


Presents user with an obstacle scenario, in which they will learn facts about the industry and have a happy face sticker taken away.





Click to view variations




Card Type 04

Quote Card

   Introduces a quote by real designers that has a personal voice about the design industry.





Click to view variations




Card Type 05

Risk Card


Presents user with a situation with different outcomes based on their choice. The backside of card will display corresponding data of the outcome.




Click to view variations





Ending the Journey with Purpose


After navigating though all of the blocks, the final screen shows all the stickers that the user has collected along the way. When hovering over the sticker, users are reminded of the statistics related to their choices throughout the journey.





Completion page














Visual System

Creating a Playful Identity of the Board Game 


The combination of a game-like typeface and vibrant colors helped form a lighthearted mood of playing a board game. The supporting stickers and cards are designed in a simple yet quirky approach to provide an additional personality to the brand.  Finally, we used different methods of data visualization to show variety in the different types of cards.














Initial Research

Working with the AIGA Dataset


Before designing, our team studied the dataset by finding correlations between the different categories. We were especially curious about a designer’s satisfaction with their work, and we compared the satisfaction levels with categories like job title, salary, years of experience, and gender.






The Concept

The Board Game Narrative


Our team decided on creating a digital board game as it illustrates a metaphor of an unpredictable yet charming journey with challenges and surprises. We saw the opportunity of integrating different interactions that leads to unique outcomes of the journey.



Moodboard



When designing the layout of the board, we focused on finding a desirable proportion of the board, cards, and collected stickers. We settled on a layout with the overview of the board for users to keep track of the journey while focusing on the interactions with the cards.



Layout exploration







Reflection

This project allowed me to explore data visualization with a highly visual approach by creating a digital game. It was interesting to explore integrating the customization aspect of the game into learning opportunities. After establishing the visual system and flow of the board, I learned to shift into an asset-based workflow, in which the assets will be delivered to the developer.

If more time is allowed, I would explore more micro-interactions such as sticker animations and moving hints that would keep the experience engaging throughout the journey.


© CHARMAINE QIU 2024