← ALL WORK CASE STUDY 05 / 18

Arrakon.

CLIENT
Arrakon
INDUSTRY
Consumer electronics & IT retail
WHAT WE DID
UX & UI design, custom WooCommerce theme & block development, PC-builder tool, catalog setup
PLATFORM
WordPress + WooCommerce (custom theme)
YEAR
2025–2026

( THE BRIEF )

The challenge

Bangladeshi tech buyers are wary of grey-market stock and slow delivery, and they compare prices across many shops before they buy. A retailer that does not prove it is genuine within the first few seconds loses the sale to the next tab.

Arrakon needed a store that signalled genuine stock and honest pricing straight away, handled a catalog of 60+ categories, supported the payment methods local customers actually use, and served both individual buyers and corporate procurement.

Local payment habits matter here. Many shoppers in Bangladesh prefer mobile wallets such as bKash or cash on delivery over cards, so a store that hides or omits those options turns away a large share of ready buyers.

The client

Arrakon sells laptops, PC components, networking gear, printers, scanners and accessories from its counter at IDB Bhaban, Agargaon, Dhaka. It offers same-day dispatch, invoiced orders, a 7-day replacement policy, corporate bulk supply, and bKash or cash-on-delivery payment across Bangladesh.

This electronics e-commerce website case study from Bangladesh shows how Xenishio Arc built Arrakon a custom WooCommerce theme, a block plugin and an interactive PC builder.

What we built

We built a custom WooCommerce theme designed around inventory and trust. A top bar shows live stock and free-delivery terms, the header has a prominent product search with a ⌘K shortcut, and a departments menu sits alongside quick links to the PC builder, deals and corporate quotes. Search comes first because tech buyers usually arrive knowing the exact model they want.

The homepage pairs a campaign hero with trust badges (same-day dispatch, invoiced orders, 7-day replacement, corporate supply, bKash/COD), followed by category tiles, a price-drop spotlight, featured deals, "Popular right now" and "Trending this week" rails, curated collections (desk setup, power & charging, connect & network), brand browsing, staff-written buying guides and a newsletter sign-up.

The standout feature is a 10-step PC builder that checks socket, memory type, physical clearance and power draw as the customer picks parts, with a live build summary, estimated wattage and PSU recommendation. Incompatible parts are a common and costly mistake for first-time builders; checking them during selection prevents returns and support calls before they happen.

A companion "Build your own combo" tool, a corporate and bulk-order page, and complete shipping, returns and FAQ pages round out the store.

( THE SITE, PAGE BY PAGE )

Scroll through it.

Hover to auto-scroll · scroll inside the frame

Home page of arrakon.com, full-page screenshot
arrakon.com on a phone
On a phone
Visit the live site

( WHAT WENT INTO IT )

Inside the WooCommerce electronics store.

KEY FEATURES
  • Live stock messaging and per-product "in stock" counts
  • Prominent product search with keyboard shortcut (⌘K)
  • Mega "All departments" menu across 60+ categories
  • Interactive PC builder with step-by-step compatibility checks and power estimates
  • Build-your-own-combo tool
  • Deals, price-drop and trending product rails
  • Brand browsing ("Hover a maker, see what we stock")
  • Corporate & bulk quote flow
  • bKash and cash-on-delivery payment
  • Buying guides and blog
  • WhatsApp chat, account, wishlist and cart drawer
  • Shipping, returns, FAQ, privacy and cookie pages
DESIGN SYSTEM
Typography

Geist Sans the whole UI, with heavy, tightly tracked headlines

Mono-style uppercase micro-labels

Tabular figures prices

Colour palette
  • #FAFAF9Background (warm off-white)
  • #111827Text / primary buttons (ink navy)
  • #FFFFFFButton text
  • #F97316Accent (signal orange)
  • #0B0B0CFooter / announcement bar (near-black)

Clean, utilitarian retail UI: dense but orderly product grids, rounded cards, dark ink buttons with orange used only for calls to action and deals, a black announcement bar and footer, and practical data panels in the PC builder. Keeping orange for actions means the eye always finds the next step.

TECH STACK
CMS / commerce
WordPress + WooCommerce
Theme
Custom theme (arrakon) + custom block plugin (arrakon-blocks)
SEO
Rank Math
Frontend
jQuery 3.7.1, Google Fonts / Geist Sans
Payments
bKash, cash on delivery
Analytics
Google Analytics
Messaging
WhatsApp chat
Hosting / CDN
Hostinger (hcdn), LiteSpeed Cache, PHP 8.3
WHAT IT DELIVERS
  • Trust signals such as genuine stock, invoices, a replacement policy and local payment options appear on every page, which addresses the main hesitations of online tech buyers in Bangladesh.
  • The guided PC builder turns a complex, error-prone purchase into a self-serve flow that only offers compatible parts.
  • A dedicated corporate channel lets the store take bulk B2B orders alongside retail sales.
  • Staff-written buying guides help customers choose with confidence and give the store useful pages for search.
  • E-commerce
  • WooCommerce
  • WordPress
  • Electronics retail
  • PC builder
  • bKash
  • Bangladesh
  • Custom theme
  • Product catalog
  • Responsive design
NEXT CASE STUDY · 06 RS Automart Next.js + Payload CMS E-commerce store / vehicle marketplace