Hibiscus

Urban plants are vanishing. Most people walk past them without a second thought. You don't have to. Adopt a plant near you and care for it at Hibiscus.

Comment

Inspiration

Like many people in Kuala Lumpur, I commute to work using public transportation. That means walking to and from train stations every day. While public transport itself is convenient, the journey on foot can be challenging. Malaysia is a tropical country, and the heat in Kuala Lumpur can be relentless. On many routes, there is barely any natural shade to provide relief from the sun.

At one point, I wrote to my local authorities asking whether more trees could be planted along these pedestrian paths. Unfortunately, the request never went anywhere. To be fair, I understand why. Kuala Lumpur faces a significant shortage of arboricultural resources. According to a 2024 report Link, the city is home to tens of thousands of trees but has only 21 certified arborists responsible for managing and assessing them. With limited expertise and resources available, maintaining existing urban greenery is already a difficult challenge, let alone expanding it.

This challenge is not unique to Kuala Lumpur. A recent study published in Nature Link, which examined 8,919 large urban areas worldwide, found that existing tree cover mitigates between 41% and 49% of the maximum potential urban heat island effect. Trees are not merely aesthetic additions to a city. They are critical infrastructure that help keep urban environments cooler, healthier, and more livable.

At the same time, many younger generations in rapidly growing cities live in high-rise apartments and condominiums. Unlike previous generations, they often have little access to land where they can garden or participate in greening activities. As a result, children also grow up with fewer opportunities to develop an appreciation for nature and environmental stewardship during their formative years.

Relying solely on local authorities to close this gap is not enough. During my time living in Germany, I saw firsthand how community gardens could transform neighborhoods. They helped improve local green spaces while also becoming social hubs where residents gathered, interacted, and built stronger communities.

That experience stayed with me.

I started thinking about how plant care could be made simple, accessible, and enjoyable for ordinary people. With modern AI models, it suddenly became possible to create a kind of "resident arborist" in every pocket of the city and crowdsource plant health monitoring at scale. Combining this idea with my product management background, I began sketching concepts and prototypes.

That was how Hibiscus was born.

As a side note, the application is named Hibiscus, after Malaysia's national flower. The hibiscus symbolizes courage, vitality, and unity, values that felt fitting for a project focused on bringing communities together to care for their environment.

What it does

Hibiscus is a community-driven platform that enables people to discover, adopt, monitor, and care for plants in their neighborhoods.

Users can adopt plants around them, upload photos, track plant health over time, and contribute observations that help build a living record of urban greenery. AI assists by analyzing plant photos and providing health assessments, making plant care accessible even to people with little or no horticultural knowledge.

The broader vision is to create a distributed network of "resident arborists" throughout a city. Instead of relying solely on limited municipal resources, communities can collectively monitor plant health and identify issues before they become larger problems.

Beyond plant health monitoring, Hibiscus also aims to reconnect people with nature, especially younger generations growing up in dense urban environments with limited access to green spaces.

How we built it

My original goal was to embrace vibe-coding as much as possible and see how far modern AI tools could take a solo developer.

I initially started with a low-code platform, but the experience quickly became expensive and difficult to maintain. The generated codebase grew increasingly messy, so I eventually exported the project and moved development entirely into Visual Studio Code using Claude Code.

I retained TanStack Start as the application framework because it comes with many useful batteries included, such as:

  • TanStack Store for centralized client-side state management
  • TanStack AI for unified AI integrations
  • Built-in routing and server-side capabilities

For the backend and database layer, I used Supabase.

For deployment, I chose Cloudflare Workers together with Cloudflare AI Gateway. Cloudflare handles much of the operational heavy lifting, including DDoS protection, bot mitigation, and AI request management. The AI Gateway also provides a unified interface for AI models, reducing operational complexity.

Authentication is handled by Clerk, with Google Sign-In as the primary authentication method. I intentionally avoided email-password and phone-based authentication because they introduce additional security and maintenance concerns.

For plant image analysis, I selected Gemini 2.5 Flash-Lite. It is fast, affordable, and delivers results that are more than sufficient for the application's use case.

Although I have a software engineering background, I spent relatively little time writing code manually. Most of my effort went into brainstorming with AI, reviewing implementation plans, challenging architectural decisions, refining UX flows, and identifying edge cases. In many ways, it felt less like coding and more like leading a team of highly capable engineers.

Challenges we ran into

No direct integration with local authorities

One limitation of the application is the lack of a standardized integration mechanism with city council reporting systems.

To work around this, the application includes a Share feature that generates structured text users can easily send through existing communication channels.

