True before pretty: redesigning the Royal Subz storefront
Before the new design could ship, every claim on the old one had to be true. How a twelve-phase storefront redesign rewrote 313 sentences, removed placeholder ratings, and still came out slower on one page.
I started the Royal Subz redesign the way I’d start any product review: by comparing the storefront with the sites customers compare it with. GamsGo, AppSumo, G2A, Eneba and Kinguin, side by side with royalsubz.com, ending in twelve changes ranked by impact.
Most of them sounded like design work. A product page where everything needed to decide fits on one phone screen. Two products per row in the catalogue. A sticky Buy Now. A clearer guarantee.
Underneath almost every one sat a less comfortable finding. The old site said things that weren’t true, and a new design would only have said them more convincingly.
So the plan had twelve phases, from 0 to 11, and the first one didn’t change a single pixel.
The first phase changed no pixels
Phase 0 built a facts file. Delivery time, the guarantee, support hours, customer and country counts, the minimum saving worth showing: every number and promise the site makes lives in one file, and the site’s own sentences that mention one are built from it. A test checks that the refund window in the copy can’t drift from the refund policy’s own text.
Then I went looking for everything the facts file contradicted.
The old site said
The new site says
-
Delivered within 15 minutes
Product copy on 53 products
Most orders are delivered within 4–5 hours
-
7-day refund policy
Product copy on 52 products
Delivered within 48 hours or a full refund
-
3,189 reviews
Placeholder rating sent to Google, against 211 customers
No rating anywhere until real reviews exist
-
24/7 support
Homepage and FAQ
10:30 AM – 2:30 AM (GMT+6), instant replies in those hours
-
1000+ satisfied customers
Trust tiles on every product page
200+ customers in 20+ countries
-
Save 40%
Canva, from a stored discount column
Save 73%, computed from the two prices
The product copy was the worst of it. The promises lived in the database, inside each product’s description, so I wrote one script that held the rewrite rules and generated both the migration and a preview of every changed sentence for me to review. It touched 55 products, 159 fields and 313 sentences.
The first run missed most of what it was looking for. The claim was usually wrapped in bold, as in “about 15 minutes”, or started with a capital, as in “Our 7-day refund policy”. A verify step that re-ran the search after the rewrite found 43 and then 21 leftovers before the patterns were right. It also caught a rule that was too broad: matching every “minutes” would have rewritten ElevenLabs’ “about 121 minutes of audio”, which is a usage allowance, not a delivery time.
The placeholder ratings were the claim that bothered me most. Products carried a rating and a review count that had never been real: Adobe showed “3,189 reviews” against 211 customers. They weren’t displayed on the page, but they were sent to Google as structured data. They’re gone, and no rating appears anywhere until real, verified reviews exist.
Trustpilot had already flagged the custom banner and review section I’d built from its data. Both were deleted. The storefront now has a plain text link, “Read our reviews on Trustpilot”, with no stars and no score I’ve drawn myself. Trustpilot’s own review collector appears only in the client area, to customers whose order has been delivered.
Savings got the same treatment. The stored discount columns disagreed with the prices they described, so savings are now computed from the price and the official price, rounded down so they’re never overstated, and shown only when they reach 5%. A monthly figure is never shown, because some products are only sold yearly, and “per month” would imply a monthly plan that doesn’t exist.
Words that had to be exact
Some of the most useful decisions in the project were about single words.
Products, never tools. “Tools sounds cheap” was the whole argument, and it was right. Every customer-facing line changed. Page titles and search descriptions waited for a separate decision, because changing them changes what Google shows.
“Private to you”, not “on your own account”. The first headline draft promised subscriptions “on your own account”. For products we deliver as login details, that isn’t true; the customer gets a private login, not their own account. The final headline is: ChatGPT, Claude, Netflix and 50+ premium subscriptions, private to you, for less.
“No international card needed” is true in Bangladesh, where customers pay with bKash, Nagad or a local card. Abroad, paying by card through the local gateway needs an international card. Visitors served in taka now read one version of the payment copy, and everyone else reads another.
The guarantee got a name, too. It started as the Royal Promise and became the Royal Commitment: delivered within 48 hours or a full refund. Most orders arrive in 4–5 hours, but some vendors are slow, so the promise stays at the number I can keep every time, not the one that sounds best.
A design built from the logo
The new palette comes from the two blues already in the logo, so coral, mint and teal are gone. Green appears only for savings and success. The typeface is Plus Jakarta Sans, self-hosted and preloaded.
None of the candidate fonts contains the taka sign, ৳. On a store where most prices start with it, that matters. It now comes from a 4 KB subset of Noto Sans Bengali, declared with a unicode-range so the browser downloads it only on pages where ৳ appears.
The most valuable design feedback came from looking, not from any rule. A small line icon in a pale rounded square at the top of a card reads as a template, so those are gone. Icons stay only where they carry meaning, such as a clock beside “4–5 hours” or the WhatsApp mark on its button. Steps are numbered instead. Sold out is neutral grey with a strikethrough, never red, because an unavailable plan isn’t an error. And the main button carries no icon at all: Buy Now doesn’t need a lightning bolt to be the most obvious thing on the screen.
Glass is used sparingly: the navigation bar, the desktop buy box and the phone’s sticky bar. Each one falls back to a solid surface where the browser can’t blur, and wherever a visitor has asked for less transparency.
The first phone screen decides
The product page came first, because it’s where people decide. On a 390 × 844 phone, without scrolling, a visitor now sees the product name, the price, the saving, the versions and periods, Buy Now and Add to Cart, the guarantee, the delivery time and the payment logos.
The old page had trust tiles at the bottom: “Instant Delivery”, “Average: 15 minutes”, “1000+ satisfied customers”, each with an emoji. They contradicted the guarantee three tiles away, so they’re gone.
Each product can now record how it’s delivered: an invite to the customer’s own account, an upgrade on it, login details, or a code. The page shows three matching steps under “How you’ll receive it”. When the method isn’t set, it shows nothing. It never guesses.
A phone sticky bar with the price and Buy Now appears only once the buy box has scrolled away. The plan said “visible from the start”, but Buy Now is already on the first screen, and a second copy would have covered the guarantee beneath it.
Where money moves, only the paint changes
Checkout, the payment dialogs, the invoice page and the gateway return pages were restyled under one rule: visual change only. A line-by-line diff of the checkout showed the new markup touched nothing but two imports in the nearly 700 lines of logic above it.
That rule had one cost. EPS accepts only royalsubz.com as a return address, so a real payment through it can’t be tested from a development machine at all. It was tested on the live site, with a small real payment, as soon as the new build was up.
The client area changed more. “Payments” and “Invoices” were two lists of the same money, so a paid invoice appeared twice under two names. They’re now one section, Orders & Billing: what needs your action first, then one row per order with one status. No query changed underneath.
The redesign also surfaced an old bug. The invoice page said “Payment link not found” for any failure, including a timeout and a rate limit. A customer could be told their invoice didn’t exist when it was simply busy. Now only a genuine not-found says so.
Nothing Google reads changes
The blog brings most of the organic visitors, so its rule was strict: URLs, titles, structured data, headings and their levels, every word and every link stay the same. I compared the old and new versions of a post as rendered pages. Both had the same headings, the same links and the same 16,272 characters of text. The old design is still one config value away, so it can be restored with a single deploy.
One sentence in one post did change at launch. It promised delivery within 15 minutes and a 7-day refund, and correcting it was the point of the whole project.
The same comparison found the catalogue had two H1s, one for phones and one for desktop, each hidden by CSS on the other width. It has one now.
Launch, and the number that got worse
Phases 1 to 10 were built and reviewed on localhost and on my phone over the local network, with no preview domain. Everything shipped in one launch.
The last check before launch found one more problem. The build tool inlines any image under 4 KB as text inside the JavaScript that imports it. The footer imports the payment logos, so ten of them, 39 KB of base64 that compression can’t shrink, were sitting in the script every visitor downloads before the first paint. Excluding that folder brought the up-front download from 276 KB back to 243 KB, against 235 KB for the old site.
On a desktop, with both builds measured on the same machine, the Lighthouse score went up on every page I tested and nothing got worse beyond run-to-run noise. Phones were the real test, and I measured those on the live site before and after launch, under the same settings.
Largest Contentful Paint on a phone, before and after launch
Live site, Lighthouse mobile defaults, median of three runs. Lower is faster.
Home · 2.9 s faster : before 8.7 s, after 5.8 s
Products · 0.3 s slower : before 5.5 s, after 5.8 s
Product page · 1.1 s slower : before 5.3 s, after 6.4 s
Blog post · 0.2 s slower : before 6.0 s, after 6.2 s
All the numbers
| Page | Score | LCP | First paint | CLS | TBT |
|---|---|---|---|---|---|
| Home | 55 → 52 | 8.7 → 5.8 s | 7.5 → 3.4 s | 0.007 → 0 | 188 → 551 ms |
| Products | 54 → 49 | 5.5 → 5.8 s | 3.5 → 3.5 s | 0.007 → 0 | 451 → 529 ms |
| Product page | 57 → 54 | 5.3 → 6.4 s | 3.5 → 3.4 s | 0.007 → 0 | 368 → 389 ms |
| Blog post | 49 → 50 | 6.0 → 6.2 s | 3.3 → 3.4 s | 0.108 → 0 | 430 → 557 ms |
The homepage’s largest paint arrived almost three seconds sooner, and layout shift disappeared on every page. The product page got worse: its largest element is now the guarantee line inside the buy box, and on Lighthouse’s slowed phone CPU it waits on more JavaScript than before. Blocking time went up on every page for the same reason.
I kept the redesign live. Rolling back would have undone the homepage gain too, and the cause is specific enough to fix. It’s the first item on the next list.
The first fix after launch came from a phone, not a report. Tapping the search box zoomed the page in and left it zoomed. iOS Safari zooms into any field whose text is smaller than 16 px; the search fields were 14 and 15. Both are 16 now. I didn’t block zooming instead, because that would also stop people who zoom on purpose.
True before pretty
The visible change is indigo, a new typeface and a product page that fits on a phone. The work that mattered more is invisible: one file that every promise is built from, 313 sentences that no longer contradict it, no rating Google can see until there are real ones, and a number in the launch report that’s worse and stays in the report.
A redesign makes a site more persuasive. That’s only worth doing once what it says is true.