San Francisco, CA
San Francisco, CA
UI, UX, Interaction Designer
Cody Quest
Contact me
Contact me

Warrior Monk

Warrior Monk

Warrior Monk

2023

2023

Role:
Role:

Concept, design, prototyping

Concept, design, prototyping

GQ is launching a digital art (NFT) project. I was tasked with defining a concept for the overall design. My team worked with the client to ensure the idea felt connected to GQ’s current branding, but distinct in its own right.
The project features four artists’ works. The site requires:

  • A full, filterable gallery

  • Artist profiles and biographies

  • A minting process and crypto wallet flow

  • A roadmap outlining the project timeline

Short of these requirements, we were given a background image to steer the direction and told to use CMYK vibes, however this was changed so that the project would feel more in line with GQ’s established branding.
Landing
Dynamic transition
Filter menus
The artist flow
Showcasing the product
We wanted to showcase both the art and artist. From the landing page, you can see the timed carousel with examples of each artist’s work. The user can click the artist to change the carousel, and the art to proceed to that artist’s profile page.

A dynamic transition was used as a reveal for each profile, which contains a short biography and the same notable examples of their work. The user can see a detailed view of each piece with the lightbox, or immediately go to a filtered view of the full gallery.

I opted for a simplified experience on mobile devices. Users can swipe left and right to navigate between artists.

Artist landing - hover state on Chuck
Artist Profile
Detailed view of art
Full gallery
Minting
Showcasing the product
We wanted to showcase both the art and artist. From the landing page, you can see the timed carousel with examples of each artist’s work. The user can click the artist to change the carousel, and the art to proceed to that artist’s profile page.
A dynamic transition was used as a reveal for each profile, which contains a short biography and the same notable examples of their work. The user can see a detailed view of each piece with the lightbox, or immediately go to a filtered view of the full gallery.
I opted for a simplified experience on mobile devices. Users can swipe left and right to navigate between artists.
Wallet modal
Focused work
Roadmap
Showcasing the product
We wanted to showcase both the art and artist. From the landing page, you can see the timed carousel with examples of each artist’s work. The user can click the artist to change the carousel, and the art to proceed to that artist’s profile page.

A dynamic transition was used as a reveal for each profile, which contains a short biography and the same notable examples of their work. The user can see a detailed view of each piece with the lightbox, or immediately go to a filtered view of the full gallery.

I opted for a simplified experience on mobile devices. Users can swipe left and right to navigate between artists.
Components scale in size and gradually blur as the user scrolls
Roadmap
The original version
A full rework was ordered halfway into development
Although the work had been progressing smoothly and the design was being handed off to devs, GQ came to us and asked to rework the site to match their current branding. We utilized their typography and color styles in the new version, skewing wildly away from the direction we had been going in. We retained as much of the original structure as we could, but many elements needed a redesign or tweak.
Inspiration image provided to us
Previous design
The original artists page
Artist Profile
Original roadmap
Focused product