Inspiration
In the past, I built BeachLens, a beach safety app that reached 30,000+ users answering the question of is it safe to go to the beach?
Beaches have flags, lifeguards, and routine water testing; lakes, springs, and rivers don't. Yet:
- Among kids' open-water drownings, only 3.8% happen in the ocean.
- Florida has posted over 100 algae alerts for lakes and rivers this year, each buried in a separate county PDF.
What it does
LakeLens answers "Is it safe to go?" for 23,470 freshwater spots nationwide.
Each park shows one status first, then the reason and source, plus:
- Algae alerts
- Weather warnings
- Activities and amenities
- Hours
- Nearby parking
No data means no status, never a guess.
How we built it
Stack: I used Next.js, React, and TypeScript, deployed on Vercel and Supabase with hourly Edge Functions pulling from 8 free public sources, including the National Weather Service, USGS, and Florida DEP; MapLibre for the map.
1. Design first I focused first on creating a beautiful UI that has a minimalistic look and a color pallete that matched the lake/forest vibe. Additionally I wanted to make data as simple and accessible as possible so I structured a lot into components and graphics to make it easier for users to identify what information is key. I believe that a good design allows the user to absorb better all the information, which is especially important if its safety-related information.
2. Community reports After adding Features such as reports, which allows to grow a community to further improve the information and reliability as they can update the information of the parks...
3. Data collection ...I focused primarily on data collection and investigating all the public sources, adding images and onboarding as many lakes, rivers, and springs as possible.
4. Database and deployment Then I had to deploy them into Supabase after structuring how the data needed to be displayed. After that, a quick CI/CD pipeline in GitHub helped to set up the deployment in Vercel.
Challenges we ran into
Onboarding many lakes has caused many difficulties, as:
- Filtering between saltwater and freshwater
- Investigating parking spots
- Identifying good images
...all increased the complexity of the project, as it initially started only in Florida and expanded nationwide. So I optimized for a select, very detailed set of onboarded lakes in Florida while keeping the basic information for other states.
Accomplishments that we're proud of
BeachLens took months to build, but LakeLens was a project where I was able to find 3,470 spots automatically from open data, making it much easier to complete one state in terms of data collection. I am proud of being able to accelerate the onboarding and development of an MVP this quickly.
What we learned
I have learned far more about the problems that exist with water, as my previous knowledge only encompassed beaches. This allowed me to deep dive better into the problems that exist in lakes, rivers, and springs, which exist nationwide, as states do not need to be on the coast to have these.
What's next for LakeLens
Improving the data quality and depth! I would also like to show this MVP to BeachLens' users, as they have requested it a lot!
Built With
- next.js
- react
- supabase
- typescript
- vercel
Log in or sign up for Devpost to join the conversation.