BedHead Pajamas Landing Page

Overview

The design objective is to redesign the Bedheads Pajamas landing page while retaining the personality and feel of the brand. Based on the About Us Page, the key brand personalities that were focused on for the redesign of the page were:

Luxury

Elegant

Cheerful.
These three personalities helped guide the design choices made throughout this project.

Existing Design Problems

CTA draws little attention

Low Contrast in CTA3

Logo Positioning

Favourites Functionality is unavailable

Rewards Program CTA Positioning (Hidden)

Font Choices do not project a specific brand personality.

Layout in "New Arrivals" may feel overwhelming for the user

Low Visual Hierarchy

Hidden Search Bar

Nav Icons

The Proportions of the hero-section displayed in the viewport.

Competitive Analysis

From the other retailer sites below, it was observed that bedheads pajamas has an opportunity to standout by:

Implementing a clean and more obvious CTA.

Maintaining a specific mood/Art Direction

Re-Organizing Items on the navigation bar

Using imagery to drive the message in the CTA

Decongesting the overall Layout.

Using Embedded Social media Links

The Design Process

The Art Direction for this project is to recreate emotions that relate to having a very relaxed day at home. A mix of calm & happy moods only found when a person has the chance for some alone time by themselves or with loved ones. The imagery and color will be the main drivers for expressing these moods.

The foundation for the color palette was selected from the existing landing page, However a touch of light-blue was the colors to make them appear softer on the eyes. The colours were used in a way that they reflected the cheerful personality of the brand.

Ivy Mode typeface was used because its crisp and smooth form relates to the elegant personality of the brand. Lato was used in combination for its legibility on different screen displays (web/mobile) and the variation of font-weights.

User Experience Improvement Breakdowns

The Navigation Bar : was designed to be more compact to give more room for the page content

Promotional Banner: The overhead Banner color was changed to Light red to increase contrast/Visibility

Logo Positioning: According to research made my the Nielson Norman Group. Getting back to the homepage is about 6 times harder when the logo is placed in the center of a page compared to when it’s in the top left corner. This guided my choice for the positioning.

Reference Link: https://www.nngroup.com/articles/centered-logos/

Search bar: The search bar was made visible so users will be more likely to engage with it when looking for an item

Visual Hierarchy

In "New Arrivals" sections different font weights were used for product name, description and price to improve legibility.

Feedback&Reviews

Based on recent trends ,the addition of Embedded Tweets will be more engaging and realistic for prospective customers to interact with the brand

Favourites Functionality:

Using websites like h&m/Reitmans as mental models, This functionality was added to the design because the ability to add items to a favourites lists improves the user experience prior to making a purchase.

Rewards Program CTA Positioning (Hidden)

The rewards program CTA is hidden by the browser as seen in the image below. The position was changed to top right and it was also given a close button incase it gets distracting for the user.