Case study 18 / 18

Marbles HR: Digital HR Marketplace Design & Next.js Development

A digital HR marketplace, from design to Next.js.

Marbles HR is a one-stop digital HR marketplace for payroll providers, PEOs and employers. I took it end to end: the UI/UX design, the frontend build and delivery as a Next.js website.

Client: Marbles HR
Platform: Website · Marketplace · Next.js
My role: Design, frontend & Next.js

Overview

One product had to speak to payroll providers, PEOs and ASOs, employers and the app developers who list with Marbles. I designed every page in one system, then built it myself in Next.js: a filterable marketplace, a live ROI calculator, the blog, contact and portal login.

UI/UX design
Design system
Interaction design
Frontend development
Next.js
Responsive build

01
Designed as one system
Navy and magenta on soft blue-grey, one card, one button and one type scale, used from the homepage to the login.
02
A marketplace that filters
54+ HR products by category, industry and company size; the grid answers every choice instantly.
03
Numbers that answer
The ROI calculator turns a client count and average size into annual, monthly and five-year revenue as the sliders move.
04
Delivered in Next.js
Every page built and shipped as a fast, responsive Next.js site, the same components from desktop to phone.