Custom Printing Experiences – Edward Chen

Project Details

Year: 2017 - current
Role: Product Design, Research
Project Type: Client work
Clients: Costco US/CA, Sam's Club, Staples, FedEx

Collection of various projects for Costco, Staples, Sam's Club, and FedEx to help improve the user experience of their custom photo and business printing platforms.

In my role as Product Designer at PNI Media, I had the opportunity to dive into various projects for our clients in the custom photo and business printing industry. Projects I worked on ranged from improving landing pages, improving the customization experiences, enhancing the information architecture, to UX improvements across the site. Below is a glimpse of a few projects I helped bring a positive impact to.

STAPLES — Design Templates Experience

I designed the experience that allows customers to easily browse, search, preview, and change design templates right inside the builder. Previously, when customers enter the builder and did not like their chosen design template they would have to exit the builder and go back to the previous page to find a more suitable design. The previous experience resulted in bounce rates. The new experience aims to alleviate that and provide a more seamless experience and keep customers inside the builder.

Browse Design Templates

Search Design Templates

Scenario — No Match

STAPLES — New Builder Experience

I was tasked to design a new experience for Staples' Business Printing builder. I collaborated with one PM to work through the design requirements and scope. The main aspects I focused on was Text Editing, Text Movement, Alignment, and Zoom.

Text Options

-

Text Colour Dropdown

Formatted Text

Text Interactions

STAPLES — Browse Design Personalization

To improve the browsing and purchasing speed for customers, I designed the experience that allows customers to enter their information so they can quickly preview it on all product designs. This initial ask was to provide a popup modal similar to a competitor's implementation, but I felt like that was not a good experience so I decided to propose another design and test both with users.

My assumptions ended up being correct as the user testing showed 9/10 users preferring the sidebar form design over the more intrusive popup modal. They mentioned that they preferred having a quick glance of the designs before taking any further action and the popup experience impeded that. Users felt the sidebar did not get in the way and provided a way for them to quickly confidently see the preview next to the information they added. All users found this new feature extremely valuable and think it'll save a lot of time.

Iteration

Modal design that I tested against the Sidebar form design. This modal shows up as soon as user lands on the browse designs page hopping to draw attention to the user

Final Design

Final design — Sidebar form. This allowed for a more intuitive, yet less intrusive browsing experience.

COSTCO Photo Center — Address Book

I worked with 2 other designers to come up with a new address book design for the recipient address feature in Costco's Greeting Cards builder. One of the requirements of this component was for it to be easily reused and adapted to work on other pages such as the My Accounts page. I helped with responsive design of the address book as well as documented all the interaction and UI specs for development.

Address Book inside the Greeting Cards builder experience

Address Book inside the Account Information page

UI specs documenting states, behaviours, and responsiveness

Accessibility documentation of tab order

Accessibility documentation of tab order on mobile

Sam's Club Photo — Header Rebrand

The header and footer of the Sam's Club Photo and Stationery sites were losing its cohesiveness as the main SamsClub.com had a new look and feel. In an effort to re-align Sam's Club Photo and Stationery with their main site, I was tasked to do a header refresh. Additionally, I added dropdown arrows to provide visual indicators that there is a sub-navigation menu. The refresh helped provide brand cohesiveness and consistency between the sites which in turn saw immediate results with decreased bounce rates at launch. Our client was happy with the final outcome which is always a win.

Old Sam's Club Photo header before redesign

New Sam's Club Photo and Stationery headers after redesign

STAPLES — Cross-Sell

I designed and shipped the first phase of the Cross-Sell component on the Shopping Cart page. My Project Manager had conducted market research on the value of having cross-sell to increase the average cart total. The customer value of cross-sell also allows customers to view related products that they might've missed. Leveraging the technology we had, we were able to render user-inputted information from their original design onto related products so customers can have a sense of how it would look like.

I helped conduct user research to observe how users behaved and reacted to similar cross-sell experiences on competitor sites. We found out that users typically don't mind relevant product recommendations as they are used to that in the majority of sites they use. They also prefer recommendations as long as they don't get in the way of their intended purchase. This helped drive our decisions on where to place this component as well as the type of product information needed.