Attackletics build a smart batting tee and a coaching app for baseball and softball hitters. Both were finished. The storefront selling them was a stock theme that gave no hint of either.
Attackletics build a smart batting tee and a coaching app for baseball and softball hitters, from youth players up to professionals. The hardware was finished. The app was finished. The brand also had a firm idea of how it should look: Japanese retro-cyberpunk, neon and scanlines and chromatic edges. Everything that usually holds a young product company back was already sorted.
The storefront had not caught up. It ran a stock theme that sold the tee the way it would sell a garden hose. A visitor could not tell that the app existed, or that the people behind the product play the game. The gap between what the company had built and what the shop said about it was costing sales daily.
The obvious route was to export the look as artwork and drop the images into the pages. That buys the identity back and makes every phone pay for it in load time. These buyers shop on phones. A store that arrives slowly loses them before the argument for the product has even started.
We decided the product page would lead with the tee and the app working together, then the drill library, then the price. A batting tee is bought by a parent or a coach, and what they are weighing is whether a teenager will still be using it in March. The aesthetic would sit around that argument, never on top of it.
We chose to have the identity drawn by the browser rather than downloaded. The neon, the scanlines and the chromatic edges are effects the device renders, so the look arrives with the page instead of arriving after it. That single decision set the weight budget for everything else on the store.
The app is the reason the tee is worth more than a tee, so we planned to sell the two on one screen. Plans, sensors and the drills a hitter gets would be presented beside the hardware as a single purchase decision. Buyers who can see what they are getting tend to buy the version with more in it.
Hierarchy does the selling. The tee and the app lead, the drill library follows, and the price sits below the reason to want it. What a stock theme adds by default and nobody reads was taken out: the rotating banner, the row of trust badges, the repeated newsletter prompt. What is left is the argument, in order, with the neon around the edge of it.
On a phone the effects step back so the content can lead. Contrast is spent where a decision actually gets made: price, size, add to cart. Tap targets are large enough to use one-handed, and the drill list collapses to something a thumb can move through. The look survives the small screen because it is not the thing doing the work.
assets/img/cases/attackletics-retro-cyberpunk-store-design.jpgThe neon and scanlines are rendered by the browser, so the brand arrives with the page rather than a few seconds behind it.
The app is why the tee is worth what it is worth, so plans and drills sit next to the tee rather than in an upsell after it.
Neon everywhere would bury the price and the size selector, so the strongest contrast on the page is reserved for those.
Parents are weighing whether a teenager will still use the tee in March, so the argument for that comes before the price.
The store runs on Shopify with a custom Liquid theme. The neon, the scanlines and the chromatic edges are effects the device renders, which keeps the identity out of the image weight entirely. On a mid-range handset the store opens like a plain one. Product media is sized per device, and nothing above the fold loads that the page does not use.
One thing we got wrong. We argued for turning the intensity down, expecting bright neon on a small screen to cost sales. The founder held the line and was right — the look is why the brand gets remembered. We kept it in full and protected the metric elsewhere, by giving prices, sizes and buttons the strongest contrast on the page.
GA4 and Hotjar were wired in from launch, so the effect of the aesthetic could be watched rather than argued about. Klaviyo handles the post-purchase side, where the app matters most: a hitter who has started the drills is the buyer most likely to return for accessories. Session recordings settled layout questions that opinion could not.
assets/img/cases/attackletics-retro-cyberpunk-store-build.jpgThe parts of the build a visitor would point at.
The neon and scanline identity is rendered on the device, so the brand costs nothing in download weight and arrives with the page.
Hardware, plans and the drill library are presented as one purchase decision, so buyers can see what the fuller version actually gives them.
Media is sized for the device asking for it, so the store opens quickly on the handsets these buyers actually own.
The aesthetic stops at the point of payment, where clarity converts better than atmosphere and every field stays easy to read.
The look gives the brand something to post, so traffic arrives from recommendation as well as from advertising.
GA4 and Hotjar were live on day one, so layout changes are decided from recorded behaviour rather than from opinion.
What the work changed, in the numbers the client reports.
Sales doubled. That is a 2× lift with no change to the hardware, the app or the price. The store now says in the first seconds what the product has always been, and it says it to people who play the game. What changed is how many buyers got far enough to see it properly.
Average order value is up 35%. That figure is the app and the accessories being sold as part of the same decision rather than as an upsell after it. Each order now carries more of what the company actually makes, which is the cheapest kind of growth available to a hardware brand.
The look also gave the brand something to post with. A store people screenshot is a cheaper store to send traffic to, because part of the reach arrives without being bought. That was never written into the brief, and it is the outcome the founder mentions first.
Live, and running the business it was built for.
The store is live and trading. The tee and the app are sold together on one page, the neon is rendered rather than downloaded, and a mid-range handset opens the whole thing without waiting. The identity a stock theme had been hiding is now the first thing a visitor meets.
Visit the live siteThey pushed back on the design once, we said no, and they built it anyway without slowing the site down. That is rarer than it sounds.
— Founder, Attackletics
What it is built on, and what it talks to.
Other projects where we named the number before we started.
Vision and swing trainers that make no sense in a photograph. Moved out of a coaching site and onto a storefront built around the demonstration.
An established Amazon seller with no channel of its own. Catalogue ported across, two markets configured, and a storefront designed to convert rather than list.
Bean-to-bar and nut-butter machinery sold in over a hundred countries. A deep technical catalogue, restructured around batch size and the stage a maker is stuck at.
Send the metric that is stuck and we will tell you honestly whether we agree.