marvel puzzle quest

I joined the MPQ team at Demiurge Studios in April 2018 and soon became the solo UI/UX artist on the project.
Over the following 3 years, I balanced various responsibilities, including:

Supporting frequent content updates with in-game UI and marketing art
Researching, designing, and documenting user flows for new features, as well as long term quality-of-life improvements for existing features
Creating visual mockups for those features, implementing the art in Flash
Bug fixing, including localization
Conducting and documenting market research regarding in-app purchases, providing recommendations and best practices to product owners
The team eventually grew to include some UI and art support, whose contributions I supervised alongside our art director (who was a shared resource with other projects within the company).

Main Menu redesign

These are screenshots of how the main menu appears in-game today.

In 2021, 8 years after the game's initial release, the MPQ team set out to modernize the game with the support of our publisher at D3. These were our goals.

Showcase our frequent content updates and make MPQ feel like a "living" game
Make features more accessible with fewer taps
Bring the visual design up to date; the game was created before the MCU became what it is today, and leaned heavily on the comic book aesthetic. We wanted to reflect the maturity and modernization of the franchise in our game.

RESEARCH & WIREFRAMES

These are the wireframes, with original annotations, that I created in Adobe XD to communicate and discuss proposals with the team.

The process began with player research. I had several valuable sources of information at my disposal; experienced players on the development team, several years worth of player feedback across various platforms, and of course, our data analytics. Drawing information from those sources, and balancing it with the team’s development goals, I began to prioritize what information should surface on the main menu.

The core game loop needed to be as fluid as possible, so I proposed that most of those features should be accessible on the navigation bar which persisted across most screens. Anything else should appear top and center of the main menu tiles, followed by monetization features, and lastly with legacy content appearing below the scroll threshold.

An important consideration was how a new player would experience these changes, as content gradually unlocks throughout our first-time user experience (FTUE). These are a few proposals I made, highlight some pros and cons of each approach.

We also still needed to support our many PC players. Thankfully, tiled rectangle the design lent itself well to various aspect ratios.

visual target research & mockups

MPQ had fast-paced development cycles, and labor-intensive Flash implementation requirements. This meant we often didn't have a ton of time for iteration on visual styles. Still, I was able to collect some visual targets (left) and use them to inform the visual mockups for the new main menu (center and right).

Tile Repaint

Part of the visual overhaul of MPQ involved the tile art. My goals were to make both the color and shape of the gem more instantly readable, and to modernize the look. To achieve this I steered away from the black-and-white shading of the original, and incorporated color harmonies into the shading of the gems to give them more distinction from one another while also giving them more depth. The more subtle highlights helped the character icon overlays to stand out, and the darkening of the tile board added some much needed contrast for the tiles to stand out against.

event art

message of the day

One of my favorite routine tasks was creating a promotional message of the day (MOTD) for new character and costume releases. I was given character concept art, and supplemented that with both handmade textures and photos from creative commons sources. The typography and subtle breaking of the frame were particularly fun for me.

character icons

Each new character required an icon, which appeared next to their tile values in-game. This was sometimes handled by our other 2D artists, but it's something I always enjoyed doing when time allowed.

Costumes

Costumes are a fun cosmetic feature that was introduced during my time on the project. I mapped out the user flow, created and implemented the new UI art required, and came up with the art treatment for costume covers. This was before the big visual overhaul seen in the main menu, so the stylistic choices leaned more toward the game's comic book influences (like using halftones).

pre-match screen redesign

At one point, it was the hope of the team that we would have a chance to implement access to the Supports feature, as well as a saved team feature, from the pre-match flow. The Supports aspect of the feature made it into development, but sadly the remaining functionality had to wait until much later. These are some prototypes I created in Adobe XD highlighting my proposed changes.

want to see more?