Direct integrations with municipal reporting systems would significantly improve the user experience and create a smoother feedback loop between residents and local authorities.

Browser restrictions

Because the application depends heavily on geolocation, obtaining accurate location permissions is critical.

I tested extensively on Chrome and Safari. Safari on iOS, in particular, is extremely conservative when it comes to location sharing due to its privacy-focused design.

There was no technical workaround for these restrictions. Instead, I focused on providing clear guidance to users whenever location access issues occurred.

A longer-term solution would be assigning physical identifiers, such as QR codes, to plants. Users could simply scan a code to adopt a plant, reducing reliance on geolocation altogether. Achieving this would require collaboration with local communities and municipal authorities.

Responsive UI

The application was designed with a mobile-first mindset.

Although most users are expected to access it from mobile devices, I also wanted to ensure the experience remained functional on tablets and desktop screens.

CSS was not my strongest area during my engineering career, but AI coding assistants proved incredibly helpful here. By clearly describing visual issues and expected outcomes, I was able to iterate quickly and achieve a responsive design that worked well across screen sizes.

Accomplishments that we're proud of

The accomplishment I am most proud of is that this entire application was built by a single person.

For years, building a production-ready application with authentication, AI capabilities, deployment infrastructure, security controls, image processing, and a polished user experience would have required a team of engineers, designers, and product managers.

This project convinced me that the landscape has fundamentally changed.

With today's AI tools, it is entirely possible for a single individual to bootstrap an idea rapidly, iterate quickly, and bring a meaningful product to life without a large team.

Beyond the technology itself, I am proud that Hibiscus combines a real-world environmental challenge, community participation, and AI into something practical and accessible. It is not simply an experiment with AI. It is an attempt to make it easier for ordinary people to contribute positively to the spaces they live in.

What we learned

When I started building the application, I gave myself a challenge, could I build it almost entirely through vibe-coding, with minimal manual coding?

The vast majority of the application was developed through iterative collaboration with Claude Code, where my role was primarily defining requirements, evaluating tradeoffs, refining UX decisions, and validating implementation quality.

One surprising lesson was that I did not need the most expensive models. Most of the project was built using lightweight AI coding models, with more capable models reserved for detailed debugging and architectural discussions. In practice, I often found that planning-oriented conversations produced better outcomes than simply asking an AI to generate code.

I quickly learned that vague prompts were expensive and ineffective. A prompt like:

"Plant card is missing in diary page."

usually resulted in patchwork fixes that solved the symptom but introduced subtle bugs elsewhere.

Much better outcomes came from prompts such as:

  • "Audit the XYZ module and explain the logic flow."
  • "Recommend several approaches and explain the tradeoffs."
  • "Argue why you are recommending this solution."
  • "Critique this design idea."
  • "Identify sources of complexity and propose simplifications."

My years in product management turned out to be incredibly valuable. Working with distributed teams across different countries taught me the importance of precise communication. The same principle applies when working with AI.

I did not need to review every line of code. Instead, I focused on understanding the underlying logic, identifying where complexity was creeping in, simplifying the user experience, and documenting reproducible bug scenarios. In many ways, it felt similar to collaborating with a skilled software engineer or QA engineer.

I also learned that AI is not a substitute for independent thinking. There were still plenty of situations where I needed to investigate issues myself, search documentation, read community discussions, and bring those findings back to the AI assistant for further brainstorming.

Finally, I learned that large language models are not omniscient. They often attempt to patch symptoms rather than address root causes. A fix may resolve the immediate issue while making the overall architecture more fragile. Continually challenging the AI to simplify, refactor, and harmonize implementations was critical to maintaining a clean and maintainable codebase.

What's next for Hibiscus

The next major step for Hibiscus is to strengthen collaboration with local communities, neighborhood groups, and ideally local councils.

As highlighted in the challenges section, the current reporting workflow is constrained by the lack of direct integrations with municipal systems. Enabling smoother reporting and follow-up mechanisms would significantly improve the user experience and increase the impact of community-generated observations.

Another promising direction is introducing physical identifiers such as QR codes on plants. This would make adoption and reporting significantly easier while reducing dependence on geolocation permissions and browser-specific behavior.

More broadly, I would like to see whether the concept can scale beyond individual neighborhoods and become a practical platform for crowdsourcing urban plant health. If successful, communities could become active participants in maintaining the green infrastructure that helps cities stay cooler, healthier, and more livable.

Ultimately, my hope is that Hibiscus can encourage more people to reconnect with nature and contribute, in a small but meaningful way, to tackling the growing urban heat challenges faced by cities around the world.

Built With

Share this project:

Updates