Industry Night

2024An event site pitch for Fanshawe Industry Night.As Creative Lead / Designer / Developer

Live preview

A 3D emblem you can turn

The Fanshawe emblem in 3D. Drag left or right and it turns with you, in WebGL.


1 / 5

Project
Group pitch project, Fanshawe IDP 2024.
Built with
GSAP, ScrollTrigger, Lenis, model-viewer (WebGL), SQL

This project might be the summary of my whole time at Fanshawe IDP. It pulls together almost every technical thing we learned about building websites over two years. It was a group project, and the brief was to build the website for our own year’s Industry Night: the night every student shows their portfolio to people in London’s creative and web development industry.

The site gathers every student’s portfolio, and it also shows off the sites that weren’t picked as the main one. That means every group designs the same site, but only one wins. Spoiler: we didn’t win. Still, it’s my favourite work from school.

I was the creative lead, the web designer and one of the developers, working with three friends. We set ourselves one rule: every section should show something we learned, and nothing gets left out.

We had a class on making 3D, which amazed every one of us, because none of us had done it before. So I made the Fanshawe College emblem the star of the hero section. And since our program is called Interactive Media Design, we added WebGL, so the 3D emblem turns when you drag it left or right. We also spent quite a while moving the main font to a serif, to step a little outside the brand. We wanted to show that our program understands art and design trends and is always ready to adapt. That’s what we took from our Brand Design class.

The same goes for video. We had a Video Editing class, and its work lives in the next section, which appears as soon as you scroll down to it. You’ll also notice that the GreenSock Animation Platform (GSAP) controls the transitions all through the site. That came from our lessons too.

The showroom holds more than 70 students. We managed their data with SQL and planned it as an interactive space as well: hover a student’s name and a sample of their work appears next to their portrait. We wanted our program to look lively and active. One note: almost everything you see on the site now is placeholder content, so none of the student names are real. The only real name is Marco Deluca, the head of our program.

We didn’t win. We came second. But my prize was praise from Robert Haaf, who has been teaching since 1998. He said he had never seen a design this professional for this project. For me, that was a real blessing.

Thank you to Elian for the video, Keith for the main 3D work, and Connie for keeping us together and writing the site’s content. I miss you all!