B2C Ordering UX

A&I Photography

Transformed A&I's portfolio-style website into a stronger B2C ordering experience with online design tools, clearer product discovery, SEO cleanup, and measurable growth.

Shipped No live site
Up to 15,000 unique visitorsIncreased conversionsNew leads from new customers
A&I Photography website preview with online print ordering and design flow
Role Web Designer
Timeline Website redesign, online design flow, SEO, tracking, and optimization
Client A&I Photography
Tools Figma, Photoshop, HTML, CSS, Google Analytics, Google Tag Manager, Google Search Console, SEO Tools
Problem

A&I's previous website showed services but did not guide customers clearly toward ordering, uploading artwork, verifying designs, or completing a more self-service print workflow.

Outcome

The redesign created a clearer path from discovery to ordering, reduced manual intake friction, generated new leads, increased conversions, and helped traffic grow to up to 15,000 unique visitors by the fourth quarter.

Quick Context

A&I originally had a website that worked more like a digital portfolio and service overview. It showed what the business could offer, but it did not fully support how modern customers expect to order print products online.

The business goal was to move the website from a mostly informational experience into a more complete B2C ordering platform. Customers needed to be able to land on the website, find the product they wanted, design or upload artwork online, verify their design, place an order, and receive the finished product by mail.

This was not a full-scale UX product engagement from the beginning. It was a practical web redesign project with important UX/UI decisions layered into the work. The focus was on improving the customer journey, reducing manual friction, supporting print production requirements, and creating a stronger foundation for traffic, leads, and conversions.

The redesign became less about making the website look better and more about helping the business shift from a service-led process to a more self-service digital ordering experience.

A&I website strategy transformation from portfolio website to B2C ordering platform Website strategy transformation

Problems

The Website Was Not Designed for Conversion

The original A&I website helped customers understand the company’s work, but it did not guide them clearly toward placing an order. The experience was closer to a portfolio or service page, which meant the user journey often stopped before a transaction could happen.

Customers could view services, but the path from interest to action was not strong enough. For a B2C print experience, this created a gap between customer intent and business value.

A customer might arrive on the site ready to order, but still need help understanding what to do next, what product to choose, how to prepare artwork, or how to submit their design correctly.

Customers Needed an Easier Way to Design and Submit Files

One of the biggest challenges was creating an easier front-end experience for customers while still protecting the production workflow behind the scenes.

Print ordering is not only about choosing a product and clicking checkout. The final file needs to meet specific prepress requirements so it can be properly queued for printing. If the customer submits artwork incorrectly, the business may need to follow up, request revisions, fix files manually, or delay production.

The redesign needed to balance two different needs:

  • Customers needed a simple and friendly online design experience.
  • The production team needed usable final files that could move into the printer queue with fewer issues.

This made the online design flow an important part of the project. The website needed to let customers upload artwork, create new designs, edit existing designs, use templates, and verify their work before ordering.

Customer Service Was Spending Too Much Time at the Beginning of the Process

Existing customers were used to contacting customer service representatives early in the order process. While this worked for a traditional service model, it created unnecessary friction as the business moved toward online ordering.

The goal was not to remove customer service from the experience. The goal was to shift customer service toward higher-value support.

Instead of helping customers start every order manually, the website needed to guide customers through the beginning of the process on their own. That would allow customer service reps to focus on order quality, production support, issue resolution, and the end flow of the customer experience.

A&I customer service friction map showing manual order intake and opportunities for self-service ordering Customer service friction map

The Business Needed More Traffic, Leads, and Measurable Growth

The previous website did not give the business enough insight into how users were discovering the site, where they were dropping off, or what actions were leading to conversions.

Without strong tracking in place, it was difficult to know which marketing efforts were working, which pages were performing, and which parts of the experience needed improvement.

The redesign needed to support a stronger marketing foundation through SEO updates, analytics, Google Tag Manager, Search Console, and other tracking tools. This would allow the team to measure user behavior, monitor performance, and make better decisions after launch.

Decisions

Treat the Redesign as a Shift in Business Behavior

The first major decision was to frame the project as more than a visual refresh. The website needed to support a larger business transition from a portfolio-style service website into a B2C ordering platform.

That meant the design work had to focus on customer behavior, not just layout and colors.

The key question became: how do we help customers move from browsing to ordering with less manual support?

This helped shape the direction of the redesign. Every major decision needed to support product discovery, online design, file verification, order confidence, and conversion.

Start With Stakeholder Notes and Business Requirements

Because print production has real operational requirements, the redesign could not be based only on visual preference. Stakeholder input was important during the first phase.

The early discovery work focused on understanding what products customers needed to find quickly, what information customers needed before ordering, where customers usually needed help, what file requirements mattered for production, where customer service was spending too much time, what colors and visual direction better represented the updated brand, and what the future ordering flow needed to become.

Review Competitors to Understand Expected B2C Print Patterns

