-
-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathportfolio-details1.html
217 lines (186 loc) · 13.6 KB
/
portfolio-details1.html
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
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta content="width=device-width, initial-scale=1.0" name="viewport">
<title>Project Details</title>
<meta content="" name="descriptison">
<meta content="" name="keywords">
<!-- Favicons -->
<link href="assets/img/favicon.png" rel="icon">
<link href="assets/img/apple-touch-icon.png" rel="apple-touch-icon">
<!-- Google Fonts -->
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i|Raleway:300,300i,400,400i,500,500i,600,600i,700,700i|Poppins:300,300i,400,400i,500,500i,600,600i,700,700i" rel="stylesheet">
<!-- Vendor CSS Files -->
<link href="assets/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<link href="assets/vendor/icofont/icofont.min.css" rel="stylesheet">
<link href="assets/vendor/boxicons/css/boxicons.min.css" rel="stylesheet">
<link href="assets/vendor/venobox/venobox.css" rel="stylesheet">
<link href="assets/vendor/owl.carousel/assets/owl.carousel.min.css" rel="stylesheet">
<link href="assets/vendor/aos/aos.css" rel="stylesheet">
<!-- Template Main CSS File -->
<link href="assets/css/style.css" rel="stylesheet">
</head>
<body>
<!-- ======= Mobile nav toggle button ======= -->
<button type="button" class="mobile-nav-toggle d-xl-none"><i class="icofont-navigation-menu"></i></button>
<!-- ======= Header ======= -->
<header id="header">
<div class="d-flex flex-column">
<div class="profile">
<img src="assets/img/new.png" alt="" class="img-fluid rounded-circle">
<h1 class="text-light"><a href="index.html">Pratik Kumar</a></h1>
<div class="social-links mt-3 text-center">
<a href="https://github.com/pr2tik1" class="github"><i class="bx bxl-github"></i></a>
<a href="https://www.linkedin.com/in/pratik-kumar04/" class="linkedin"><i class="bx bxl-linkedin"></i></a>
<a href="https://www.instagram.com/pratikkumar04/" class="instagram"><i class="bx bxl-instagram"></i></a>
<a href="https://twitter.com/Pratikpkb" class="twitter"><i class="bx bxl-twitter"></i></a>
<a href="https://www.facebook.com/pr2tik1" class="facebook"><i class="bx bxl-facebook"></i></a>
</div>
</div>
<nav class="nav-menu">
<ul>
<li><a href="index.html"><i class="bx bx-home"></i> <span>Home</span></a></li>
</ul>
</nav><!-- .nav-menu -->
<button type="button" class="mobile-nav-toggle d-xl-none"><i class="icofont-navigation-menu"></i></button>
</div>
</header><!-- End Header -->
<main id="main">
<!-- ======= Breadcrumbs ======= -->
<section id="breadcrumbs" class="breadcrumbs">
<div class="container">
<div class="d-flex justify-content-between align-items-center">
<h2>Portfoio Details</h2>
<ol>
<li><a href="index.html">Home</a></li>
<li>Project Details</li>
</ol>
</div>
</div>
</section><!-- End Breadcrumbs -->
<!-- ======= Portfolio Details Section ======= -->
<section id="portfolio-details" class="portfolio-details">
<div class="container">
<div class="portfolio-details-container">
<div class="owl-carousel portfolio-details-carousel">
<img src="assets/img/portfolio/portfolio_1.jpg" class="img-fluid" alt="">
</div>
<div class="portfolio-info">
<h3>Dog Image Classification</h3>
<ul>
<li><strong>Category</strong>: Deep Learning</li>
<li><strong>Project date</strong>: April, 2020</li>
<li><strong>Code URL</strong>: <a href="https://github.com/pr2tik1/dog-classifier"> github </a></li>
</ul>
</div>
</div>
<div class="portfolio-description">
<h1><strong>Objective</strong></h1>
<p>
The project aims to classify dog breeds through their RGB colored images using Deep Learning and Computer Vision techniques. The project is sub-divided into two parts, first is developed with complete scripting and second in jupyter notebook which can be deployed as web application.
</p>
<br>
<h1><strong>Tech Stack</strong></h1><p>Python, OpenCV, PyTorch, Pandas</p>
<br>
<h1><strong>Image Classification</strong></h1>
<p>
<b>Image Classification</b> is a supervised learning problem where we define a set of target classes (objects to identify in images), and train a model to recognize them using labeled example photos. The images are considered to be matrix of pixel values ranging from 0-255 which represent the intensity. Early image classification tasks were performed with data driven approaches such as Nearest Neighbour Classifier. These were not so effective approach because it comprises of compairing (L1 and L2 distances) an image from test dataset with each of the images from training data one by one. The algorithm was simple to implement but was computationally inefficient and had low accuracy on raw pixels.</p>
<br>
<div>
<p style="text-align:center;"><img src="assets/images/dog-vs-cat.jpg" alt="description of png" style="width:650px;height:300px;">
<div> <p style="text-align:center;"><i>Image Classification</i> </p></div>
</div>
<br>
<h3><strong>Multi-Layered Perceptron</strong></h3>
<p>The <b>fully connected feed-forward neural network</b> architecture (MLP) is used for Image Classification. However, they are ineffective, as flattening the images of higher pixel dependencies would result in poor precision. The MLP in the case of grayscale MNIST Digit images with low pixel dimensions performs well, but is inefficient in case of complex images (with RGB values). The number of parameters to be learned is too high for the MLP network, making the model to be computationally costlier. The high parameters also mean it will need more training data, convergence time increased and it may also lead to overfitted model archtitecture.</p>
<br>
<div>
<p style="text-align:center;"><img src="assets/images/mlp-flatten.png" alt="description of png" style="width:350px;height:280px;">
<div> <p style="text-align:center;"><i>Flattening operation of small input matrix with pixel values in MLP</i> </p></div>
</div>
<br>
<h3><strong>Convolution Neural Networks</strong></h3>
<p>The <b> CNN </b>yield better results in classifying images as compared to traditional linear and non linear classification algorithms. This is because they reduce the number of parameters to learn and there is no need of any preprocessing for feature-extraction. The CNNs uses convolutions of the image and the filter to extract complex invariant features at each layer. The complexity of features extracted increases with depth of layers (eg. [Layer 1: edges] -> [Layer 2: shapes] -> [Layer 3: pattern of shapes] -> .... -> output). They successfully capture the spatial and temporal dependancies within the image. The important features that make CNN special from others are, <b>Convolutions</b> and <b>Pooling</b>.</p>
<div>
<p style="text-align:center;"><img src="assets/images/imageclassifier.gif" alt="description of gif" style="width:800px;height:500px;">
<div> <p style="text-align:center;"><i>Image Classification using CNN</i> </p></div>
</div>
<br>
<br>
<h4>1.<i> Convolutions</i></h4>
<div>
<p style="text-align:center;"><img src="assets/images/no_padding_no_strides.gif" alt="description of gif" style="width:200px;height:220px;">
<img src="assets/images/no_padding_strides.gif" alt="description of gif" style="width:200px;height:220px;">
<img src="assets/images/no_padding_no_strides_transposed.gif" alt="description of gif" style="width:200px;height:220px;">
<img src="assets/images/full_padding_no_strides_transposed.gif" alt="description of gif" style="width:200px;height:220px;">
<br>
<div> <p style="text-align:center;"><i>Convolutions in CNN</i>, Blue: <i>Input</i> and Green: <i>Output</i></p></div>
</div>
<p>
<p>A convolution is a type of matrix operation, consisting of a kernel, a small matrix of weights, that slides over input data performing element-wise multiplication with the part of the input it is on, then summing the results into an output.
</p>These are basically merging two sets of information. Mathematically, convolution refers to combination of two function to yield third function. In the case of CNN, convolution is the application of filters/kernels to an input image resulting in activations. Feature maps are what we get on repeated applications of such filters over the input. These feature map indicate the locations learned and strength of detected feature of input, i.e., they summarize the presence of detected features in input. The simple MLP does not consider the order and importance of neighbouring pixels. CNN on other hand, as described above, takes the advantage using convolutions.</p>
<p>
The problem of feature maps is that these are sensitive to locations of features in input. One way to adress the issue is to down sample the feature map. This is addressed by <i>pooling</i>.
</p>
<h4>2.<i> Pooling</i></h4>
<p>Pooling layers provide an approach to down sampling feature maps by summarizing the presence of features in patches of the feature map. Two common pooling methods are average pooling and max pooling.
<div>
<p style="text-align:center;"><img src="assets/images/pooling.png" alt="description of gif" style="width:400px;height:400px;">
<br>
<div> <p style="text-align:center;"><i>Max Pooling and Average Pooling in CNN </i></p></div>
</div>
<br><br>
The above discussed are the reasons why I chose CNN architecture for the purpose of image classification. Further, I used pretrained models to classify the target dataset, dog images. </p>
<br>
<h3><strong>Transfer Learning</strong></h3>
<p>The <b>Transfer learning</b> approach, is utilizing the selected pretrained network and then adapting of neural network to a new (similar) dataset. The approach keeps all the convolutional layers but replacing the final fully connected layers with another neural network. The base network "transfers" the learnt features to targeted network.
</p>
<div>
<p style="text-align:center;"><img src="assets/images/transfer.jpeg" alt="description" style="width:600px;height:250px;">
</div>
</div>
<p><i>Among the wide range of pretrained CNN architecture I have chosen the classic models such as VGG, AlexNet, and ResNet. With the help of deep learning and computer vision frameworks, like PyTorch and OpenCV, I have developed the scripts to get accuarate predictions and good results over unseen data. Following are glimpses of my model classifying few test images of dogs into their breeds. To view the code and detailed results, follow link shared in the description box.</i></p>
<div>
<p style="text-align:center;"><img src="assets/images/2.png" style="width:280px;height:220px;">
<img src="assets/images/3.png" style="width:260px;height:220px;">
<img src="assets/images/5.png" style="width:260px;height:220px;">
<img src="assets/images/4.png" style="width:270px;height:220px;">
</div>
<br>
<h1><strong>References</strong></h1>
<p>
<li><a href="https://www.udacity.com/course/deep-learning-nanodegree--nd101">Udacity Deep Learning Nanodegree</a> and my <a href="https://github.com/pr2tik1/dog-classifier">Project</a></li>
<li><a href="https://cs231n.github.io/">CS231n</a></li>
<li><a href="https://d2l.ai/">Dive Deep into Deep Learning</a></li>
<li><a href="http://www.deeplearningbook.org/">Deep Learning</a></li>
<li><a href="https://machinelearningmastery.com/">Machine Learnning Mastery</a></li>
</p>
</div>
</section><!-- End Portfolio Details Section -->
<!-- Site footer -->
<footer class="site-footer">
<div class="container">
<div>
<p class="text-center">Made with Love ❤️ by <a href="https://github.com/pr2tik1">Pratik</a> | Inspired by <a href="https://bootstrapmade.com/iportfolio-bootstrap-portfolio-websites-template/">Bootstrapmade.com</a></p>
</div>
</div>
</footer>
</main><!-- End #main -->
<a href="#" class="back-to-top"><i class="icofont-simple-up"></i></a>
<!-- Vendor JS Files -->
<script src="assets/vendor/jquery/jquery.min.js"></script>
<script src="assets/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
<script src="assets/vendor/jquery.easing/jquery.easing.min.js"></script>
<script src="assets/vendor/php-email-form/validate.js"></script>
<script src="assets/vendor/waypoints/jquery.waypoints.min.js"></script>
<script src="assets/vendor/counterup/counterup.min.js"></script>
<script src="assets/vendor/isotope-layout/isotope.pkgd.min.js"></script>
<script src="assets/vendor/venobox/venobox.min.js"></script>
<script src="assets/vendor/owl.carousel/owl.carousel.min.js"></script>
<script src="assets/vendor/typed.js/typed.min.js"></script>
<script src="assets/vendor/aos/aos.js"></script>
<!-- Template Main JS File -->
<script src="assets/js/main.js"></script>
</body>
</html>