🇮🇳Bareilly09:07:23 PM
🇸🇦Jeddah06:37:23 PM
🇦🇪Sharjah07:37:23 PM
🇺🇸New York11:37:23 AM
Green Fern

UI/UX

Branding

Regenerative Toursim in Dumbo

May 6, 2025

Created by Shawki, Joana, and Michelle

Summary

As part of a User Experience and Design course, my team developed a website feature aimed at alleviating pedestrian congestion in Dumbo, NYC. The solution—“The Dumbo Balance”—integrated a live map and an AI companion into the existing Dumbo site to improve experiences for residents, tourists, and small business owners alike.

Objectives

  • Reduce foot traffic congestion in heavily visited Dumbo areas.

  • Increase visibility and footfall for small local businesses.

  • Enhance tourists' ability to explore Dumbo beyond the typical hotspots.

  • Improve daily life for local residents navigating crowded streets.

Challenges

  • Legal limitations: Dumbo cannot enforce tourism taxes or implement independent platforms like Airbnb.

  • App fatigue: Tourists were reluctant to download another location-specific app.

  • System integration: The need to fit the solution within the existing Dumbo infrastructure.

  • Designing for mobile-first use while planning future desktop compatibility.

  • Accessibility considerations such as colorblind-friendly design.

Research

  • Conducted 60 in-person field interviews (20 each with residents, tourists, and small business owners).

  • Studied global tourism management strategies, including regulation-based crowd control and incentive-driven redistribution.

  • Identified that users preferred built-in features on websites over standalone apps.

Key Insights

  • Residents were frustrated by crowded commutes and lack of alternative walking routes.

  • Tourists often missed out on less-commercialized areas and fell into tourist traps.

  • Local businesses lacked visibility, especially those outside high-traffic zones.

Design and Development Journey

Phase 1: Initial Concept and Desktop Design

Our first approach was to imagine how this tool could integrate into the existing Dumbo website without disrupting its current brand and functionality. We analyzed the visual language already present on the Dumbo homepage—pastel color palettes, minimalist iconography, and quirky serif typography—and designed a soft-refresh that subtly modernized outdated elements while preserving its charm.

  • Wireframes: Low-fidelity sketches focused on layout, flow, and user intent. We prioritized clarity and easy navigation.

  • Integration Goals: Every feature—Live Track and DumboAI—was designed to live within the ecosystem of the Dumbo website, ensuring minimal learning curve for users familiar with the current site.

Design System and Iteration

We developed a reusable design system:

  • Typography & Colors: Inspired by Dumbo’s aesthetic—playful but structured

  • Components: Buttons, modals, cards, and AI prompt chips for scalable expansion

  • Prototypes: Created mid- and high-fidelity prototypes in Figma for usability testing and iteration cycles

Phase 2: Mobile-First Pivot

After user testing and feedback from early concept interviews, we shifted our focus to mobile-first design. Tourists, our primary active users, were highly mobile and relied on smartphones for navigation, discovery, and planning.

  • Adaptation Strategy: We restructured layouts for vertical flow, streamlined buttons and options for thumb reachability, and reduced the visual clutter for smaller screens.

  • Interaction Design: Microinteractions were introduced—hover states, pulsing dots, and dynamic popups—to make the UI more engaging and responsive.

  • Color Coding: Special attention was given to the clarity of visual indicators for crowd levels, keeping the interface intuitive and scannable even at a glance.

User Journey Diagram

User Flows + User Personas

Features

1. Get Planning Button

  • Acts as the central CTA (Call to Action) on the homepage

  • Leads users to choose between:

    • Live Track: Real-time crowd tracking

    • DumboAI: Personalized travel assistant


2. Live Track


A clean, minimal map view of the Dumbo neighborhood enriched with real-time data.

  • Crowd Density Indicators:

    • Pulsing dots in three colors:

      • Green: Low traffic

      • Yellow: Medium traffic

      • Red: High traffic

  • Touch Interactions:

    • Long press on any dot reveals:

      • Area name

      • Estimated crowd count

  • Options Modal:

    • Live View Tab: Summarizes current total foot traffic across zones

    • History Tab: Displays crowd trends over the past 7 days for strategic trip planning

  • Use Cases:

    • Residents can avoid congested zones after work

    • Tourists can explore areas when they're less busy

    • Businesses can predict high footfall periods to launch deals

3. DumboAI Companion

An AI-powered assistant for personalized planning—designed with chat-like UX for relatability and ease of use.

  • Prompts Based on:

    • Budget: Low-cost, free, premium recommendations

    • Time: Activities that fit available time slots

    • Interest & Activities: Categories like food, history, photography, art, family-friendly

  • AI-Generated Suggestions:

    • Tailored itineraries based on real-time data

    • Local business highlights and off-peak offers

Conclusion and Future Steps

This project demonstrated how thoughtful UX design can meaningfully address real-world urban challenges, particularly in balancing tourism, local business visibility, and resident experience. Moving forward, we plan to adapt the mobile-first design into a fully responsive desktop version while enhancing the map’s functionality with more intuitive navigation, colorblind-accessible features, and 3D graphical elements for better spatial clarity. We also aim to deepen engagement with local businesses to generate richer, more personalized AI recommendations. To make the experience even smarter, we envision proactive AI prompts—such as automatically surfacing “Current Discounts” or “Off-Peak Deals”—as well as seasonal itineraries that help manage crowd surges during holidays. Ensuring seamless performance across all devices and screen sizes remains a priority as we refine and expand the system.