Giant Eagle’s strategy to increase online giftcard sales, and how we helped them to succeed.
Giant Eagle is an American supermarket chain with 474 stores in Pennsylvania, Ohio, West Virginia, Indiana, and Maryland. Based on 2024 revenue, Giant Eagle is the 49th-largest retailer in the United States. Like many large US grocery retailers Giant Eagle have also diversified, opening a chain of artisan style grocery stores, in-store banking, pharmacy, gifting, and insurance services.
Overview.
Summary.
Loyalty cards and rewards are a big aspect of grocery shopping in the US and the offerings retailers give on their loyalty cards are competitive. Giant Eagle's rewards offering is a service called 'Fuelperks'. For each purchase, customers accrue Fuelperks points which can then be redeemed for fuel at certain service station chains.
Buying gift cards online for immediate redemption in restaurants, cinemas, diners, supermarkets, and service stations is becoming increasingly popular. One of the reasons is that people can accrue loyalty points by paying for services with a gift card that offers a rewards scheme.
In 2019, MWG Dublin, were hired by Giant Eagle Supermarkets to deliver a best in class responsive ecommerce solution for the gift card channel of their business.
Project roles.
My role.
Principal UX designer.
Other designers who worked on this project.
1 other product designer from MWG Dublin. 3 in-house ecommerce designers from Giant Eagle Supermarkets. 1 branding designer from Giant Eagle Supermarkets.
Size of the overall team.
The MWG Dublin team consisted of 1 product owner, 1 project manager, 1 business analyst, 2 designers, 3 R&D developers, 10 developers and 2 testers.
Project duration.
10 months, 2019.
Key Objectives.
Key design objective. Create an easily browsable responsive shopping experience that offers quick checkout and payment options.
Key technical objective. Develop a fully responsive ecommerce offering that uses the latest technologies and best practice methods.
Key business objective. Deliver the product on time and on budget with all agreed features included. Build relationships with the client for possible future engagement.
Problems to solve.
Problem Statement. This large US retailer wanted to grow their revenue from the online gift card channel of their business. Gift cards are big business but the current website and methods in place to process orders were not capable of meeting increasing order traffic.
Scope & Constraints. The new gift card site we were providing had to be reachable via all existing Giant Eagle online stores (Giant Eagle, Market District, Curbside, Get-Go, Wet-Go).
Discovery phase
Competitors.
"The global gift card market is going nowhere but up, a new survey finds. Persistence Market Research predicts that the international market for gift cards is likely to grow to $506 billion by 2025 with a CAGR of 6% from $318 billion in 2020".
Source: Marketplace.com
Primary competitors.
Based on market share, US supermarket giants Walmart and Kroger are Giant Eagle's main competitors. However as we were creating a separate stand alone gift card site we needed to not only look at their main grocery competitors but also competitors in the online gift card market. The main competitors selling third party online gift cards were Gyft and giftcards.com
What the primary competitors do well.
Walmart
One of the largest retailers in the US, Walmart have invested heavily in their online sales channels.
They are keenly focused on user testing and user feedback and are constantly evolving their online shopping experience based on these.
Competitive pricing and special offers are key to the Walmart offering.
Gyft
Offers a large range of gift cards from over 200 retailers.
Shoppers can choose from e-gift or plastic card options.
E-gift cards can be redeemed instantly online after payment.
Website is responsive with strong focus on quality imagery and user experience.
How this impacted our approach.
These two heavy-hitting online competitors have their focus firmly on customer choice and the quality of online shopping experience. We would need to make sure that our site redesign for Giant Eagle Gift Cards put customer experience and accessibility to the fore if our client was to compete in this market. We would also need to understand how we could make fulfilling the orders of plastic gift cards less manual and more streamlined to bring Giant Eagle Gift Card's delivery timelines in line with their competitors'.
Discovery phase
Users.
"We've always shopped at Giant Eagle. And we get the Fuelperks points as well. They add up pretty quickly."
"I always get a gift card to pay for dinner. My girlfriend thinks I'm crazy, haha. I get Fuelperks points doing it that way"
"I knew they sold gift cards in-store but I didn't know you could buy them online. I don't shop much online, apart from at Amazon."
"I do use the online gift card site. I buy a prepaid grocery card for my daughter who's away at school."
Key user demographics.
User 1. Female. 18-24. Shopping online for instantly redeemable e-gift cards. Value is important. Rewards points are important.
User 2. Male. 18-24. Shopping online for instantly redeemable e-gift cards. Value is important. Rewards points are important.
User 3. Female. 45-54. Shopping online for e-gift cards and prepaid grocery cards that can be topped up and sent to children who are away. Value is important. Speed of activation is important.
How this impacted our approach.
Gaining Fuelperks rewards points was clearly important to users, so we would need to find a way of alerting them as to how many rewards points they could earn per tranasction. We would also need to recommend creating advertising imagery for Fuelperks that could be used within content areas on the site.
Many people seemed unaware that they could purchase gift cards online at Giant Eagle, so we would also need to promote the online gift card channel in-store and on Giant Eagle's other online ecommerce sites (Giant Eagle, Market District, Curbside, Get-Go, Wet-Go). A new website launch would be a good opportunity for this.
Design phase
Storyboarding.
Us two MWG Dublin designers began storyboarding key screens.
We focused only on primary features and interactions.
When we had a simplified end to end user journey complete we collated the sketches and reviewed them with the rest of the project team.
We then walked the client through our proposed user journey.
Storyboard of the product details page, plastic gift cards tab selected.
Design phase
The bigger picture.
This is the room that we took over in Giant Eagle's head office in Pittsburgh, Pennsylvania to physically map out our site. The coloured post-its indicate design, development or client tasks.
Our site mapping room in Giant Eagle's head office, Pittsburgh, Pennsylvania.
Design phase
Wireframing the experience.
We now began wireframing detailed screens. These would be used by our development team and project managers for internal scoping exercises. They would also be used to review our proposed approach in detail with Giant Eagle.
Wireframes of the homescreen showing image sizes and content types.
Design phase
New site branding.
The existing Giant Eagle Gift Card branding was due for a face lift.
The Giant Eagle Marketing Dept. created a new logo and also a new name for the gift card service. Giant Eagle Gift Cards was now to be called Giant Eagle Gift Card Gallery.
We used the colours from this new logo to form our primary colour palette for the UI of the new gift card site. We also introduced a secondary colour palette of supporting colours.
As website accessibility to AA standard is a legal requirement in the US we ran all our new colour palettes through 3 accessibility checkers (sometimes their readings can differ so it's always good not to just rely on one accessibility colour checking website).
A page from the style guide we created for Giant Eagle Gift Card Gallery.
Design phase
UI design.
Us two MWG Dublin designers applied the agreed upon branding to our screen flows, section by section. We then reviewed and iterated these with the three Giant Eagle in-house ecommerce designers to get their buy-in and to confirm that what we were proposing was sympathetic to their other online stores.
Top row from left: Homescreen, main menu, category menu, search results. Bottom row from left: Product details, mini cart, shopping cart, checkout.
Outcomes.
New approaches.
Communicate at least daily, and if face to face communication is not an option always try to use a video call instead of a phone call. Try to regularly travel to be onsite with the client if possible.
Was it successful for the client?
The new responsive Gift Card Gallery site was well received by the Giant Eagle leadership team.
Revenue increased, and due to the new order fulfillment processes we had put in place, delivery times for plastic gift cards were reduced.
The number of gift cards sold online also increased.
What we learned.
Working with a client in another timezone can be tricky if expectations on both sides are not managed correctly. We had to adapt to a way of working when direct engagement was only possible for 5 hours of each working day.
We also learned that regular on-site visits and video conferencing were important to keep both sides of the project team aligned and to minimise any project friction.