Introduction

In today's digital world, distinguishing between real and fake images has become a significant challenge. With the rise of Generative Adversarial Networks (GANs), AI-generated images are becoming more convincing. This inspired me to develop a Fake vs Real Image Detection Web App, leveraging deep learning and Flask to classify images as either real (captured by a camera) or fake (AI-generated).

In this blog, I’ll walk you through the development process, the technologies used, and how you can try the app yourself!

🚀 The Idea Behind the Project

With social media manipulation and fake news spreading rapidly, detecting AI-generated images is essential. This project aims to:

✅ Allow users to upload an image and determine if it's real or fake. ✅ Use a deep learning model to classify images accurately. ✅ Provide a simple web interface using Flask, HTML, and CSS. ✅ Display the uploaded image along with the result.

This tool is particularly useful for journalists, content creators, and anyone concerned about the authenticity of images they encounter online.

🛠️ Technologies Used

This project combines deep learning with web development to create an interactive tool:

• TensorFlow/Keras: For training the Convolutional Neural Network (CNN) model.
• Flask: Lightweight Python framework for backend development.
• HTML, CSS: For the frontend design.
• Bootstrap: For styling and responsiveness.
• Heroku / Render / PythonAnywhere: For deploying the web application.

📌 How the Web App Works

1️⃣ Upload an Image

Users can visit the website and upload an image in JPG, JPEG, or PNG format.

2️⃣ Image Processing & Prediction

Once uploaded, the image is processed through a Convolutional Neural Network (CNN) that has been trained to classify real vs fake images.

3️⃣ Display the Result

The app shows whether the image is Real or Fake, along with a preview of the uploaded image.

🏗️ Project Structure

project-folder/
├── app.py                 # Flask backend
├── fake_vs_real_cnn_model.h5  # Trained deep learning model
├── requirements.txt       # Dependencies
├── Procfile               # Deployment configuration
├── uploads/               # Folder for uploaded images
├── templates/             # HTML templates
│   ├── upload.html        # Image upload page
│   ├── result.html        # Prediction result page
└── README.md              # Documentation

🎯 Model Training

The core of this project is the CNN model, trained on a dataset containing 1709 labeled images: ✅ Real images: Photos taken from actual cameras. ✅ Fake images: AI-generated images using GANs.

Training Summary:

• Input Size: 128x128 pixels
• Layers: Multiple Conv2D, MaxPooling, Flatten, Dense layers
• Activation: ReLU & Sigmoid for binary classification
• Loss Function: Binary Crossentropy
• Optimizer: Adam
• Accuracy Achieved: Over 97% on validation data

💻 Running the Web App Locally

Want to try it on your local machine? Follow these steps:

1️⃣ Install Dependencies

pip install -r requirements.txt

2️⃣ Run the Flask App

python app.py

3️⃣ Open in Browser

Go to http://127.0.0.1:5000/ and start testing your images!

🌎 Deployment (Make it Public!)

This app can be deployed using Heroku, Render, or PythonAnywhere.

Deploying on Heroku:

heroku login
heroku create fake-vs-real-image-app
heroku git:remote -a fake-vs-real-image-app
git push heroku main

After deployment, the app will be available at:

https://fake-vs-real-image-app.herokuapp.com/

🖼️ Screenshots

Upload Page

Result Page

🔥 Future Enhancements

✅ Confidence Score: Display how confident the model is about its prediction. ✅ Multi-Image Upload: Allow users to upload multiple images at once. ✅ More Advanced AI Models: Use Transformers or ViTs (Vision Transformers) for better accuracy. ✅ Better UI/UX: Enhance the frontend with ReactJS or Bootstrap 5.

⭐ Try it Yourself!

The full project code is available on GitHub. Feel free to contribute, fork, or star the repository! ⭐

🔗 GitHub Repo: https://github.com/codersattu/Image-Detection-WebApp-using-Deep-Learning

Let me know if you try it out! 🚀