In this project, I played the role of "Graphics Designer" and designed the landing page for

an imagined snowboarding gears website by developing my own creative strategy 🪄

I focused on practicing and challenging my UI and graphic design skills ---- I want to let my mind be CREATIVE and OUTSIDE THE BOX 🔮

‍

This project is selected to be a future student exemplar by the instructor for demonstration. I am very proud of what I have done 🎉🎉🎉

Snowboarding Lover 🏂🏻

As a snowboarding lover, I always want to integrate the concept into my design and convey a sense of energetic and optimistic vibe to the viewers.

Burton is one of my favourite websites because the overall visual design creates a sense of dynamic feeling and conforms to the theme of snowboarding. Therefore, this is a great chance to apply the knowledge of graphics design and let my creative mind flow.

‍

‍

Add inspiring imagery

I started to find some inspiring images around the web, such as Unsplash, Pexels, Picjumbo, Pinterest, etc. It helps me define the branding and styling I want to have on the design. After that, I wrote down a list of adjectives that I want people to feel when entering the website.

Moodboard Theme: Energetic, Optimistic, Fresh, Active

‍

‍

Test the Moodboard

In order to ensure the moodboard would trigger similar emotions for the audience, I showed it to my peers and asked them tell 4-5 words that describe my moodboard.

Then, I shared the adjectives I chose and asked for their feedback.

Based on the adjectives given by my peers, I can see they are consistent with my adjectives and expectation.

In this step, I developed a basic style tile that corresponds to the emotions I wanted to express, and came up with rationales to demonstrate the relationship between the branding and the proposed visual solution.

I found this step extremely useful as the moodboard is not sufficient enough to fully establish a visual language. Style tile helps me further define and communicate how a visual style will be applied across the website.

‍

Color Palette 🎨

I chose the blue (#3A6896) and white (#F4F6F8) as the two primary colors, where blue is the color of sky and white is the color of snow.

The reddish color is used as primary CTA button color, which can be easily noticed.

‍

Typography ⬛️

Sans Serif Oswalt is used as the primary typography. The skinny, tall, and less cumbersome feeling of Oswalt conforms to the "sports" theme and looks more energetic. It has 6 font families, which can be used to create contrast between different headings.

Georgia is used as the secondary typography, because it is highly legible and has greater stroke contrast and stronger rhythm. It can be used to convey a more formal look.

‍

Something Worth to Point out 🔔

Here are some design rationales I really want to share with you!

1. Connection with Snowboarding

On the first page, The headline "Snowboarding Gear" is partly hidden behind the person ---- this is done intentionally to let the person's image stand out among other elements and create a more realistic feeling of breaking out of the frame, just like conquering the slopes one after the another regardless of the obstacles ahead when snowboarding.

‍

2. Real Life Inspiration

The snow falls on the mountain during the snow season, which hides its actual shape. And since the snow mountains are mysterious and hazy, I used it as a metaphor and treated the word "Snow" as if real snow falls on the mountain. The word is partly hidden to conform to the mysterious feeling of snow mountains and create a sense of depth.

‍

3. Call-to-Action

The button "Discovery" is not designed as a regular button, whereas it is connected to the snowboarding person by an arrow. I used the principle of Continuation to direct the user's eyes to follow the path of the arrow, which eventually arrives at the button and encourages them to take action.

‍

4. Unique Font ---- "The Speedmaster"

On the second section,  the headline "The Speedmaster" is designed to have larger letter spacing to make the font look more unique. 

Since the headline is in all caps, the letter spacing is increased to guarantee readability.

A red line is used to connect the two letters "E" and correspond to the name "Speedmaster." The line is straight across the two letters, just like the trail left by snowboarding.

‍

5. "Featured Collection" ---- Break the Balance !

There are two round rectangles on the background, and they are designed to be diagonally positioned. The intent is to break the balance and generate a dynamic feeling by making it asymmetrical and not aligning the 3 categories with each other, either horizontally or vertically.

‍

1. A really interesting and fun design process

Overall, this project is interesting and well-aligned with my personal interest. I love to be creative and practice my aesthetics like an "artists".

Most importantly, this project was recognized by the instructor and selected to be a future exemplar, which makes it even more meaningful!!

‍

2. Focus on Visuals

I found it a bit difficult to focus less on usability and more on the visuals to make it more creative. When I designed the "Featured Collection" section, I unconsciously designed it as the "regular" layout that we would usually see on an online clothing store. After all, it is safe, reasonable, and has better readability.

However, the purpose of this assignment is to practice graphical design and let the creative side loose. I forced myself to think less about designing for usability but more about images, typography, and color. I was also able to generate inspiration by looking into other graphical design works.

‍

3. Keep Learning from Others

I‘m not a graphic designer, and I don't have much opportunity to practice graphic design skills. At first, I didn't know where to start, but as I started to look at other designers' works on Behance and Dribbble, it helps me develop my own creative insights. I also got inspired by some unique layout and brave color choices. it is an exciting process, and I'm satisfied with my work.

‍

‍