GrabKey AI — AI-Powered Game Key Price Intelligence Platform
Visual Showcase
Click any image to explore the gallery in full screen
About This Project
A premium SaaS platform that aggregates game key prices from 50+ retailers, applies AI-driven deal scoring and price prediction, and delivers personalized recommendations to gamers.
Project Scope:
Designed and developed the complete frontend — 20+ pages and 50+ components — featuring a premium dark gaming aesthetic with bento-style layouts, scroll-triggered animations, and 60fps micro-interactions.
Key Pages Delivered:
• Landing page with animated hero, live stats ticker, and feature showcase • Game search with real-time filtering and command palette (⌘K) • Game detail page with 13+ components including price comparison, deal score breakdown, and AI price predictions • Deals discovery with dynamic sorting, tag filtering, and recommendation badges • Store directory with trust score rings, brand-colored cards, and region support • Pricing page with subscription tier comparison • Blog, authentication (login/register), wishlist, alerts, library, and settings pages • Admin dashboard with bento analytics, store intelligence, and system configuration panels
Tech Stack:
Next.js 15 (App Router) • TypeScript • Tailwind CSS 4 • Motion (animations) • Recharts (data visualization) • Zustand (state) • TanStack Query (server cache)
AI-Assisted Development:
Built using Claude Code (Opus 4.6), Claude Code Skills, ChatGPT + Codex, Context7 MCP Server, Firecrawl, and custom NLP-style structured prompts — demonstrating how AI tools can accelerate production-grade frontend development without compromising design quality.
Design Approach:
Premium dark gaming aesthetic inspired by Dribbble references. Custom design tokens (gaming-orange, gaming-teal, gaming-purple, gaming-coral, gaming-gold). Outfit typeface for headings. Every component hand-crafted — no UI templates used.
I’ll also share the AI tools I used during development:
ChatGPT + Codex Claude Code Opus 4.6 Claude Code skills Firecrawl Grammarly AI Context7 MCP Server Claude Code LSP My own NPL-style structured prompts Freepik (assets) Dribbble (design inspiration)
Project Details
Enjoyed this project breakdown?
A coffee fuels more open-source work, tutorials, and detailed case studies like this one.
Like What You See?
Check out more projects or let's discuss how I can bring your vision to life with the same attention to detail.
