Company
Crane

Project
Redesign And rebrand E-com website

Background
Crane is a luxury stationary company.

Responsibilities
UX Research
Visual UI Design

Date
Sept 2019 - Feb 20209

Crane-Hero-img1-6

Previous Homepage Design

Crane-Homepage-feedback-1

AREAS FOR IMPROVEMENT

1. Find Retailer was highlighted at the top but only provided a directory for pre-made products.

2. The navigation site architecture needed to be more precise and transparent to the target audience.

3. Hero images were not responsive.

4. H1 and body copy was not live text but were part of the image, which resulted in poor SEO, ADA compliance, and search-ability issues.

5. CTA was the Hero image, which resulted in a non-responsive design.

6. Highlighted sections were image files, resulting in poor SEO and responsive design.

Crane-Homepage-feedback-2

7. Highlight items provide little insight about the products or why they are being highlighted. The homepage was also restricted to 4 products.

8. Video would auto-play without providing customers the information about the current video.

9. Blog was not connected, resulting in a static blog section and would require manual updating each time a post was created. Additionally, outside of visiting the linked article, there was no link to the blog.

10. Instagram was highlighted but needed to be managed or maintained.

 

Previous Products Design

Crane-category-feedback

AREAS FOR IMPROVEMENT

1. Filter options are not responsive.

2. Sort by function does not function as intended.

3. Products do not offer what options each offers at a glance. Customers would have to go into each product to understand what paper types, colors, or customizations are provided for each product.

 

Previous Product Details Design

Crane-product-feedback

AREAS FOR IMPROVEMENT

1. Product Details feel unassociated with the product and are below the fold.

2. Paragraph width is too wide for on-screen reading.

3. More Information is too far down on the PDP. Hierarchy of information needed to be revisited.

 

Design Challenge

Reposition the brand and e-commerce website for a younger audience. In addition, modernize the platform by making it responsive, SEO, and ADA-compliant.

Rebrand & Redesigns

Before defining the redesign for the e-commerce website, I worked closely with an outside agency to rebrand and redesign the Cranes logo, colors, and typography. The concept was to appeal to a younger audience and modernize the brand image.

C-branding-overview

Homepage

Crane_homepage_desktop_1
Crane-homepage-mobile-1
Crane-homepage-mobile-2
Crane-homepage-mobile-3
Desktop-Mobile_11-Featured-4
Crane-homepage-mobile-5
Crane-homepage-mobile-6
Crane-homepage-mobile-7
Crane-homepage-mobile-8

Product Category

Crane_category_desktop_1
Category-Mobile-1
Category-Mobile-2
Category-Mobile-3

Product Details Page

Crane_product_page-1
Product-Mobile-1
Product-Mobile-2

Personalization Experience

Crane_product_page-4
Crane_product_page-5
Product-Mobile-3
Product-Mobile-4

More Projects

CraneWeb

CitiMobile

BrickworkMobile & Desktop

BCRFWeb

© 1982