The Shop
During my time at FordDirect, I had the exciting opportunity to work on their newest e-commerce venture: The Shop. Built on Shopify, it’s a marketplace dedicated to offering partnered services to Ford and Lincoln Dealers. I took the wheel on content management and led the design and development of all the landing and product pages.
The Problem
FordDirect needed to expand their portfolio of 3rd-party services. Dealerships were increasingly frustrated by having to juggle multiple different websites just to find the specific tools and solutions they needed for their business. To solve this primary pain point, the goal was to create a centralized, one-stop-shop website where dealers could easily discover and manage all the services they need to run their daily operations smoothly.
Solution
The answer was a highly customized Shopify marketplace designed to make discovering and signing up for services an absolute breeze. By utilizing custom product templates, advanced dynamic content tailored to specific Ford and Lincoln dealerships, and a beautifully clean UI, we delivered a highly scalable platform. Not only did it solve the immediate need, but the polished site actually sparked more interest from external companies wanting to partner with FordDirect, organically expanding the solutions offered to dealers!
Research
Services Marketplace
FordDirect already partnered with numerous companies, but they were ready to scale up. To do this, they needed a true digital marketplace. I kicked off the research phase by analyzing top-tier online marketplaces to see what made them tick—and what we could borrow for our own platform.
Etsy
A masterclass in handling a massive vendor ecosystem. Their vendor sign-up process and product pages are brilliantly simple, though they cater to physical goods rather than B2B services.
Amazon
The king of seamless customer experiences. Their product pages offer a consistent layout while still allowing sellers to customize specific elements—exactly what FordDirect was looking for.
Shopify
We explored Shopify as our potential foundation. The ability to quickly spin up and customize various landing and product page templates was a massive selling point, and we found plenty of successful service-based stores using it.
Salesforce
Since FordDirect already utilized Salesforce elsewhere, it was on the table. However, it lacked the out-of-the-box marketplace features we needed and would have required significantly more custom development time.
Key Site Requirements
- Typography & Colors
The marketplace needed to feel like a natural extension of FordDirect. The styling had to complement the main FordDirect site while establishing its own unique identity. - Product Pages & Vendors
The site needed to look cohesive, yet offer enough flexibility for vendors to customize their product pages. Since the services varied wildly, building multiple templated product pages was non-negotiable. - Platform and Connectivity
Given our timeline, building from scratch wasn’t feasible. We needed an established platform that was highly customizable, could handle a large roster of vendors, and could seamlessly integrate with FordDirect’s existing billing processes.
Responsibilities & Feature Roadmap
To accelerate the timeline, FordDirect brought in a partner agency to establish the base design and handle complex backend functionalities. This gave my team and me a fantastic head start. My core responsibility was to take the agency’s initial concepts and build out a robust design system, as well as design all the specific templates for product pages, landing pages, and future components.
Design
Wireframes
Once the agency provided the initial wireframes, I stepped in to review the overall layout and functionality against FordDirect’s business goals. We ironed out potential UX issues before the agency moved into final design and development. They set up our base Shopify DEV environment with the approved branding, which cleared the runway for me to focus on the various product and landing page templates.
Design System
To ensure consistency across the entire marketplace, I built a comprehensive design system encompassing typography, colors, buttons, carousels, content tiles, and global spacing rules. Since every vendor offered something different, I mapped out all the key information our partners needed to present to ensure the design system components could support every possible use case.
Customized Templates
Creating the Product Pages & More
With the design system locked in, I started wireframing the page templates. We launched with four distinct product templates to handle different types of services. I designed flexible elements like dropdown selectors, pricing tables, infographic blocks, and dynamic sections that could be toggled based on the vendor’s specific content. I also created variations for the Resources (blog) page to handle different types of media, alongside a dedicated directory page listing all active vendors.
AI & Vendor Pages
To speed up the development process, I took advantage of Shopify’s built-in AI tools to code missing structural components. For example, we realized some vendors offered multiple services and needed their own dedicated “Vendor Profile” pages featuring their bio, a list of their products, and related blog posts. Using Shopify’s AI, I was able to prompt the exact sections I needed, and within minutes, the base code was ready for me to plug in our dynamic content!
Testing & Tweaking
Testing the New Site
Before launch, I led hands-on testing sessions with the internal team to ensure a flawless user experience.
- Selecting collections and adding products to the cart to test the full checkout flow.
- Logging in with dealer credentials to verify that dynamic content was displaying correctly.
- Using the global search and product collection filters.
- Documenting any UI bugs or design inconsistencies.
The team completed all tasks and provided some crucial feedback that we quickly resolved before launch:
The Fixes: We added a “Product Proposition” option to the collection filters so users could sort by specific service benefits. We also tweaked the collection sorting logic to show the newest products first, and fixed a bug where dynamic content wasn’t properly hiding behind the dealer login wall on certain templates.
Final Design
