During my senior year, I volunteered to help design and develop the the virtual thesis show website for my university's graduating graphic design senior class. Due to COVID pandemic we had to quickly re-evaluate our goals and had to focus on how people would interact with projects being presented at the senior show. What began as an additional documentation for the senior show like in previous years quickly became the main focus and platform for how the thesis show would be shared and accessed. The entire site was custom built within Visual Studio Code without any preexisting templates.
The entirety of the project's assets, design, development, and promotion was completed start to finish by the team within 5-6 weeks.
In the beginning of the group's process we were seeing how combining a bunch of visual ideas through a shared Pinterest account can bring up some reoccurring trends and sources of inspiration to base the branding around. Once the website was slowly becoming a more and more important part of this project, our sources became more cleaned up and narrowed down. The simplicity of black and white paired with a beautiful typeface and negative space was something than inspired some initial layouts.
By trying out experimental designs with these explored typefaces, I wanted to see how limited and expressive the type can be as well as how it could be composed. This branding/ social concept did not end up making the final cut, but did contribute towards defining the final brand colors, typeface, and icon style later carried out.
The team came to a consensus on the final brand colors integrated in the website, branding, and social promotional material.
Initially, I designed a few types of templates depending on the number or image assets submitted by each student were designed to see how the page design could be translated. Through collaboration, this page was re-visited and refined to remain flexible with the content no matter how much content was being hosted.
The Homepage served as an expansive landing page showcasing a primary image asset from each student project. On the about page, information about the reimagined thesis show can be found as well as a grid layout of some static and motion based assets shared to promote the show.
Student case studies were easily accessed through the site's landing page that led to individual pages for each case study. Starting with a header image and statement, projects links and additional image assets were submitted to students in ways we allowed them to design their projects to best fit the case study platform.
In addition, we included a student directory at the bottom of each case study page to make it easy to navigate between projects. The name of the project title for a student appeared once hovered on.
To best correspond with different devices and screen sizes, the site was designed responsive across various screen sizes to accommodate content on each page in the best way possible. The styling of large text and basic paragraph styling allowed content to be scalable and readable from virtually any size.