Aura Living

eCommerce Dashboard Build & Analytics Engineering

A custom dashboard that replaces messy spreadsheets with live sales and marketing numbers for clear daily tracking.

Industry01
eCommerce
Scope02
BI Engineering, Dashboard Build
Timeline03
6-8 Weeks
Tools04
Next.js, TypeScript, Tailwind

The Problem

The company relied on separate spreadsheets with conflicting formulas and slow load times. Finding reliable numbers wasted hours every week.

Before

  • •Messy Spreadsheets: Sales and ad numbers lived in separate files.
  • •Formula Errors: Conflicting sheets showed different revenue totals.
  • •Slow Decisions: Finding reliable numbers took hours every morning.

Goals

  • •Single Source of Truth: Put all core numbers in one clean dashboard.
  • •Focused Screens: Dedicated views for sales, checkout funnels, and products.
  • •Fast Loading: Instant filters and responsive charts on every device.

Requirements

Interviews across leadership, marketing, and operations shaped the dashboard around key requirements:

Store Leadership

Sales Growth & Profit Margins

Key Questions

"Are we pacing ahead of last month, and what is our real profit after returns?"

Dashboard Requirement

High-level overview with revenue pacing, order volume, and margin health.

Marketing Team

Ad Channels & Conversion Funnels

Key Questions

"Where do buyers drop off, and which channels bring the most profitable orders?"

Dashboard Requirement

Step-by-step funnel drop-offs and marketing channel attribution.

Operations & Developers

Fast Queries & Data Accuracy

Key Questions

"How do we load store data fast without figures conflicting across views?"

Dashboard Requirement

Centralized BigQuery connection, modular components, and instant filters.

Engineering & Build Process

A focused 6-8 week sprint from initial audit to a working frontend application:

STAGE 01·

Data Audit & Interviews

Reviewed spreadsheets, documented conflicting formulas, and interviewed key team members.

Audit Notes & Metric Rules
STAGE 02·

Data Architecture & Layout

Structured the analytics platform into 6 dedicated screens for sales pacing, conversion funnels, and SKU economics.

Schema Mapping & Dashboard Architecture
STAGE 03·

Data Modeling & Visualisation

Built modular chart components, retention matrices, and real-time margin calculation logic.

Analytics Component Library
STAGE 04·

Frontend Engineering

Built a fast Next.js app with instant filtering, date selectors, and responsive charts.

Working Next.js App
Store Overview Dashboard

Store Overview Dashboard

Shows core business numbers: revenue, average order value, orders, and conversion rate, with daily pacing curves.

Conversion Funnel

Conversion Funnel

Tracks buyer progress from product views and cart additions to completed checkouts, highlighting drop-offs.

Customer Retention Matrix

Customer Retention Matrix

Shows repeat purchase patterns across 30, 60, and 90-day intervals to track customer loyalty over time.

Key Decisions

Simple interface choices directly informed by team needs:

Information Structure01

Top KPI Scorecard

Problem

Vital numbers were buried in raw transaction rows, slowing daily reviews.

Solution

Top cards with comparative pacing curves for instant sales visibility.

Data Visualization02

Question-Driven Charts

Problem

Generic charts hid checkout drop-offs and repeat buyer trends.

Solution

Step-down funnel bars for checkout friction and cohort tables for repeat sales.

System Layout03

6 Dedicated Screens

Problem

Cramming sales, ad channels, and stock onto one screen caused clutter.

Solution

Clean, dedicated screens organized under simple sidebar navigation.

Frontend Engineering04

Reusable Code Components

Problem

Static mockups broke when product names or date ranges changed.

Solution

Modular React components built to handle real dynamic data safely.

Product Catalog & Unit Economics

Product Catalog & Unit Economics

Tracks product margins, return rates, inventory turnover velocity, and restock alerts across the catalog.

Marketing Channel Attribution

Marketing Channel Attribution

Compares sales across marketing channels and direct traffic to see where ad spend works best.

Tech Stack

A clean, modern setup built for fast loading and responsive filtering:

Data Sources01

Raw Store Data

Orders, inventory, and ad tracking logs.

Warehouse02

Google BigQuery

Clean storage and structured KPI tables.

Query Layer03

Server Handlers

Fast endpoints running simple queries.

User Interface04

Next.js Frontend

Reusable React components with date filters.

Results & Impact

The new system gave the team clear daily numbers they could trust:

Modular Component Architecture

Built a modular component architecture with reusable React charts and metric primitives for fast future updates.

Reusable Primitives

Automated Data Pipeline

Connected store sales and ad channels into BigQuery, removing manual spreadsheet work.

Continuous Sync

Single Source of Truth

Aligned sales and revenue definitions across leadership and marketing teams.

Standardized Metrics

Faster Daily Decisions

Gave the team instant visibility into product margins, buyer drop-offs, and hourly trends.

Daily Visibility
Sales by Hour & Day

Sales by Hour & Day

Shows order speed and visitor traffic by hour and day to find peak shopping windows.

Ongoing Maintenance & Usability

After delivering the dashboard, work shifted to fixing bugs, improving usability, adding new metrics, and adjusting existing calculations.

Continuous Support

Planning Additional Data Sources

Planning the integration of additional store and marketing data sources to expand reporting coverage across the platform.

Data Expansion