afx dance (web)
History Project Designer for AFX Tech, the technical projects team under AFX Dance*︎︎︎ (Sept 2022 - Dec 2022).
Website redesign to include new features, reorganize its archive, and update its aesthetic.
Redesigned during my time on AFX Tech (where our team's developers were supposed to implement the changes but didn't get around to it :,( ). Built from scratch on Framer afterwards (Aug 2024) (when our old website server subscription died :,,( and we needed a new website for audition season).
History Team: Joy Zhang (project lead), Leo Huang (developer), Elizabeth Sun (developer) (+me!)
Timeline: 2.5 months for design, 1 week for building the website
Tools: Figma, Framer
Skills: web design, UX/UI, copy writing
View the website here*
______
home/landing page redesign
goals:
try new layouts, see if any stick
use updated media
old website
yays:
cool to load into a video; highlights showcase which is our biggest event of the semester
nays:
full performance video playing takes a while to get to the core of who we are
having the logo front and center takes away from the people
lofi redesign ideas
idea 1: photos/videos/gifs highlighting each of our three pillars (Aspirations, Family, eXperience), scrolling down to the about page
yays:
highlighting more of what makes AFX, AFX
nays:
layout reminds me too much of my other club, Innovative Design
too much negative space around highlighted circles
idea 2: video in the background with text overlaid, scroll-through highlights inspired by San Francisco Ballet's website
yays:
SFB website very cool, would be cool to have something similar to highlight big events
nays:
challenge of video collection, requires more frequent updating to keep highlights relevant
a bit too much text
new website
updated media with a gif of a pre-performance cheer (org-wide tradition to cheer out after practice and before a performance!) — adds a more inviting, fun personality while giving a peek into what it's like to be in the org
______
about page redesign
goals:
highlight values more
redesign "AFX Over the Years" section to streamline archive presentation and highlight more than the YouTube playlists
old website
yays:
straight to the point with the information
good to have an archive, timeline is intuitive to use
nays:
doesn't highlight who we are; a bit plain
"AFX Over the Years" section does not do a good job of showcasing our teams throughout the years by simply linking the relevant video playists + is by date, which doesn't say much
no call to action
midfi redesign
highlighting each of our pillars with a visual and description
streamlining "AFX OVER THE YEARS" with a dropdown by semester and year to highlight teams in addition to the videos
new website
added "OUR VALUES" section gives a visual of who we are and what AFX stands for; using gifs makes the page more dynamic and adds motion (since that's what dance is about!)
call to action for those coming to our website to learn about how to join
"AFX OVER THE YEARS" section in the works — trying to figure out how to implement it where the sections update based on the semester and year!
______
FAQ page redesign
goals:
update to match the new website's aesthetic and minor copy edits
old website
______
teams page redesign
goals:
condense info to shorten page scroll
reusing "AFX OVER THE YEARS" page design; ideally implementing the dropdown selection for semester and year here too!
old website
new website
______
board page redesign
goals:
update to match the new website's aesthetic (+ add full board photo!)
took out hover history since it's a bit distracting and the information isn't necessary
old website
new website
______
Overall, building the website in a week based off of existing designs I had already worked on was a fun challenge to practice using component and variants and gain a better grasp of Framer after having recently designed my portfolio (hello! as i break the fourth wall :p) on it as well. Still learning and figuring out how to create responsive interactions with variants (especially on the "Teams" page and "AFX OVER THE YEARS" section), but at least we have a functioning website again!