Trust_Trace/PRESENTATION.html at main · anucoder01/Trust_Trace · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>TrustTrace - Presentation Notes & Technical Reference</title>
    <style>
        body { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; line-height: 1.6; color: #333; max-width: 900px; margin: 0 auto; padding: 20px; background: #f5f7fa; }
        h1 { color: #2c3e50; border-bottom: 2px solid #3498db; padding-bottom: 10px; }
        h2 { color: #2980b9; margin-top: 30px; border-bottom: 1px solid #ddd; padding-bottom: 5px; }
        h3 { color: #16a085; margin-top: 20px; }
        .slide { background: white; padding: 20px; margin-bottom: 20px; border-radius: 8px; box-shadow: 0 2px 5px rgba(0,0,0,0.1); }
        .slide-title { font-weight: bold; font-size: 1.4em; color: #e74c3c; margin-bottom: 10px; }
        .highlight { background: #fff3cd; padding: 2px 5px; border-radius: 3px; font-weight: bold; }
        .faq-q { font-weight: bold; color: #8e44ad; margin-top: 15px; }
        .faq-a { margin-left: 20px; color: #555; margin-bottom: 15px; }
        ul { margin-top: 10px; }
        li { margin-bottom: 8px; }
    </style>
</head>
<body>

    <h1>TrustTrace - Complete Technical Reference & Presentation Guide</h1>
    <p><em>Comprehensive manual covering ML algorithms, CV modules, system analysis, and interview FAQs. Use this to prepare for your presentation and Q&A.</em></p>

    <div class="slide">
        <div class="slide-title">1. Technical Details & Machine Learning Algorithms</div>

        <h3>Soft-Voting Ensemble Model (SVM, Random Forest, XGBoost/GB, LR, KNN)</h3>
        <p><strong>What it is:</strong> Instead of relying on a single algorithm, TrustTrace now uses a powerful "Soft-Voting" Ensemble Classifier. It combines 5 different machine learning algorithms: Support Vector Machine (SVM), Random Forest, Gradient Boosting (XGBoost logic), Logistic Regression, and K-Nearest Neighbors (KNN).</p>
        <p><strong>Where & Why:</strong> Used in `train.py` and `main.py` as our core decision engine. A single algorithm might have biases (e.g., SVM is great for high dimensions, Random Forest handles non-linear splits well). By ensembling them together, each algorithm "votes" on the probability of forgery, and the system averages their confidence scores for a vastly more robust and accurate prediction!</p>

        <h3>Histogram of Oriented Gradients (HOG)</h3>
        <p><strong>What it is:</strong> A feature descriptor used in computer vision. Instead of looking at raw pixels, HOG looks at the *direction* and *intensity* of edges (gradients) in an image.</p>
        <p><strong>Where & Why:</strong> Used in both training and the FastAPI verification endpoint. Raw pixels vary wildly due to lighting, pen color, and slight shifts. HOG strips away the noise and captures the fundamental geometric shape and structure of the signature.</p>

        <h3>Explainable AI (Pseudo Grad-CAM)</h3>
        <p><strong>What it is:</strong> A visual heatmap overlaid on the signature that shows the user exactly *why* a decision was made, highlighting areas of high density or abnormal structural thickness.</p>
        <p><strong>Where & Why:</strong> Generated via OpenCV in the backend. Instead of a "Black Box" that just says "Fake", the heatmap empowers the bank teller with visual evidence, building trust in the AI system.</p>
    </div>

    <div class="slide">
        <div class="slide-title">2. Computer Vision (OpenCV) Modules Used</div>

        <h3>Canny Edge Detection & Gaussian Blur (Edge Jitter Ratio)</h3>
        <p><strong>Where:</strong> Micro-Tremor Analysis function.</p>
        <p><strong>Why:</strong> When a forger traces a signature, they move slowly, causing microscopic hand jitters. We detect this by comparing raw edges (Canny) to artificially smoothed edges (Gaussian Blur + Canny). A high difference means the stroke is jagged (jittery) rather than ballistic and fluid.</p>

        <h3>Thresholding & Contour Detection (Ink Blot Ratio)</h3>
        <p><strong>Where:</strong> Micro-Tremor Analysis function.</p>
        <p><strong>Why:</strong> Forgers often pause or hesitate to look at the original signature. When a pen stops moving, ink pools and creates a "blot". We use Thresholding to separate ink from paper, and Contour Area Detection to find localized regions where the ink is unusually thick.</p>

        <h3>Distance Transform & JET Colormap (Heatmap)</h3>
        <p><strong>Where:</strong> Explainable AI heatmap generation.</p>
        <p><strong>Why:</strong> The Distance Transform calculates how far every ink pixel is from the background. We apply a JET Colormap (which turns low values blue and high values red) to highlight the thickest, most unnatural parts of the signature stroke for visual inspection.</p>
    </div>

    <div class="slide">
        <div class="slide-title">3. System Advantages vs Disadvantages</div>

        <h3>Advantages (Our Strong Sides)</h3>
        <ul>
            <li><strong>Explainability over Black-Boxes:</strong> Most existing systems just output a score. TrustTrace provides a visual heatmap and specific micro-tremor statistics (Ink Blot, Jitter), making it a true "Teller-Assist" tool rather than a replacement.</li>
            <li><strong>Lightweight & Fast:</strong> By utilizing HOG + SVM instead of heavy CNNs (like ResNet or VGG), our inference time is incredibly fast (under 150ms) and can run on standard bank teller hardware without expensive GPUs.</li>
            <li><strong>Multi-Layered Defense:</strong> It doesn't just look at the overall shape. It looks at the *physics* of the stroke (micro-tremors) which easily catches skilled forgers who trace perfectly.</li>
        </ul>

        <h3>Disadvantages & Limitations</h3>
        <ul>
            <li><strong>Static vs Dynamic:</strong> The current backend only analyzes the final scanned image (static). True temporal data (speed, pressure) requires specialized stylus hardware during the signing process, which isn't available for paper cheques.</li>
            <li><strong>Background Noise:</strong> HOG feature extraction can be thrown off by noisy backgrounds (e.g., printed lines on a cheque) if the thresholding step fails to isolate the ink perfectly.</li>
        </ul>
    </div>

    <div class="slide">
        <div class="slide-title">4. Interview FAQs (30 Questions)</div>

        <div class="faq-q">1. What is TrustTrace?</div>
        <div class="faq-a">TrustTrace is an AI-powered banking-grade platform designed to detect signature forgery using Computer Vision, Machine Learning, and Micro-Tremor analysis.</div>

        <div class="faq-q">2. Why use an Ensemble instead of Deep Learning?</div>
        <div class="faq-a">Deep learning (CNNs) requires expensive GPUs and massive datasets. By using a Soft-Voting Ensemble (SVM, Random Forest, Gradient Boosting, Logistic Regression, and KNN), we get extremely robust accuracy by averaging 5 distinct algorithms, while still keeping inference time under a few milliseconds locally.</div>

        <div class="faq-q">3. What is HOG (Histogram of Oriented Gradients)?</div>
        <div class="faq-a">It's a feature extraction technique that counts occurrences of gradient orientation in localized portions of an image. It helps the model focus on the shape of the signature rather than lighting or color.</div>

        <div class="faq-q">4. How do you detect traced forgeries?</div>
        <div class="faq-a">We use OpenCV to analyze "Micro-Tremors." When humans trace, they move slowly, causing jagged edges (Jitter) and pen pauses (Ink Blots). Fluid, genuine signatures lack these artifacts.</div>

        <div class="faq-q">5. What is the Edge Jitter Ratio?</div>
        <div class="faq-a">It is a mathematical ratio comparing the raw, jagged edges of the signature to a mathematically smoothed version. Higher difference means higher jitter (forgery risk).</div>

        <div class="faq-q">6. What is the Ink Blot Ratio?</div>
        <div class="faq-a">It calculates the proportion of unusually thick ink clusters (detected via Contour finding) over the total ink area. It indicates hesitation.</div>

        <div class="faq-q">7. How is your Explainable AI Heatmap generated?</div>
        <div class="faq-a">Since we use an SVM, we simulate a Grad-CAM approach using OpenCV's Distance Transform to find structural anomalies, applying a JET colormap to highlight high-density areas in red.</div>

        <div class="faq-q">8. Why did you choose FastAPI for the backend?</div>
        <div class="faq-a">FastAPI is modern, extremely fast, natively supports asynchronous requests (async/await), and handles multipart form data (image uploads) effortlessly.</div>

        <div class="faq-q">9. How does the frontend communicate with the backend?</div>
        <div class="faq-a">The Vanilla JS frontend converts the HTML canvas drawing into a Blob, attaches it to a FormData object, and uses the standard HTTP `fetch` API to send a POST request to FastAPI.</div>

        <div class="faq-q">10. What is CORS and why is it used?</div>
        <div class="faq-a">Cross-Origin Resource Sharing (CORS) is a security feature. We enabled it in FastAPI so our frontend (running on a different local port or file protocol) is permitted to request data from the backend.</div>

        <div class="faq-q">11. How does the system handle different pen colors?</div>
        <div class="faq-a">The very first step in our pipeline converts the image to Grayscale and applies binary thresholding, making the model entirely invariant (blind) to the original ink color.</div>

        <div class="faq-q">12. What dataset did you use?</div>
        <div class="faq-a">We architected the system to support standard academic datasets like CEDAR or Kaggle signature datasets, containing pairs of genuine and forged samples.</div>

        <div class="faq-q">13. What metrics are used to evaluate the ML model?</div>
        <div class="faq-a">We use Accuracy, Precision, Recall, and F1-Score. For banking, Recall on forgeries is critical because missing a forgery (False Negative) costs the bank money.</div>

        <div class="faq-q">14. How does image resizing affect your system?</div>
        <div class="faq-a">All images are resized to a fixed dimension (256x128) before HOG extraction. This ensures the feature vector size is strictly consistent, which is required by the SVM.</div>

        <div class="faq-q">15. What is the precision/recall trade-off here?</div>
        <div class="faq-a">If we make the system too strict, we catch all forgeries (high recall) but reject genuine signatures (low precision, annoying customers). We balance this using probability thresholds.</div>

        <div class="faq-q">16. What does `cv2.threshold` do in your code?</div>
        <div class="faq-a">It converts the grayscale image into a pure black-and-white binary image. We use Otsu's method, which automatically calculates the optimal threshold value to separate ink from paper.</div>

        <div class="faq-q">17. What is a "Distance Transform"?</div>
        <div class="faq-a">An OpenCV operation that calculates the distance from every foreground pixel (ink) to the nearest background pixel. The exact center of a thick stroke gets the highest value.</div>

        <div class="faq-q">18. Why use a Blob instead of Base64 to send the image?</div>
        <div class="faq-a">Converting the canvas to a Blob and sending it via FormData is more memory-efficient and standard for file uploads compared to encoding large images into Base64 strings.</div>

        <div class="faq-q">19. How is the overall Tremor Risk Score calculated?</div>
        <div class="faq-a">It is a weighted ensemble of the Edge Jitter Ratio (weighted at 70%) and the Ink Blot Ratio (weighted at 30%), tailored to emphasize stroke smoothness.</div>

        <div class="faq-q">20. What happens if the backend server is down?</div>
        <div class="faq-a">The frontend will catch the network error via the `catch` block in the `fetch` promise, and display a user-friendly Toast notification saying the ML service is unreachable.</div>

        <div class="faq-q">21. Is this system scalable?</div>
        <div class="faq-a">Yes. FastAPI combined with Uvicorn (an ASGI server) can handle thousands of concurrent requests, and the SVM inference takes only milliseconds per image.</div>

        <div class="faq-q">22. What is Concept Drift in the context of signatures?</div>
        <div class="faq-a">A person's signature naturally changes over years due to aging or health. A static model will eventually reject them. TrustTrace's architecture includes plans for an Adaptive Learning module to update user profiles over time.</div>

        <div class="faq-q">23. How does TrustTrace beat human tellers?</div>
        <div class="faq-a">Tellers suffer from fatigue and can only verify the macroscopic shape. TrustTrace never tires and analyzes microscopic artifacts (HOG gradients, edge jitter) invisible to the naked eye.</div>

        <div class="faq-q">24. What are the limitations of HOG?</div>
        <div class="faq-a">HOG relies strictly on spatial grids. If a signature is rotated significantly, the HOG features will change drastically, leading to a false negative. We would need rotation alignment to fix this.</div>

        <div class="faq-q">25. How do you prevent False Positives?</div>
        <div class="faq-a">By fusing the SVM output with the Micro-Tremor analysis. If the SVM is unsure, but the stroke is perfectly ballistic (no jitter), the system can lean towards approving the transaction.</div>

        <div class="faq-q">26. Could you use PyTorch instead?</div>
        <div class="faq-a">Yes. The backend is completely modular. We could swap the SVM with a PyTorch ResNet model inside the FastAPI route without modifying the frontend at all.</div>

        <div class="faq-q">27. What is `joblib` used for?</div>
        <div class="faq-a">Joblib is used to serialize (save) and deserialize (load) the trained Scikit-Learn SVM model from the disk into the active FastAPI memory.</div>

        <div class="faq-q">28. How do you handle noisy backgrounds like cheque watermarks?</div>
        <div class="faq-a">Currently, OTSU thresholding attempts to remove light watermarks. For complex backgrounds, we would need to implement an advanced background subtraction or deep learning segmentation model.</div>

        <div class="faq-q">29. What does `predict_proba` do?</div>
        <div class="faq-a">Instead of just returning 1 or 0 (Genuine/Forged), it returns the mathematical probability/confidence of the prediction, allowing the UI to show a "Confidence Score" percentage.</div>

        <div class="faq-q">30. How would you deploy this to production?</div>
        <div class="faq-a">We would containerize the backend using Docker, host it on AWS ECS or Google Cloud Run, and serve the static frontend files via a CDN like AWS CloudFront or Vercel.</div>
    </div>

</body>
</html>