Flux

role: Lead UX Designer

timeline: Jan – May 2026 (5 months)

team: 8-person design, branding & dev

tools: Figma · Gemini · WordPress

I led end-to-end design for Flux, the public thesis exhibition site for Parsons' MFA Design & Technology program. I delivered a fully responsive design system on WordPress, using Gemini-generated HTML, CSS, and JavaScript as a starting point for custom interactions. I also restructured the program's information architecture for the first time and created developer-ready prototypes that scaled across 170+ pages. The site launched on schedule for a two-day showcase with 200+ attendees.

The publicly launched Design & Technology thesis exhibition site.
Visit live site
Problem & Constraints

One exhibition had to represent a multidisciplinary cohort across 170+ responsive pages without sacrificing usability.

Flux needed to give student, project, and exhibition content one coherent public experience while preserving the experimental identity of Parsons' Design and Technology program. Previous thesis sites also blurred the distinction between browsing designers and browsing their work, sending both journeys to essentially the same destination.

The site had to feel expressive enough to represent a cohort spanning creative technology, UX research, game design, and bio-design, without presenting the program as communication-design-only.

At the same time, I was translating an evolving identity into a working product while coordinating an eight-person branding, design, and development team. The system had to preserve strict visual rules, support CMS-generated content across desktop and mobile, and give our developer enough runway to meet a fixed launch date.

Final Solution

Approved Figma layouts became responsive WordPress interactions with Gemini-assisted code.

After finalizing the visual layouts in Figma, we gave Gemini screenshots of the approved designs and described the interactions we wanted to create. We used its HTML, CSS, and JavaScript output as a starting point, then refined the interactions in WordPress to match the visual system and work across screen sizes. Flux launched on schedule across 170+ responsive pages for a two-day showcase attended by 200+ people. The launch demonstrates delivery at scale; this case study does not attribute attendance to the site or claim a measured usability improvement.

People page

The People journey now opens a designer-focused page with a bio, thesis summary, and links to additional work.

A grid of that year's graduating students; open a student to read their bio, a summary of their thesis, and more of their projects.

Project page

The Projects journey foregrounds the work, including its abstract, categories, faculty, and designer attribution.

A grid of projects; each shows the project's abstract, categories, thesis faculty, and the student's own description.

Information Architecture

Previous sites treated designers and their projects as the same journey.

Reviewing previous thesis sites revealed two overlapping journeys. The "Events" tab repeated information already available on the home page, while the "People" tab sent visitors to a person's project just as the "Projects" tab did.

I reframed the structure around visitor intent: People should help someone understand the designer themselves, while Projects should foreground the work. I proposed distinct page types, moved the event schedule into About, and kept designers and projects connected through contextual links rather than forcing both journeys through the same destination.

Information architecture, before and after the restructure
The revised structure removes the redundant Events destination and separates People from Projects by visitor intent.
Visual System

Turning an expressive identity into a repeatable interface system.

I collaborated on the brand handoff and translated it into a responsive web system. The identity's strict rules (lemon and lilac never in focus together, Helvetica Neue caps paired with Instrumental Serif italics, and outlined, filled, and photo-cutout circles) became reusable layout and interaction rules rather than one-off compositions.

Lilac
#B8B0FF
Lemon
#EBFF6A
Sand
#E3CEAF
Milk
#FFFDEA
Taupe
#524D44
Charcoal
#2F2D29
Flux visual system showing the logo, grid, typography rules, and circle elements
One system connects the logo, square-cell grid, typography, and circle interactions across every page type.
Iteration

Testing how far the identity could stretch without losing clarity.

Each direction had to preserve the cohort's experimental character while remaining legible, responsive, repeatable through the CMS, and feasible within the launch schedule. We needed to be "funky" enough to honor the program without letting the identity overpower its students' work.

Wireframe

Flux wireframe, with dots acting as holes that reveal a bottom layer
The wireframe established the layered-circle mechanic and repeatable content zones before visual styling.

The team explored ways to translate the dotted pattern to the web. This wireframe established the central interaction, with circles acting as openings in a top layer, and gave the developer an early view of how the system would organize content.

Rapid hi-fi prototyping

Rapid high-fidelity prototype explorations with lemon circles and blurred photography
Alternative directions tested color balance, circle density, imagery, and how strongly the identity competed with content.

We moved quickly through high-fidelity directions because visual consensus and development could not happen sequentially. The explorations compared color balance, circle density, imagery, and content hierarchy while our developer still had enough runway before launch.

Option 3 & "Coming Soon"

Coming Soon page across desktop, tablet, and mobile breakpoints
One responsive view shows how the selected direction adapted across desktop, tablet, and mobile.

The cohort responded most positively to option three, but the amount of lemon competed with the content. We converted selected filled circles to outlines, preserving the identity while creating more breathing room and hierarchy. The revised direction shipped as a responsive "Coming Soon" page two weeks before the full launch.

Reflection

Expression works best when the system underneath it is clear.

Flux taught me that translating a bold identity into a digital product is an exercise in restraint. The strongest direction was not the one with the most visual expression; it was the one that gave the identity clear rules and left room for the students' work.

Separating People from Projects reinforced the same lesson at the structural level: a visually polished site still fails if it does not respect why someone arrived.

Leading an eight-person team under a fixed exhibition deadline also meant building alignment quickly enough for development to move. Rapid prototypes made feedback concrete, while the responsive Coming Soon page let us validate the direction in public before the full launch.

Flux was created with my co-leads, Rin Kim and Pranav Chaparala, and our design, branding, and development team.