Personal Design Project to practice web design skills, and explore and research role models and representation of my community.
Design Brief: create a unique multi-page website that explores and ignites a sense of passion and pushes creative boundaries and builds skills in web design.
Concept: A website that amplifies the stories of queer APIDA figures in history and their advocacy and impact on the queer community. Design should be bold and vibrant to align with the way these figures have moved through their own lives to inspire change. Both Queer and APIDA communities represent a vast spectrum of vibrant cultures so the goal is to showcase that vibrancy throughout the design. Also to show the vast spectrum of APIDA experience that is also rooted in the multifaceted dimensions of queerness.
Process and Exploration
Came up with three distinct visual design directions to explore different ways the concept could be carried out.
In all three directions, the typeface used is Big Shoulders. This font choice is intentional in the thick stroke, san-serif to embody the boldness that this concept requires.
Concept One: This direction emphasizes the red that is found in many Asian/Pacific Island flags. Red is a very significant color in many of these cultures and would represent strength and celebration of all of the cultures that would be represented in this website.
Concept Two: This direction more emphasizes the rainbow/queer motif in the color scheme and visual design while also pointing towards the APIDA aspect with the paper lanterns originating in East Asian cultures and the Korean lettering on them.
Concept Three: This direction also uses the rainbow/queer color scheme motif but incorporates a photo collage of queer APIDA people. This is to show the spectrum that exists in the intersection of APIDA and queerness and showcase the joy and vibrancy that exists in these communities.
Website Page Development
Once design direction was chosen, web page development began. Color palette was chosen from the cover image under the clipping mask from concept two. Images and text were then grouped and placed using a grid system to ensure readability, accessibility, and clear communication.
To maintain consistency while creating interest and diversity in the web pages, the flag of each individual's ethnic background was used for the clipping mask for the header. Corresponding colors from the color palette were used in the subheading.
Website prototype was designed using Figma. Explore the Figma file below! Link to prototype