oiselle
ecommerce website refresh
project role
SVC student
Visual Designer
process
Competitive analysis
Mood board
Style board
Wire frames
Final layout
TOOLS
Illustrator
Photoshop
overview
Oiselle (pronounced wa-zelle) is a Seattle-based athletic apparel company for women by women. Oiselle’s mission is to make a great product, build a sisterhood, and improve the sport of running.
Oiselle has a physical store in Seattle’s U. Village and also an online store, which was established in 2015. A few of their competitors are big brands such as Nike, Athleta, and Adidas.
“Everything we do supports women
who want to move, run, and fly.”
opportunity
Oiselle’s website is responsive, and an estimated 40% of online shopping is done on mobile devices. Their existing site does a fine job at ecommerce. However, there is an opportunity to update their visual language and images to express Oiselle’s vision of “feminine fierce.”
AUDIENCE
Women who shop at Oiselle believe they are supporting a brand that is the thinking woman’s athletic brand and who enjoy being part of a greater community of women runners. Oiselle’s primary audience is progressive, dedicated female runners ages 18-40s, middle upper income, and college educated. Their secondary audience is female athletes and running enthusiasts.
RESEARCH
I did a competitive analysis of other athletic ecommerce websites. I also chose keywords that best describe the brand, bold and strong. These words can be represented visually in photography on the website and support Oiselle’s mission.
Mood board + Style board
For the mood board I chose high contrast black and white images to show the brand is bold and strong. I also created a style board to show the colors of red, black, and white to be the building elements of the visual language because they are high contrast, bold, and strong. I also selected images of women in action as opposed to static models to represent the clothing line. I chose the typeface Avenir Next because it is both elegant and bold, while the contrasting use of thin and thick weights makes it effective to use for headlines and body copy.
wire frames
design solution: desktop + mobile
HOME PAGE
The homepage is composed of a hero image and headline that connects to the dedicated runner who likes a challenge. Since this is an ecommerce site, it was important to show the categories the apparel collection sells. Also, social media is a big part of the feeling of connection, community, and sisterhood that the brand promotes, so I added a social media feed to the bottom of the homepage called “Share your #flystyle.” There the user can upload a photo or see the gallery of images by other shoppers and runners.
home page: desktop + mobile
LANDING PAGE
On the collection landing pages I opted to showcase the collection with models photographed in an action pose or doing an exercise pose to showcase the clothes in action. The poses were yoga, running, and stretching.
landing page: desktop + mobile
product page: desktop + mobile
