SkilloSphere

Hail a local skill expert like an Uber — hyperlocal matching, SkillTokens, and live DynamoDB sessions in under 60 seconds.

Comment

SkilloSphere — The On-Demand Skill Marketplace for Real-World Experts

Hackathon: H0: Hack the Zero Stack with Vercel v0 and AWS Databases
Track: Track 1 — Monetizable B2C App
AWS Database: Amazon DynamoDB
Stack: Next.js 16 · React 19 · Tailwind CSS v4 · AWS SDK v3 · TypeScript · Vercel
Live App: https://v0-skillosphere.vercel.app

Inspiration

Skilled people are everywhere. Help is not.

In Bangalore's informal settlements, a master welder sits idle while three streets away someone needs a gate repaired. A retired teacher wants to earn by tutoring but has no way to signal availability. A farmer knows seed-saving techniques that could transform a neighbour's yield — but there is no platform connecting them.

Ride-sharing solved the same problem for transport. A driver signals availability, a rider hails instantly, trust is built through ratings. We asked: why has nobody done this for skills?

That question became SkilloSphere.

What It Does

SkilloSphere is an on-demand hyperlocal skill marketplace — Uber for expertise.

  • Hail a Skill — pick what you need (welding, carpentry, mobile repair, farming, plumbing, electrical, first aid, sewing), share your location, and nearby verified experts appear sorted by distance within seconds
  • Instant Match — the nearest available expert is surfaced from DynamoDB in milliseconds using geo-partitioned GSI queries — no waiting, no scrolling through irrelevant profiles
  • Live Sessions — a real-time session timer tracks the engagement; learners and experts see the same live status with tokens earned ticking up per minute
  • Flexible Payment — every expert lists both a cash rate (₹/hr) and a SkillToken rate (SKL/hr), supporting users with no bank account through a barter-adjacent token economy
  • Dual Dashboard — learners track sessions, token balance, streak, and skills learned; experts toggle availability live and see incoming requests instantly
  • Community Trust — experts are rated after every session; ratings update the DynamoDB aggregate in real time and surface better experts to future learners

How We Built It

Stack: Next.js 16 App Router · React 19 · Tailwind CSS v4 · AWS SDK v3 · Amazon DynamoDB · Vercel · TypeScript

Frontend was scaffolded with Vercel v0, which gave us production-ready component shells in minutes. We then customised every component — ExpertCard, HailFlow (3-step match UI), SessionTimer, ActiveSessionCard, SkillTokenWidget, AvailabilityToggle — adding real API wiring, animations, and mobile-first layouts. The entire UI runs on Vercel with AWS credentials injected as encrypted environment variables at build time, never exposed to the browser.

Database design was the core engineering challenge. Three DynamoDB tables, six GSIs, zero table scans — ever.

skillosphere-experts stores expert profiles geo-partitioned by a computed districtCode — a grid cell derived from floor(lat×10)/10_floor(lng×10)/10 that buckets nearby experts into shared GSI partitions. A nearby search fans across a 3×3 grid of neighbouring cells and applies true Haversine distance filtering so experts near a cell boundary are never missed. Two GSIs serve two distinct access patterns: district-skill-index for geo + skill discovery and availability-index for filtering live experts only.

skillosphere-sessions tracks the full lifecycle from PENDING to ACTIVE to COMPLETED. Two GSIs — learner-index and expert-index — give both sides instant session history in a single partition read. Payment method, SkillTokens transferred, and post-session ratings are all stored per session. The monetization layer is fully wired into the data model from day one.

skillosphere-users manages profiles and SkillToken wallets with an email-index GSI for fast auth lookups.

Key design decisions that matter at scale:

  • isAvailable stored as String not Boolean — DynamoDB GSI keys cannot be booleans, so availability is stored as "true"/"false" and every filter uses :avail: "true"
  • Expert name is denormalized into every session record — zero joins by design
  • Status is the sessions sort key — requiring both sessionId and status for direct GetItem, with GSI used for id-only lookups

API layer runs entirely as Next.js Route Handlers on Vercel — no API Gateway, no Lambda in the request path. Five endpoints cover the full product surface:

Route Method Description
/api/experts/nearby GET Geo-partitioned expert discovery
/api/sessions/request POST Create PENDING session
/api/sessions GET All sessions by learner or expert
/api/sessions/rate POST Rate session + update expert aggregate
/api/experts/availability POST Toggle expert live/offline

All DynamoDB access happens server-side only via encrypted Vercel environment variables.

Challenges We Ran Into

Geo-querying without PostGIS. DynamoDB has no native geospatial index. We solved this by computing a districtCode partition key from lat/lng, enabling fast neighborhood-level queries while a 3×3 grid fan-out with Haversine post-filtering catches experts near cell boundaries. The result: geo-aware expert discovery with no table scans and single-digit millisecond latency.

Boolean GSI keys. DynamoDB silently drops items from GSIs when the key attribute is a boolean. Discovering this mid-build forced a full schema migration from isAvailable: true to isAvailable: "true" across all tables, queries, and filters.

