Website Redesign &
Shopify Development
Pipeline Games
I create intuitive, high-performing websites by combining user-centered design with front-end development. By approaching every project from both a designer's and developer's perspective, I create experiences that are cohesive, efficient, and built to support real business goals.
Strategy • UI Design • Front-End Development
Figma • Shopify • Liquid • HTML • CSS • JavaScript
My Contributions
Strategy
UX Strategy
Information Architecture
Design
Wireframes
High-Fidelity UI
Development
Front-End Development
Shopify Theme Customization
Liquid Custom Development
Optimization
Responsive Development
Quality Assurance
Overview
Pipeline Games had recently refreshed its brand but their existing Shopify website no longer reflected the new identity or supported an intuitive shopping experience. The goal was to redesign and rebuild the site while improving navigation, merchandising, and overall usability.
Working across strategy, UI design, and front-end development, I redesigned the website around the capabilities of the selected Shopify theme to create a solution that was both visually engaging and easy for the client to maintain long term.
The result was a modern ecommerce experience with improved information architecture, reusable product templates, custom Shopify functionality, and a scalable foundation that continues to support the business today.
Before & After
A complete redesign transformed an outdated ecommerce experience into a modern Shopify storefront with improved navigation, stronger merchandising, and a scalable foundation.
Original Website
Redesigned Website
Scroll to explore the full redesigned homepage
The Challenge
Existing Navigation
The original website contained a large number of products organized in a confusing navigation structure, making it difficult for customers to quickly find products.
Outdated Experience
The website no longer reflected the company's updated branding or provided the modern shopping experience expected from an ecommerce store.
Platform Constraints
The new website needed to work within an existing Shopify theme while minimizing long-term maintenance and future theme update conflicts.
Live Website Migration
Because the existing Shopify store remained active throughout development, all structural changes, collections, navigation, and launch planning had to be carefully managed without disrupting current customers.
My Approach
Discovery
I evaluated the existing website, analyzed the navigation, reviewed the client's new brand guidelines, and mapped a new information architecture focused on improving usability and product discovery while supporting business goals.
Design Strategy
Using the selected Shopify theme as a technical foundation, I created wireframes and high-fidelity designs in Figma that balanced visual improvements with scalable implementation and long-term maintainability.
Build & Refine
The new website was developed alongside the client's live Shopify store, requiring careful planning around navigation, collections, redirects, and launch activities. Custom Liquid functionality was added only where it provided meaningful value while keeping the solution easy to maintain.
Key Improvements
Improving Navigation
The original website's navigation had grown organically over time, making product discovery difficult.
Redesigned the information architecture and collection structure to simplify browsing while supporting future product growth.
Created a more intuitive shopping experience that improved usability and merchandising opportunities.
Flexible Product Templates
Each product required different specifications and supporting content.
Built a single reusable product template powered by Shopify metafields that dynamically displayed dimensions, specifications, downloadable PDFs, videos, and custom CTA buttons.
Reduced template maintenance while giving the client complete flexibility without requiring code changes.
Custom Lead Generation
The client wanted to collect emails before allowing visitors to download their merchandising guide.
Developed a custom download experience integrated with Constant Contact that remembered returning visitors using browser storage and reduced duplicate submissions.
Improved lead generation while creating a smoother user experience for returning customers.
Product Image Standardization
Hundreds of inconsistent product images disrupted the layout and product grid.
Standardized every product image to a consistent square aspect ratio and updated the Shopify catalog.
Created a more cohesive shopping experience while improving product presentation and overall visual consistency.
Project Gallery
Project Impact
User Experience
Simplified navigation
Improved product discovery
Updated consistent design
Technical Improvements
Reusable product templates
Dynamic metafield-driven content
Easier long-term maintenance
Business Value
Improved online purchase experience
Better lead generation
Scalable Shopify architecture
Ready to Bring Your Next Project to Life?
Whether you're starting a project from scratch or looking for someone to join an existing team, I'd love to hear how I can help.
[email protected]
Next Case Study
Website Rebuild & Shopify Development
TerraBoard
Rebuilt TerraBoard's Shopify website from approved Figma designs while collaborating with the design team to maximize the capabilities of the existing platform. The project focused on creating reusable templates, responsive layouts, and a scalable website architecture that simplified long-term maintenance.