Select Page
Beauty by Bay Logo

Beauty by Bay is a personal brand for a beauty consultant. The client, Bailey Powell, wants to market her specific services that she provides through a salon because part of her income is based on commission. With this project, I plan to expand and enhance her brand/portfolio by designing a logo, style guide, new business cards, desktop and mobile website prototypes, an animated logo, and animated promotional video.

The target audience are females ages 15 to 80 years old with hair, waxing, eyebrow, makeup service needs. The call to action for this project is “Discover Your Beauty”. The client wants to help others feel and see their beauty through her services. The competitors include other salons, beauty consultants, beauty YouTubers, and beauty related stores. 

Beauty by Bay Style Guide
Beauty by Bay Business Card Front
Beauty by Bay Business Card Back
Beauty by Bay Business Card Mockup

Style Guide and Business Card

I began by researching portfolios and beauty brands to find inspiration for the brand. I collaborated with the client on what she envisioned for her brand. I found trends that I thought aligned with the brand and discussed them with the client. From there, we created the style guide with her taste and target audience

in mind.

The client had already established a name for her brand. Using said name, I designed a typography logo to correspond with the typography logo trend in the beauty industry. For the logo, heading and body font, I chose to use both serif and sans serif fonts to create contrast and bring a modern timelessness that would appeal to the vast audience. The client felt a blue teal color would represent her best so I created a range of that color to, again, appeal to the wide audience range.

 

The client requested the use of marble into the brand so I applied it to the website headers. To further implement the marble, I designed graphic elements that mirrored the curves often found in marble patterns. For the sub mark, I used the letter “b” from the “bay” in the main logo to match the typography theme.


The business card design was a collaboration of style guide elements. On the front, I placed a solid color for the background, graphic elements in the corners, and the main logo in the center. For the back, I included my client’s name, job title, contact information, and brand sub mark. Since business cards are the client’s main way of helping her mature audience keep in contact, I also added a place for the client to write appointment dates and times.

The Animated Logo and Video

The purpose of the animated components of this project is to further promote the client’s brand/skills on social media site and future site.  For the logo, I wanted to play off the curves of the graphic elements by adding wave effects. For the promo video, I created various graphics to display the client’s large skill set. 

After researching various motion graphic videos, I began sketching and story boarding the animations. Then, I designed style frames based on the story boards in Adobe Illustrator. Next, I imported the style frames into Adobe After Effects. From there, I used the position, rotate, opacity, skew, and track matte tools to create the animations. Then, I exported animations as MP4 files. Finally, I imported the animated promo video into Adobe Premiere to insert a copyright free audio track and exported the final video. 
Beauty by Bay Website Mockup
Beauty by Bay Website Links

The Desktop and Mobile Site Prototypes

After researching, I started sketching and wire framing the desktop and mobile sites. Using the wire frames, I designed black and white prototypes. Then, I wrote all the site copy, which included three blog posts with references. I worked in collaboration with the client to make sure what I wrote was accurate. Next, I gathered copyright free stock photos for all that page. The client supplied the images for the Gallery and About pages. Then, I applied all the text, images, and color to the site. Finally, I linked all the pages for both versions of the site.

Check out the links below to view the desktop and mobile site prototypes

Desktop

Mobile