Drishti

Drishti: Bringing the future of clear sight into focus.

Comment

Inspiration

The inspiration for DrishtiRx came from witnessing a daily struggle that touched my heart. My girlfriend's father runs a small optometry clinic - a cozy shop that's always buzzing with customers seeking better vision. What struck me most was his dedication: he genuinely cares about every customer, remembering their families, celebrating their milestones, and treating his clinic like a community hub rather than just a business. But behind this warmth was a constant battle with paperwork. I watched him spend countless hours after closing, sifting through stacks of handwritten prescriptions, trying to locate a customer's previous records from months ago. His small shop was drowning in filing cabinets and record books, eating up precious space that could serve more customers. My girlfriend always expressed her desire to help her father modernize his practice, and that's when I realized - this was my chance to make a real difference. The breaking point came when I saw him lose a customer's prescription history because papers got misplaced. That night, I decided to channel my programming knowledge into something meaningful. What started as a desire to impress my girlfriend became a mission to digitize small-scale optometry practices. This wasn't just about code - it was about family, community, and proving that love can drive innovation.

What it does

DrishtiRx is a comprehensive optometry management system designed specifically for small clinics and independent practitioners. The application provides: Core Features:

Digital Prescription Management: Create, store, and retrieve detailed eye prescriptions with support for both spectacles and contact lenses Customer Relationship Management: Track customer histories, important dates, and personal preferences Intelligent Search: Quickly find past prescriptions and customer records stored in database Professional Printing: Generate formatted prescriptions in both full-size and card formats Order Management: Handle spectacle and contact lens orders with payment tracking Billing System: Integrated billing with discount management and payment history Data Analytics: Customer history visualization and business insights Navigation : For pages each page except billing we have provided buttons named Prev,Next,First,Last which help us to retrieve the corresponding stored records from database

Smart Features:

Auto-calculation of near vision and spherical equivalents Automated prescription numbering Real-time data validation Smart Navigation System: First/Previous/Next/Last buttons on every page that auto-populate complete database records chronologically Responsive design for desktop and tablet use Offline-ready architecture for uninterrupted service

How we built it

The Journey from Zero to Hero: Honestly, when I started this project, I had no clear roadmap - just a burning desire to solve a real problem. I discovered Bolt.new AI and decided to dive in headfirst, even though I wasn't sure where it would lead. Phase 1: UI Discovery with Bolt.new I began with simple prompts to Bolt.new AI: "Create a prescription form for an optometry clinic" and "Design a customer search interface." What amazed me was how quickly I could visualize ideas. The AI helped me rapidly prototype different layouts, and I started understanding what the application could look like before I even knew how to make it functional. Phase 2: Database Integration Reality Check After completing the initial UI, Bolt.new suggested integrating with Supabase. I'll be honest - I had never heard of Supabase before this project! Learning that it was PostgreSQL accessible through environment variables was my first "aha!" moment. Suddenly, the pieces started connecting: frontend + database + real-time updates = actual working software. Phase 3: Feature-by-Feature Development My approach was methodical - tackle one page at a time with specific goals: Prescription Page Goals:

Save complete customer details (purchases, advances, balances) Store comprehensive eye examination data (DV and NV fields) Generate unique prescription numbers automatically Enable data retrieval using prescription number, mobile, or name Implement chronological navigation: First/Previous/Next/Last buttons that auto-populate entire records based on creation timestamp

Navigation Innovation: One feature I'm particularly proud of is the universal navigation system I implemented across all pages (Prescription, Contact Lens, Order Card). Each page has First/Previous/Next/Last buttons that automatically populate the complete database record based on chronological order. This means with just a click, users can browse through their entire prescription history without needing to search manually - the "First" button loads the very first record ever created, while "Next" moves to the most recent ones. This feature alone saves countless minutes of searching through records. Order Card Integration:

Import saved prescription data seamlessly Allow additional item additions Generate professional PDF prescriptions Create a complete paper-to-digital workflow

Customer History Tracking:

Automatically log deleted items for audit trails Help track bestselling products Maintain complete purchase histories

Technical Architecture:

Frontend: React + TypeScript (learned TypeScript during development!) Backend: Supabase with PostgreSQL AI Assistant: Bolt.new AI for rapid prototyping and problem-solving Print System: Custom PDF generation for professional prescriptions

Development Strategy with Bolt.new: The key insight was learning to work WITH the AI rather than just asking for complete solutions. I developed a pattern:

Start with UI mockups using simple prompts Integrate one feature at a time Test extensively with real data Debug and refine before moving to the next feature

Challenges we ran into

The Learning Curve Nightmare: Starting with zero knowledge of modern web development was both humbling and frustrating. I was thrown into the deep end with concepts like environment variables, API integrations, and database relationships - all while trying to solve a real-world problem with a tight deadline. The Great Data Loss Mystery: My biggest nightmare happened when customer data would mysteriously disappear mid-save. Imagine spending hours entering test prescription data, hitting save, and watching it vanish into the digital void! After extensive debugging sessions (and a few sleepless nights), I discovered the culprit: naming convention inconsistencies. The database expected fields like prescription_no but my frontend was sending prescriptionNo. This taught me a crucial lesson about working with AI tools - they're incredibly powerful, but you need to be meticulous about the details. A single underscore vs camelCase difference could make or break your entire data flow. Bolt.new AI: Double-Edged Sword: While Bolt.new AI was instrumental in rapid prototyping, it became problematic when working with larger datasets. The AI would sometimes make my files corrupt or introduce inconsistencies when handling complex operations. I learned to work in chunks - breaking down complex features into smaller, manageable pieces and then integrating them manually. Database Design Complexities: Understanding relationships between prescriptions, eye measurements, customer data, and purchase history required multiple iterations. The challenge wasn't just storing data - it was designing a schema that could handle:

