Smithfield Foods is one of the most well-known and lucrative meat processing companies in the world. With over 60 brands — including Smithfield, Nathan's Famous, Farmland and Eckrich — there was a need to integrate brands within one eCommerce platform to showcase the brands in a more cohesive shopping experience.
Smithfield Foods
Digital Transformation
AGENCY
projekt202
Role
UX Lead
Year
2020
Agency
projekt202
Role
UX Lead
Year
2020
Project Challenge
Developed a workflow, designed page templates and built a design system that scales across different design and development teams.
- One site template across brands
- One cohesive cart/checkout experience across brands (e.g. GAP)
- One dream: "sell more meat"
Shared Cart & Account
Project Template structure
Core Toolset
We set up projects within Abstract to keep shared, global and brand specific files separate. Our toolset allows design and dev teams to work seamlessly, as updates get pushed out and teams get larger.
Abstract
Version control of files; instant access to all design components
Sketch
Design tool to generate all source files and supporting assets
Zeplin
Markup tool to prepare and hand off files/components to dev team
Design System
Our comprehensive design library of shared components, guidelines and documentation allows design teams to leverage a "paint by numbers" approach, using the color and style overrides set in place.
Shared Account/Cart
Having a shared account and cart allows for a seamless experience across all brands. Login, site preferences, saved stores, favorite recipes/products are all accessible in one central location.
Account Flow
The site architecture was simplified down to two paths for accessing your account: signed in and not signed in.
MY STORE
The user has the ability to change and add to their list of "Stores". Once changed, real time updates of store availability and price will aggregate across the site.
Cart
The different types of products have been categorized into collapsable tabs. Similar to the recipe detail page, a user has the ability to swap out items for similar items, and to compare total cost with nearby stores. Once you click 'Proceed to Store', a user's cart items get added automatically to the selected grocery store's site.
My Store
The user has the ability to change and add to their list of "Stores". Once changed, real time updates of store availability and price will aggregate across the site.
Cart
The different types of products have been categorized into collapsable tabs. Similar to the recipe detail page, a user has the ability to swap out items for similar items, and to compare total cost with nearby stores. Once you click 'Proceed to Store', a user's cart items get added automatically to the selected grocery store's site.