pc-balloon-overlay.jpg

PartyCity.com Outdoor Yard Signs


HOME / PartyCity.COM / Customizable Yard Letters

PARTYCITY.com customizable yard letters

PartyCity.com was selling individual Giant Outdoor Yard Letters but the customer was running into problems when they would want to spell out a long word and would have to add each individual letter and color to their cart. I was tasked to create a solution for the customer to easily be able to write out a message or word that can then be added to their cart at once. The prototype for this began with many other variations, but ultimately it was decided to work with a mobile-first design that allows the user to type on a keyboard identical to a phone, but has the option to add the custom characters and shapes available in the yard letter signs. Since the user can select a color for each of the letters, that ended up having at least 800+ different options of combinations the user could be selecting. With that said, I created color swatches the user can select prior to selecting their character. To clearly identify that a color was selected, the color of the keyboard updates to the color of selected swatch.

WHAT WAS I TRYING TO SOLVE?

  • Wanted to allow customer to build a phrase within the experience versus having to add each letter to their cart

  • Show a preview for the customer to be able to see what they’re writing to have a visual confirmation

  • End-to-end experience that incorporates the full item customization in the cart

  • Allow for a customer buying letters in bulk to have a discount

  • Allow for customer to see preview of the customizations they’re making

Functionality:

  • Ability to add customizable words and messages to cart without having to go to each product SKU

  • Customer needs to be able to select the color and character or shape for each individual sign

  • Cart must be updated to show all the customization selected by the user

  • Incorporate a site based keyboard of letters, shapes, and glyphs available to purchase (couldn’t utilize the text keyboard because of the additional shapes and glyphs that were available to purchase)

 

MOBILE

VIEW MOBILE PROTOTYPE
(OPENS ADOBE XD EXPERIENCE IN NEW TAB)


DESKTOP

VIEW DESKTOP MOCKUP
(OPENS ADOBE XD Mockup IN NEW TAB)