What We Built
We created a web-based precision agriculture analytics platform that processes satellite and drone imagery to assess crop health and soil conditions. The application computes 22 agronomic indices from RGB imagery, including both vegetation metrics (NGRDI, ExG, VARI, etc.) and soil-specific indices (SOCI, BI, RI), giving farmers actionable field diagnostics without requiring multispectral sensors.
The platform includes a comprehensive archive system with statistical analysis tools, trend charting, and CSV/PNG export capabilities. Users can save analysis history, perform descriptive statistics, detect outliers, fit linear regressions, and track temporal trends - all within a responsive, client-side web application.
Who It's For
The tool targets precision agriculture practitioners: agronomists, farm managers, and researchers who need to monitor field conditions. Our platform works globally. We designed it for both authenticated users and guest analysts, recognizing that accessibility matters in agricultural tech.
Tools We Used
Frontend stack: Vanilla JavaScript (ES6+), HTML5, and CSS3 - deliberately lightweight with no build tools or frameworks. This minimizes deployment friction and keeps the app fast.
Backend & services: Supabase (PostgreSQL + authentication) for secure user sessions and persistent storage of analysis records. Chart.js for statistical visualization. Canvas API for real-time image processing and heatmap rendering.
Infrastructure: The app runs directly in the browser; all image processing happens client-side for privacy. Only metadata and results touch the server. Pendo (Novus.ai) for product analytics (tracked user signups, language switches, analysis completions).
What We Learned Shipping It
Canvas rendering at scale matters. Processing high-resolution imagery required careful downsampling (300px target width) and pixel-level optimization. Computing 22 indices per pixel taught us that algorithmic efficiency compounds quickly across millions of pixels.
Privacy-first architecture was worth it. Client-side image processing meant we avoided building image storage infrastructure and sidestepped regulatory complexity. It also made the app feel faster and more trustworthy to users.
Internationalization from day one prevents later pain. Supporting English and Ukrainian from the start meant we designed the UI with translation in mind. Retrofitting i18n would have been messier.
Stateless image analysis unlocked features. Since we don't upload raw images, our comparison view and export pipeline became simpler. We could render side-by-side visualizations without server coordination.
Vanilla JS forced discipline. Without frameworks, we had to think carefully about module boundaries (auth.js, db.js, math.js, local.js). The result was readable, debuggable code that didn't hide complexity behind abstractions.
Agricultural domain knowledge is non-negotiable. Understanding that ExG ≤ 0 identifies soil pixels, knowing why certain thresholds matter for crop diagnostics, and grasping regional farming practices -these weren't "nice to have" details. They shaped the entire product.
We shipped a tool that works. It handles real research workflows, integrates with a production database, and scales to thousands of analyses. The next iteration would focus on mobile optimization and WebGL for even faster rendering, but we got the fundamentals right: privacy-respecting, fast, useful.
Developed by: Dr. Pavlo LYKHOVYD, Senior Researcher
IDE used: Kiro
Timeline: June 2026
Built With
- canvas
- chart.js
- css3
- html5
- javascript
- kiro
- supabase

Log in or sign up for Devpost to join the conversation.