Fulton Bags- Website Redesign + E-commerce integration
OVERVIEW
The Fulton Bags E-commerce Integration project focused on seamlessly integrating e-commerce functionality into the existing website, transforming it into a fully functional online store. The project aimed to enhance the shopping experience by implementing secure payment options, product recommendations, and an easy-to-use checkout process.
MY ROLE
Research, Competitive Analysis, Visual Design, Prototyping, User Flow Mapping, E-commerce Feature Integration, Wireframing, Customer Journey Mapping
TIMEFRAME
16 Weeks
TOOLS
Figma, FigJam, Miro, Zoom
THE CHALLENGE
A key challenge in the Fulton Bags E-commerce Integration project was making sure the new shopping features worked smoothly with the existing website. I had to ensure that secure payment options, product recommendations, and checkout processes were easy to use.
PROJECT GOAL
The goal of the Fulton Bags E-commerce Integration project was to add e-commerce features to the existing website, allowing customers to easily browse, purchase products, and enjoy a smooth online shopping experience. This included integrating secure payment options, product recommendations, and a streamlined checkout process.
DESIGN PROCESS
RESEARCH:
Website- Fulton Bags Co.
Research Overview
Fulton Bag Co. specializes in insulated lunch bags, coolers, and multipurpose diaper bags, designed to be both functional and stylish.
Brand Perception
Fulton Bag Co. generally enjoys a positive brand perception
Positive reviews for responsive, helpful customer service, some complaints about delays
Zippers wearing out, strap rips, the bag size being smaller than expected
Overall Ratings (1-10): 7, as most are satisfied
Affordable for the quality, durability, insulation, functionality
Mild, mostly connected to the brand’s reliability and everyday practicality. Customers return to this product due to the quality and functionality
Competitive Analysis
To understand the market positioning of Fulton Bags, I conducted a competitive analysis comparing key players like Bentgo and The Somewhere Co. The analysis focused on target users, design approach, pricing, materials, and unique features. Fulton Bags stands out for its affordability and functional design, using sustainable materials. This insight helped identify opportunities for e-commerce integration.
SWOT Analysis
To better understand the website, we performed a SWOT analysis, which provided the following insights.
SITE MAP
I created a site map to visualize the structure and organization of the new website design, showcasing its interconnected features and pages. This was essential for planning navigation, defining page relationships, and ensuring a seamless shopping and browsing experience.
INTRODUCTION OF INNOVATIVE FEATURE
With a limited product line on the website and a need to boost sales, I introduced a new feature: "SmartPack Assistant."
SmartPack Assistant will be Personalized
SmartPack Assistant feature, Dynamic list of curated snack recommendations, and Snacks that fit well in a Fulton Lunch bag.
How might we showcase the SmartPack Assistant as a way to simplify snack planning while emphasizing Fulton lunch bags as the perfect companion for organized and stylish snacking?
USER FLOW OF THE FEATURE
I designed the user flow to visualize navigation, map the user journey, and identify friction points, ensuring a seamless and engaging experience.
View User Flow
MID-FIDELITY WIREFRAMES AND USER TESTING
Mid-fidelity Wireframes
I created a site map to visualize the structure and organization of the new website design, showcasing its interconnected features and pages. This was essential for planning navigation, defining page relationships, and ensuring a seamless shopping and browsing experience.
User Testings
User testing showed that the snack selection feature was easy to navigate, with accessible options. I took 5 interview and got this insights:
Users found adding and removing items simple but faced minor confusion with storage guidance. Insights from testing helped refine clarity for a better experience.
Style Guide
DESIGN OUTCOMES
A. Integration of e-Commerce Platform
Detailed product descriptions with larger images.
Easier comparison of products in separate tabs.
More refined search options for efficient browsing.
Allows review of orders before purchase.
View Prototype
B. Mobile Version
Smooth navigation with a touch-friendly UI.
One-tap checkout for faster transactions.
Scroll-friendly layout with easy filtering.
Integrated Snack Selector for on-the-go shopping.
View Prototype
C. Innovative Feature
Suggests bags based on trip type, duration, and needs.
Recommends travel-friendly snacks alongside bag purchases.
Personalized bag and snack pairings based on user preferences.
View Prototype
Key Takeaways
User Flow Mapping streamlined navigation for a seamless shopping experience.
Responsive Design optimized usability for both mobile and desktop.
User Testing refined the design based on real feedback.
Interactive Features like the snack selector boosted engagement.
Seamless Checkout improved trust and transaction speed.
Clear UI Hierarchy enhanced product discovery and navigation.