Fishpedia is an interactive fishing companion app designed to make fishing more engaging and educational for children and families. By scanning and identifying fish, users can build their own digital fish collection while learning fun facts about each species.
The project is built with Next.js and integrates a local machine learning model to identify fish from images.
For many families, it’s always a struggle to prevent children from getting bored while they’re fishing.
Fishpedia bridges the gap between interest and engagement by letting kids scan and collect fish, build their own collection, and learn fun facts to share with their families.
Instead of waiting around, kids become active explorers discovering fish species, collecting them digitally, and sharing what they learn with the people around them.
▶ Click the video above to watch the Fishpedia demo
- Next.js – React framework for the frontend
- Python – Runs the fish identification model
- PyTorch – Machine learning framework
- Hugging Face Transformers – Model loading
- Pillow – Image processing
- Node.js – Development environment
Install dependencies:
npm installor
yarn installRun the development server:
npm run devThen open:
http://localhost:3000
The Fish for Real page identifies fish using a local Python machine learning model.
Since the Python virtual environment is not committed to the repository, each developer must set it up locally.
From the repository root:
python3 -m venv .venv-fish3d.venv-fish3d/bin/pip install torch torchvision transformers pillowThis project runs on port 3001:
npm run dev -- -H 127.0.0.1 -p 3001Then open:
http://localhost:3001
Fishpedia uses a pre-trained fish classification model from Hugging Face:
https://huggingface.co/beercan/fish-classification
Key details:
- The model is automatically downloaded the first time it runs.
- Model files are cached locally in:
~/.cache/huggingface/
- The Python inference script is located in:
tools/fish_id
- The Next.js API route calls the Python environment at:
.venv-fish3d/bin/python
Make sure the virtual environment exists before running the app.
public/ # Static assets
src/ # Next.js application source code
tools/
└── fish_id/ # Python fish identification model
- The app automatically reloads during development.
- Fonts are optimized using next/font with the Geist font family.
- Fish recognition runs locally through Python and is triggered through a Next.js API route.
Possible future features:
- Cloud-based fish recognition
- Gamified fish collection system
- Achievements and badges for kids
- Educational quizzes about marine life
- Offline-friendly mobile version
- Family fishing leaderboards
Fishpedia transforms fishing into a fun learning adventure helping families explore nature together while keeping kids curious and engaged.