Assembly Required

PROBLEM

Assembly Required is an exhibition of senior work by VCUarts' Graphic Design Class of 2026. The cohort came together to prepare to showcase their final project by creating catalogue, coordinating exhibition locations, sponsors, and promoting the event online.

SOLUTION

The Class of 2026 created different teams to prepare for the exhibition; this includes a team to come together and make a website. The cohort formed a website team of 11. Our team collaborated together to make a desktop and mobile site for the exhibition.

PRE-ESTABLISHED BRAND GUIDE

Provided by Brand Team

Before we formed different teams, my (studio) class created the base for the entire exhibition. This includes, visual design, exhibition layout, theme, etc,.

With that said, our cohort's brand team came together and created a revised and polished version of the draft. Every team, including ours were responsible for following this guide.

rough drafts

The main theme for this project revolves around assemblage and putting things apart. Initially, I approached the idea of making each student have their information in a floor plan. While it was a fine idea, the idea was too specific for a general directory, so I ended taking inspiration from other construction directions.

Scaffolding was already part of the theme, so I revised the concept. Scaffolding and bars to create a grid system for each student's work felt perfect. Some team members had different drafts that were similar.

Finalized Rough Draft

Image provided by Dea Flynn

The scaffolding idea stuck strong; it was a perfect fit for the theme. We came together and combined different parts of our ideas together, resulting in one of our final mockups of our main layout.

We took this in as the main reference.

Front-End Drafts
and Additions

A base for the website as well as a mobile version. Includes addition tweaks provided by the team during the creation of the website. This includes: a loading screen, intro screen, screw categories to divide student projects, adding an info section to describe "ASSEMBLY REQUIRED" as well as give credit, a pulley-styled scroll, a page for individual student projects, and hover states.

These add-ons came in spurts during our studio-time. Lastly, we added a custom cursor. We thought it'd be fun to make the cursor a screw since a chunk of our project consists of construction and screws.

DRAFT PRESENTATION
BETA TESTING

Presented the website draft for cohort to view, as well as distributed the website for bug tests and feedback. In the presentation, we introduce a form for students to add information about their project, which we'll use for the backend.

NO-CODE BACKEND

Created a backend through Google Sheets as a spreadsheet database for all student entries. The information included their projects, descriptions, contacts, and cover images.

UNDER CONSTRUCTION MOCKUP

A scrapped idea the team had. I created a mockup of the page through Photoshop. Added a variant with hover states with the exhibition mascot, Allen the Wrench.

FINAL ADJUSTMENTS

Incorporated the color palette more into the website. Users had issues locating their projects, so we included a search bar, as well as labels in the hover state. Added the ASSEMBLY REQUIRED title, as well as added an animation.

EXHIBITION

Large turnout of 200+ individuals, spanning from families, undergraduates from other programs, and designers and artists in Richmond.