GeoConnect

Year 2025
Services Product Design
Ux Design
Front-end Development
GeoConnect Platform Overview

Background

GeoConnect was designed to be the digital heartbeat of the neighborhood. From local carnival festivals to sports hall reservations and free yoga classes, the platform connects users with everything happening nearby. I went with a modern, clean design dominated by blue tones to give off a sense of trust and reliability. To keep the ton of information easy to handle, I implemented a clear card-based layout with status badges.

Challenge

The real 'brain-teaser' here was the smart status logic. I built a custom getServiceStatus() function that automatically calculates whether an event is LIVE, Upcoming, or Expired based on the current date. I also had to make sure that multiple filters (like category and search) also worked together seamlessly. It took some logical puzzling and wrestling with JavaScript to get it all lined up.

Key findings

Searchbar behavior

Initially, the search bar refreshed the list with every single keystroke. I realized this felt jumpy, so I implemented a 300ms debounce timer. This small tweak made the search experience feel 10x smoother and more professional.

Visual Hierarchy of Time

I discovered that users need to see expired events for reference, but they shouldn't distract from what's happening now. I solved this by using conditional styling: expired cards automatically dim and get a grey badge, keeping the UI dynamic and organized.

Key results

Final Result

I’m most proud of the fully automated status management system. The site feels "alive" because it updates itself in real-time based on the calendar. It’s a clean, functional tool that makes community engagement easy, proving that a little bit of code can bring a whole neighborhood together.