Putra Rizky Nugraha
Putra Rizky Nugraha
@traa_rzkyy
Back to Projects
webPersonal
Location-Based Directory • Conversational AI

Dekatku MSME Maps

Location-Based MSME Directory & Conversational AI Discovery Assistant

Dekatku MSME Maps

Project Overview

A geolocation directory connecting residents and travelers to local micro-businesses, featuring conversational AI recommendations and precise distance calculation.

  • —Real-time nearest vendor detection powered by precise Haversine distance calculations.
  • —Natural language conversational AI assistant recommending local foods and services tailored to user preferences.
  • —Lightweight, touch-ergonomic interactive maps interface optimized for mobile viewports.
Problem Statement

The Challenge

High-quality micro-merchants are frequently buried under algorithmic noise in giant delivery apps, hindering local discovery.

  • —Inconsistent GPS coordinates and operating hours across independent local businesses.
  • —Users want instant, contextual suggestions without reading lengthy review threads.
  • —Application needs to perform reliably on constrained mobile data connections.
Architectural Response

The Solution

Synthesized browser geolocation with interactive map visualizations and an AI conversational agent that delivers instant recommendations.

  • —Client-side Haversine distance calculations ensuring zero backend latency during geo-sorting.
  • —Conversational assistant filtering cuisines, pricing brackets, and walking radii.
  • —Tailwind CSS aesthetic with distinctive neon aura branding and accessible typography.

Key Features

Functional capabilities built to solve core user and operational friction.

Haversine Distance Engine

Calculates metric distances between the user's live coordinates and surrounding stores instantaneously.

Conversational AI Discovery

Prompt natural conversational queries like 'Best iced coffee under $2 nearby' for instant tailored picks.

Interactive Map Exploration

Interactive map pins with instant drawer preview, opening schedules, and turn-by-turn routing.

System Architecture

Architectural patterns, backend performance paradigms, and key design decisions.

01Modern Reactive UI: Clean React and TypeScript interface styled with Tailwind CSS tokens.
02Geolocation Engine: Precise distance calculation and dynamic interactive map pins for surrounding vendors.
03AI Assistant Dialog: Contextual chatbot recommending shops, cuisines, and services based on user intent.

Engineering Process

Development lifecycle from modeling to production deployment.

01

Research & Geolocation Ingestion

Curated local vendor coordinates and mapped geometric distance formulas.

  • —Local vendor dataset curation
  • —Haversine formula implementation
  • —Mobile GPS precision testing
02

AI Assistant & UI Development

Integrated conversational prompt engines with reactive React map layers.

  • —Recommendation persona tuning
  • —Dynamic interactive map componentry
  • —Mobile-first ergonomic UI polish

Tech Stack & Tools

Reactreact
TypeScripttypescript
Tailwind CSStailwind
ReactTypeScriptGeolocation APIAI RecommendationTailwind CSS