Overview

To enhance accessibility and navigation for past thesis projects in SVA’s MFA Products of Design program, I developed a custom-coded Squarespace directory that allows users to browse projects sorted by year. The website already exists, and my task was to design and integrate this new thesis directory as an additional page within the existing site. This directory provides a structured way to explore past work, making research and inspiration more seamless.

My Role

• UX/UI Design – Designed the cards, layout and interaction model for easy browsing.

• Development (WIP)– Implemented custom code in Squarespace to create dynamic, filterable thesis cards.

• Information Architecture – Structured the directory to optimize usability for students, faculty, and researchers.

Process

1.Research & Planning

• Studied existing archival formats and user needs. My work on ITP Thesis Archive gave me a lot of insights and experience to navigate this project

• Defined the best way to categorize and display projects. One significant change I made since the ITP project was to include a short summary line for the project.

2. Design & Prototyping

• I started by creating different mockups and wireframes for the individual cards. This helped understand the information hierarchy.

• Designed responsive cards that visually highlight key thesis details.

3. Development (WIP)

• Custom-coded the directory page within Squarespace using HTML/CSS and Javascript.

• Implementing sorting functionality for dynamic filtering by year, tags etc.

Card Mockups and Development (WIP)

Since the website already existed, my task of developing the style guide (colors, fonts, etc.) was limited. I followed the established design language of the existing website to ensure consistency. My focus was on:

• Creating a user-friendly layout for the thesis directory.

• Designing responsive cards to display key thesis details.

• Implementing a sorting system to allow users to filter projects by year.

Challenges & Learnings

• Squarespace Customization – Balancing platform constraints with the need for a flexible, tailored interface.

• Data Structuring – Ensuring thesis metadata is correctly formatted for seamless display.

• Performance Optimization – Keeping the directory fast and easy to navigate.

Current Status & Next Steps

• Development is ongoing, with plans to refine filtering interactions.

• Testing user experience for smooth navigation and readability.

• Gathering feedback from faculty and students for improvements.