Costco
Overview
Costco's e-commerce marketing department was looking for someone who could do both HTML/CSS and design work, and I was hired to fill that niche role.
I worked on various projects, both short term and long term. I helped art direct campaigns, create enticing banners for products or sales, and redesigned and coded long-term campaign assets and site-wide components. My knowledge and expertise was sought to pitch ideas that could affect the entiriety of the site, or by other departments to help solve UX issues.
Deliverables
UX/UI Design & Development
I was in charge of various long term projects that included both UX design and front-end coding. Here are some examples of released projects.
Why Buy Homepage Component
One particular product pages, like appliances, televisions, etc, there were small banners stating why you should buy this product from Costco with a list of 4 perks. They wanted to expand on this idea with a homepage component that would highlight 5 product categories. I came up with a card layout solution that stood out from the rest of the content on the homepage, with slight hover animations to attract attention of someone incidentally hovered over a card.
This component proved very successful, and several more departments came forward wanting to be added to it. This created a problem where the component would grow too large. The solution that I proposed and was accepted was a javascript solution where on large screens the info is in a tab-panel interface, and on mobile it's in an accordion. With this component, more departments can be added with minimal impact--in fact, as I type this, I'm working on adding two more!
This component continues to bring in more traffic to these departments or their reward calculators, and has been called out numerous times as a success story in company meetings and documents.
Costco Direct Table Component
Costco has a campaign where the more you buy certain products under the Direct promotion the more you save. Their original table was just an image:
I approached the redesign with a similar layout, but more readable and cleaner to make the information less confusing. Different colored columns and graphic bugs to help separate the infromation helped to promote this campaign to customers and bring more click throughs. The compnent is also used on category pages and in emails, albeit altered to work in most inboxes.
Graphic Design
One of the core duties in the e-comm marketing department is creating banners for all the various showcased products and sales. With a high turn over, it's a challenge to create designs that aren't repetitive while also fitting the vibe of the product.
Some banners would have different sized versions, dependent on what screen size they were being viewed in, or what spots they were featured on the site or in e-mail blasts.
Art Direction
For holidays or big sale events, the designers get to prep ideas for an art direction, and if chosen get to lead the campaign.
Christmas Day 2024
On Christmas Day, there is a one day campaign. The challenge for it is to give it a lovely Christmas vibe while still trying to catch sales (perhaps for those with gift cards, or those who forgot that one person during gift giving).
My idea was nice and simple: a cozy scene with gentle sparkles and glows. Evocative of a lazy night after a day of festivities. This idea took an image and added pulsing light effects to both motes of light and illumination and producing an animated gif, which was the only way to a spot of animation on the homepage at the time. A vintage-inspired lockup adds an extra touch to the banner.
The style of the lockup and the subtly beautiful background image was used on each category tile, each one unique but tied expertly to the main banner.
Animated intros to the Costco app were brand new, and after seeing the animated gif it was requested I make a version for that purpose. I recreated it in AfterEffects, not quite exactly as the gif but as close as I could achieve due to technological limitations of supporting the .mp4 on the app itself. The end result is still a glittering welcome to those logging in on that day!
Spring Sale 2025 Ideation
For a spring sale campaign, I pitched an idea that became one of two options but in the end not chosen, but the idea was fun enough a similar idea may be used in the future. Inspired by a trend in animated gifs where the animation has purposeful missing frames so it's not fluid, but not too many frames it isn't pleasant to the eye. Each day would be symbolic of the coming of spring, from april showers to spring flowers.
Below area the gifs built to pitch the idea, with a couple lock up ideas. Ultimately, not fully polished, but the cute bones are there.