Multiple prescriptions per customer Historical tracking of changes Audit trails for deleted items Efficient search across different data types

Real-World Testing & Navigation Challenges: Testing with actual prescription data revealed edge cases I never anticipated:

Customers with identical names but different phone numbers Prescription numbers that needed to be both human-readable and unique Print formatting that had to match professional standards exactly Data migration from years of handwritten records Navigation edge cases: handling empty databases, single records, and maintaining form state during record transitions

Performance and Reliability Issues: As the application grew, I encountered:

Slow query performance when searching through hundreds of prescriptions Race conditions when multiple users accessed the same customer record Memory leaks from improper component lifecycle management Browser compatibility issues with the print functionality

Accomplishments that we're proud of

Technical Achievements:

Zero Data Loss: Implemented robust error handling and data validation Sub-second Search: Optimized database queries for instant prescription retrieval Professional Print Quality: Achieved print outputs that match commercial prescription software Universal Navigation System: Created seamless First/Previous/Next/Last navigation that works consistently across all major pages Mobile Responsiveness: Created a fully responsive design that works on tablets and phones Type Safety: 100% TypeScript coverage with comprehensive interface definitions

Real-world Impact:

Time Savings: Reduced prescription creation time from 10 minutes to under 2 minutes Error Reduction: Eliminated handwriting interpretation errors Customer Satisfaction: Enabled quick access to prescription history and remake orders Business Growth: Digital records enabled better customer relationship management

Personal Growth:

Full-Stack Development: Built our first production-ready application from scratch User-Centered Design: Learned to prioritize user needs over technical preferences Problem-Solving: Developed skills in translating real-world problems into technical solutions

What we learned

Technical Evolution: This project transformed me from someone who could write basic code to someone who understands full-stack development. Key learnings include:

Database Design: Understanding how to model real-world relationships in PostgreSQL API Integration: Mastering Supabase's real-time features and learning environment variable management TypeScript Mastery: Discovered the power of type safety in large applications (learned it during the project!) AI-Assisted Development: Learning to collaborate effectively with AI tools while maintaining code quality Debugging Skills: Developed systematic approaches to identifying and fixing data flow issues

Working with AI Tools:

Prompt Engineering: Learned to craft specific, actionable prompts for better AI responses Chunk-based Development: Breaking complex features into smaller, manageable pieces Quality Control: Understanding when to trust AI suggestions and when to verify manually Iteration Strategy: Using AI for rapid prototyping, then refining with human expertise

Domain Expertise:

Optometry Workflows: Gained deep understanding of prescription processes and customer management Small Business Needs: Learned that simple, reliable solutions often trump complex features User Experience: Discovered the importance of intuitive design for non-technical users Print Requirements: Understanding the precision needed for professional medical documents

Problem-Solving Methodology:

Root Cause Analysis: The naming convention debugging experience taught me to trace problems systematically User-Centered Design: Spending time understanding actual workflows before building solutions Incremental Development: Building one feature at a time and testing thoroughly Documentation: Keeping track of solutions for future reference

Personal Growth:

Persistence: Learning to push through frustrating debugging sessions Attention to Detail: Understanding how small mistakes can have big consequences Resource Management: Balancing AI assistance with manual coding for optimal results Communication: Explaining technical concepts to non-technical stakeholders

What's next for Drishti

Immediate Goals (Post-Hackathon): My first priority is showing my girlfriend what I've accomplished so far - this journey has been as much about proving my dedication as it has been about solving a real problem. Once I get her father's feedback from real-world usage, I plan to implement: Phase 1: Core Enhancements

Inventory Management System: Track lens stock, frame availability, and automatic reorder alerts Database Recovery & Backup: Implement robust backup systems to prevent any data loss (learned this lesson the hard way!) Advanced Search: Enhanced customer search with filters for prescription types, purchase history, and visit frequency Mobile Optimization: Ensure the app works perfectly on tablets for bedside manner

Phase 2: Business Intelligence

Sales Analytics: Help track which products sell most, seasonal trends, and customer preferences Customer Relationship Features: Automated birthday/anniversary reminders (he really wants this!) Financial Reporting: Monthly/yearly business reports with profit analysis Appointment Scheduling: Integration with calendar systems for better customer flow management

Phase 3: Advanced Features

Multi-location Support: Enable management of multiple clinic branches Insurance Integration: Direct billing capabilities for insurance providers Prescription Renewal Alerts: Automated reminders for regular checkups Supplier Integration: Direct ordering from lens and frame suppliers

Technical Roadmap:

Offline Functionality: Ensure the app works even when internet is spotty Data Export: CSV/Excel export for external accounting software User Permissions: Multiple staff accounts with different access levels API Development: Allow integration with other clinic management tools

Long-term Vision: Transform DrishtiRx into a comprehensive SaaS platform that can serve small optometry practices across the region. The goal is to maintain the personal touch that small clinics offer while giving them the technological tools to compete with larger chains. Learning & Growth:

Continue exploring AI-assisted development with Bolt.new and similar tools Expand database design skills for handling larger datasets Study business analytics to provide more valuable insights to clinic owners Develop mobile app development skills for native applications

Community Impact: I want to help other small healthcare practices digitize their operations, proving that you don't need huge budgets to access modern technology solutions. The success with my girlfriend's father's clinic could become a template for similar businesses.

This project started as a love story but evolved into something much bigger - a testament to how personal motivation can drive innovation and how AI tools like Bolt.new can democratize software development. From knowing nothing about databases to building a production-ready healthcare management system, DrishtiRx represents not just technical achievement, but the power of determination, love, and the willingness to learn.

Built With

Share this project:

Updates