002 Strikeman · Shopify website

Designing a clearer path from product discovery to checkout

A mobile-first redesign that helps customers understand dry-fire training, choose the right kit, and continue through checkout with more confidence.

Ongoing product work

Strikeman target, phone mount, laser cartridge, and training kit
Role
UX/UI Lead Designer
Scope
Research, information architecture, product flows, responsive UI, and implementation support
Platform
Shopify · Mobile web
Status
Ongoing redesign and measurement
01 · Overview

The website and product form one customer journey

The website creates the promise. The product experience must deliver confidence after purchase.

Customers first need to understand what dry-fire training is and whether Strikeman fits their firearm. From there, the experience has to support product selection, a confident purchase, clear setup, and a successful first training session. I treated those moments as one connected journey instead of separate website and app tasks.

01Improve purchase confidence

Reduce friction across product education, cart, setup, and onboarding.

02Reduce rework

Define flows, states, and edge cases before development locks decisions in.

03Clarify product value

Help customers understand the value before and after purchase.

04Measure impact

Connect design work to conversion, checkout, activation, and retention.

02 · Role and scope

From UX strategy through implementation

I support Strikeman from early problem definition through development review. That includes research and user problems, business goals, information architecture, screen hierarchy, product education, responsive behavior, detailed specifications, edge cases, QA, and iteration during implementation.

  • 01Strategy and researchConnect customer problems, product logic, and business goals.
  • 02Architecture and flowsDefine navigation, screen hierarchy, product states, and decision points.
  • 03UI and implementationCreate responsive screens, development-ready specifications, and QA feedback.
03 · Mobile homepage

Lead with a clearer product story

The redesigned homepage explains the system sooner and gives customers clearer paths to the Standard Kit, setup guidance, and product comparison.

The earlier experience used long promotional sections and competing calls to action. The redesign establishes a more direct value proposition, introduces the physical kit early, explains how the system works, and helps customers check compatibility or compare kits before committing.

Before

Promotional content competed with product education.

After

A connected path from value proposition to education and comparison.

04 · Product page

Answer purchase questions before the cart

New buyers needed clearer education, compatibility guidance, and kit information at the point of decision.

The product page brings the kit, price, review signal, caliber selection, guarantee, and primary action into a more readable sequence. Supporting content explains what comes with the product and how training works without pulling customers away from the purchase path.

Before

Product information and actions were spread through a long mobile page.

After

Purchase information stays organized around the decision and follows the customer while scrolling.

5.74% → 7.2%

Add-to-cart rate after clearer education, compatibility information, and kit comparison.

05 · Checkout cart

Protect momentum at the closest point to purchase

Research showed that customers could understand the product and still hesitate because of price, discount clarity, or a need for reassurance.

The new drawer makes the order easier to scan, keeps the promotion field visible, places assurance copy near checkout, and recommends relevant additions under “Complete your setup.” The recommendations support readiness while also creating an opportunity to increase average order value.

BeforeEarlier cart drawer
Earlier Strikeman cart drawer
AfterCollapsed order summary
Redesigned Strikeman cart drawer with recommendations and collapsed order summary
AfterExpanded order summary
Redesigned Strikeman cart drawer with promotion field and expanded order summary
  • 01Compact order reviewKeep the selected product, quantity, and total easy to scan.
  • 02Visible promotion pathLet customers enter a discount code without hunting for it.
  • 03Purchase reassurancePlace the guarantee, secure checkout, and included app near the call to action.
  • 04Setup recommendationsSuggest additions that help customers complete their training setup.
06 · Evidence and impact

Early results show stronger purchase momentum

18mobile participants tested the website
72.2%success on the add-to-cart usability task
+4.6 ptsincrease in cart-to-checkout rate, from 69.3% to 73.9%

Four of the 18 mobile participants abandoned the tested flow. That result showed that the cart path worked, but customers still needed more confidence near purchase. After the cart redesign, the share of customers continuing from cart to checkout increased from 69.3% to 73.9%.

07 · Next measurements

Measure where hesitation affects revenue

The next measurement phase will compare before-and-after sessions as the new Shopify analytics window becomes available. The focus includes conversion, average order value, recommendation quick-adds, promotion errors, and mobile checkout completion.

The Shopify theme keeps the native product-form and cart-add path, so standard add-to-cart analytics remain available. Recommendation quick-adds use a custom drawer event for more specific tracking.

Conversion rateAverage order valueCompleted checkoutRecommendation quick-addsPromotion errorsMobile completion