Animal Scan Next is a web application that allows users to upload an image of an animal and receive information about the animal in the image. The app uses Azure Computer Vision API to identify the animal and OpenAI API to fetch relevant information.
- Identify animals in images using Azure Computer Vision API
- Fetch relevant information about the identified animal using OpenAI API
- Display structured information, including scientific name, habitat, diet, physical characteristics, behavior, and conservation status
- Responsive design for mobile and desktop users
- Built with Next.js 13 and Tailwind CSS
A live demo of the app is available at https://nates-animal-scanner.netlify.app/.
To use the app, follow these steps:
- Visit the Animal Scan Next homepage.
- Click the "Upload Image" button and select an image of an animal from your device.
- Wait for the image to be processed and analyzed.
- The app will display the name of the animal, an AI-generated caption, and structured information about the animal.
This project is built using the following technologies:
- Next.js 13
- Tailwind CSS
- Azure Computer Vision API
- OpenAI API
- React
- React Ionicons
Follow these steps to install the Animal Scan Next app on your local machine:
- Clone the repository:
git clone https://github.com/natejahnke/animal-scan-next.git - Change to the project directory:
cd animal-scan-next - Install dependencies:
npm installoryarn install - Create a
.envfile in the root directory and add your Azure Computer Vision API key and OpenAI API key: NEXT_PUBLIC_SUBSCRIPTION_KEY= NEXT_PUBLIC_ENDPOINT= OPENAI_API_KEY= - Start the development server:
npm run devoryarn dev - Open http://localhost:3000 in your browser to view the app.
If you encounter any issues or have questions about the app, please open an issue on the GitHub repository.
Future improvements and features planned for Animal Scan Next include:
- Enhance user interface and user experience
Nate Jahnke - GitHub
Project Repository: https://github.com/natejahnke/animal-scan-next