Energy · homes & small biz · Homepages
Volta
kWh, finally transparent
Scroll to explore ↓
01 · Energy · homes & small biz
Understand your bill in 30 seconds
Energy site — plans, estimator, FAQ, signup.
- 01
kWh estimator
Slide usage — price updates live, no jargon.
- 02
Compared plans
Flat, off-peak, green — same gesture, three scenarios.
- 03
Visible savings
Gap vs market shown, not a vague promise.
01b · Engineering
Technical sheet
Stack, shipping and my role on this build — for recruiters and tech leads.
- Technologies
- Next.js
- TypeScript
- React
- Tailwind CSS
- Libraries & tools
- Estimateur client-side
- Deployment
Local /play demo — Next.js front, no business backend
- Role
UI direction · integration · interactions
- Context
Fictional direction (NDA) — same craft level as real missions
02 · Inside the product
One scroll, one screen
Each section locks to the viewport — keep scrolling past the last screen to return to the brief.
Energy · homes & small biz
Understand your bill in 30 seconds
Slide usage — price updates live, no jargon.
02
Compared plans
Flat, off-peak, green — same gesture, three scenarios.
03
Visible savings
Gap vs market shown, not a vague promise.
Homes & small offices
They stopped enduring the bill
“I got my kWh in a minute — and switched plans that night.”
“Finally a simulator that doesn’t hide green options.”
No commitment
Estimate your next bill
Local demo · no account needed.
Estimate my billBack to the brief
You’ve left the demo screens — next: try it, then the craft notes.
03 · Homes & small offices
They stopped enduring the bill
“I got my kWh in a minute — and switched plans that night.”
“Finally a simulator that doesn’t hide green options.”
04 · No commitment
Estimate your next bill
Local demo · no account needed.
- →Hero + below-the-fold sections (not just a hook)
- →Visual hierarchy and primary CTA
- →Information density vs readability
05 · Same family
Other directions of the same type — to compare density and mood.
06 · What to look at
- 01Hero + below-the-fold sections (not just a hook)
- 02Visual hierarchy and primary CTA
- 03Information density vs readability
- 04Interactive states (hover, selection, feedback)