Dual payment UX. Designing a UI where cash rates and SkillToken rates coexist without confusing users required several iterations. The final solution — showing both rates on every expert card with a clear currency toggle at session request — tested cleanly.

Mobile-first with real data. v0 generated beautiful desktop-optimised shells. Wiring real DynamoDB data into those components while maintaining smooth mobile UX — especially the session timer and availability toggle with live feedback — required careful state management and optimistic UI updates.

Accomplishments We're Proud Of

  • Zero table scans across the entire product — every query hits exactly one GSI partition
  • A dual economy (cash + SkillTokens) fully modelled in the data layer, not bolted on as an afterthought
  • A geo-matching algorithm that works at hyperlocal scale without any geospatial database extension
  • A complete mobile-first product — landing, hail flow, sessions, learner dashboard, expert dashboard — shipped in under 48 hours
  • AWS credentials never touch the browser at any point in the request lifecycle

What We Learned

DynamoDB rewards you for thinking in access patterns before writing a single line of code. Every GSI we designed maps directly to a user action — hail a skill, view my sessions, toggle availability — and that discipline is what keeps the app fast at any scale.

v0 is genuinely production-capable for scaffolding. The gap between v0 output and a shippable component is smaller than we expected — the real work is data wiring and edge case handling, not visual scaffolding.

Building for the informal economy requires UX humility. SkillToken barter exists because millions of our target users have skills but limited cash. That insight shaped every payment screen in the product.

What's Next

  • Real-time expert location — live map showing experts moving toward you after session acceptance
  • Voice-first hail — speak what you need in Hindi or Kannada, AI matches the skill category
  • SkillToken exchange — peer-to-peer token trading and cash-out via UPI
  • Verified expert badges — community-driven verification with photo proof of completed work
  • Rural expansion — offline-capable PWA for low-connectivity areas where the skilled workforce is densest and most underserved

Architecture Diagram

┌─────────────────────────────────────────────┐
│  Mobile-first Next.js UI  (Vercel)           │
│  Home · /hail · /sessions · /dashboard/*     │
└───────────────┬─────────────────────────────┘
                │  SWR fetch / POST (client)
                ▼
┌─────────────────────────────────────────────┐
│  Next.js Route Handlers (server, Vercel)     │
│   GET  /api/experts/nearby                   │
│   POST /api/sessions/request                 │
│   GET  /api/sessions                         │
│   POST /api/sessions/rate                    │
│   POST /api/experts/availability             │
└───────────────┬─────────────────────────────┘
                │  @aws-sdk/lib-dynamodb
                │  (creds via encrypted Vercel env vars)
                ▼
┌─────────────────────────────────────────────┐
│  Amazon DynamoDB                             │
│   skillosphere-experts                       │
│     GSI: district-skill-index                │
│     GSI: availability-index                  │
│   skillosphere-sessions                      │
│     GSI: learner-index, expert-index         │
│   skillosphere-users                         │
│     GSI: email-index                         │
└─────────────────────────────────────────────┘

Data Model

skillosphere-experts

Attribute Type Role
expertId String Partition key
skillCategory String Sort key
name, bio, avatarUrl, city String Profile
lat, lng, districtCode Number/String Geo
isAvailable String ("true"/"false") Availability
rating, reviewCount, completedSessions Number Reputation
hourlyRate, skillTokenRate Number Pricing

GSI district-skill-index → PK districtCode, SK skillCategory
GSI availability-index → PK isAvailable, SK rating

skillosphere-sessions

Attribute Type Role
sessionId String Partition key
status String (PENDING/ACTIVE/COMPLETED) Sort key
learnerId, expertId, skill String Relations
requestedAt, startedAt, completedAt String (ISO) Lifecycle
paymentMethod, tokensTransferred, rating Mixed Settlement

GSI learner-index → PK learnerId
GSI expert-index → PK expertId

skillosphere-users

Attribute Type Role
userId String Partition key
SK String ("PROFILE") Sort key
name, email, role, skillTokens Mixed Profile + wallet

GSI email-index → PK email

Security

  • AWS credentials stored exclusively as encrypted Vercel project environment variables
  • Credentials accessed only in server-side Route Handlers — never in client components
  • No NEXT_PUBLIC_ prefix on any AWS variable — zero browser exposure
  • Credentials never committed to git

Running Locally

pnpm install
pnpm dev

Set environment variables in .env.local:

AWS_ACCESS_KEY_ID=...
AWS_SECRET_ACCESS_KEY=...
AWS_REGION=ap-south-1

DynamoDB tables (skillosphere-experts, skillosphere-sessions, skillosphere-users) and all GSIs must exist in the specified region.

Built With

Next.js React TypeScript Tailwind CSS shadcn/ui Amazon DynamoDB AWS SDK v3 Vercel v0.app SWR

Created for the H0: Hack the Zero Stack with Vercel v0 and AWS Databases hackathon. #H0Hackathon

Built With

Share this project:

Updates