Inspiration
As an urban plant parent tired of guessing my fiddle leaf fig’s needs and struggling to ID random cuttings from the local nursery, I dreamed of a tool that merged my love for plants with modern web design. The Urban Jungle trend in my city made me realize so many of us crave accessible, beautiful plant care support—no green thumb required.
What it does
AI Plant Care Guru is a web app that lets you snap a photo of any plant to ID it (with toxicity alerts for pet owners!), create personalized watering/fertilizing schedules, diagnose sick plant issues, and join a community to trade plants, share progress, and find local nurseries. Every interaction is wrapped in a lush, animated UI that feels as organic as gardening itself.
How we built it
We started with core user flows (ID, care, diagnose, connect) then built a design system centered on glassmorphism, soft gradients, and botanical animations. We used HTML/CSS/JS for the frontend, leaning into CSS backdrop-blur for the frosted glass effect and IntersectionObserver for scroll-triggered reveals. Google’s OAuth powered seamless sign-in, and responsive grids ensured it works on phone/tablet/desktop.
Challenges we ran into
Balancing immersive animations with accessibility was tough—we had to ensure all motion respected prefers-reduced-motion settings without losing the app’s warmth. Designing the timeline-based care schedule also required iterating to keep it intuitive while maintaining the premium visual style.
Accomplishments that we're proud of
Creating a UI that’s both stunning and functional—users rave about the glassmorphism cards and subtle parallax effects, but never find the design gets in the way of using the app. We also nailed responsive design: the nursery finder’s split layout works flawlessly from 320px mobile to 2560px desktop.
What we learned
Accessibility isn’t a compromise—it makes the design stronger. We also learned that botanical-themed micro-interactions (like swaying leaf icons) create an emotional connection users love, far more than generic animations. Most importantly, we saw how plant parents value community as much as technical care advice.
What's next for this project
We’re expanding the care schedule to auto-adjust for local climate data, adding more detailed pest diagnosis guides, and building out the nursery finder with real-time local inventory. We also plan to enhance the community features to let users tag their plant progress with seasonal milestones—because watching a monstera grow is worth celebrating.
Built With
- css
- html
- inter
- javascript
Log in or sign up for Devpost to join the conversation.