Competitor analysis helped identify what customers already expected from online print ordering experiences.

The review focused on common patterns such as product category navigation, template-based design tools, upload-your-own-artwork flows, online proofing and verification steps, clear calls to action, simplified checkout paths, trust signals, and customer education around print files.

The goal was not to copy larger online print platforms. The goal was to understand which patterns made customers feel confident enough to complete an order online.

Map a Clearer Customer Ordering Flow

The redesigned experience needed to support a more complete customer journey:

  • Customer lands on the website.
  • Customer finds the product they want.
  • Customer reviews product information.
  • Customer starts the design process.
  • Customer uploads artwork or uses a template.
  • Customer edits and verifies the design.
  • Customer places the order.
  • A&I receives production-ready information.
  • The product is printed and mailed.

This flow became the foundation for the redesign. It helped connect the marketing side of the website with the production side of the business.

A&I customer ordering flow from product discovery to online design, verification, order, printing, and mailing Customer ordering flow

Create Low-Fidelity Wireframes Before Implementation

Low-fidelity wireframes helped explore the layout and page logic before investing too heavily in the final visual design.

The wireframes focused on homepage structure, product discovery paths, service and product page layouts, online design entry points, calls to action, customer guidance sections, trust-building content, and support placement.

This helped reduce uncertainty before implementation and made it easier to align the website structure with the business goals.

Implement the Online Design System in Phases

The second phase focused on adding online design functionality.

This was one of the most important improvements because it gave customers a practical way to prepare their order online. The system allowed users to upload their own designs, edit artwork, create new designs from templates, and move closer to order completion without needing customer service to start the process for them.

This decision supported two major goals: it improved customer convenience by giving users more control, and it reduced manual intake work by giving customer service and production teams a cleaner starting point.

A&I online design tool feature map showing upload, edit, templates, proofing, and order preparation features Online design tool feature map

Clean Up Bugs, Improve SEO, and Add Measurement Tools

The third phase focused on optimization and measurement.

This included bug cleanup, SEO updates, Google Analytics, Google Tag Manager, Search Console, and other SEO tools. These tools helped turn the redesigned website into a measurable growth platform.

The goal was to understand where traffic was coming from, which pages were attracting users, how customers were moving through the website, where users were engaging, which actions were leading toward conversion, and what SEO improvements were helping visibility.

Result

The redesigned A&I website helped transform the business from a mostly portfolio-style web presence into a stronger B2C ordering experience.

Customers had a clearer path from discovery to action. Instead of only learning about the company’s services, they could begin the process of selecting a product, designing online, verifying their design, and placing an order.

The online design system helped reduce friction for both new and existing customers. Existing customers could begin placing orders with less dependency on customer service, while customer service reps could spend more time supporting the end flow of the process instead of manually guiding the beginning of every order.

The business also saw major performance improvements after the redesign and marketing push.

In the first quarter, website traffic was roughly between 150 and 200 unique visitors. By the fourth quarter, traffic reached up to 15,000 unique visitors.

That represented a major increase in visibility and demand. The website also generated more conversions and new leads from new customers, giving A&I a stronger digital channel for growth.

A&I results dashboard showing traffic growth, increased conversions, new leads, and ordering friction reduction Results dashboard overview

Key outcomes included:

  • Increased conversions.
  • New leads from new customers.
  • Significant growth in unique visitors.
  • Reduced ordering friction for existing customers.
  • Less pressure on customer service during the beginning of the order process.
  • A clearer self-service path for online print ordering.
  • A stronger SEO and analytics foundation.
  • Better visibility into website performance and marketing impact.

The strongest result was not only the traffic growth. It was the change in how the website supported the business. A&I now had a platform that could help customers take action online, while giving the internal team a cleaner and more scalable process.

Reflections

This project showed me that even a simple website redesign can have a major business impact when the design is connected to customer behavior and operational needs.

The work was not about creating a complex UX case study with every possible research method. It was about identifying the most important friction points and improving the parts of the experience that directly affected the customer journey.

One of the biggest lessons was the importance of balancing simplicity with production requirements. Customers want an easy ordering experience, but print businesses still need accurate files, clear design verification, and reliable handoff to production.

I also learned how important it is to design for both new and existing customers. New customers needed clarity, trust, and an easy way to start. Existing customers needed a smoother way to complete familiar tasks without relying on customer service every time.

For future projects, I would continue to push for earlier tracking setup, clearer baseline metrics, and more structured post-launch testing. The performance growth showed the value of redesigning with measurement in mind, but having even more data from the beginning would make it easier to identify which design and marketing decisions had the strongest impact.

Overall, the A&I redesign was a strong example of how a practical web design project can evolve into a meaningful digital transformation. By improving the website structure, adding online design tools, cleaning up SEO, and measuring performance, the project helped A&I move closer to a true self-service B2C print ordering experience.