-
Notifications
You must be signed in to change notification settings - Fork 0
/
ai.html
161 lines (150 loc) · 8.69 KB
/
ai.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
<!DOCTYPE html>
<html>
<head>
<title>Deep Patel</title>
<!--Icon-->
<link rel="shortcut icon" type="image/x-icon" href="favicon.png">
<!--Fonts-->
<link rel="preconnect" href="https://rsms.me/">
<link rel="stylesheet" href="https://rsms.me/inter/inter.css">
<!--CSS-->
<link rel="stylesheet" href="styles/general.css">
<link rel="stylesheet" href="styles/header.css">
<link rel="stylesheet" href="styles/body.css">
<link rel="stylesheet" href="styles/ai.css">
<!--JavaScript-->
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="script.js" defer></script>
<!--Open other webpages-->
<script>
function openHTML(destination) {
window.location.href = destination;
}
</script>
</head>
<body>
<!--HEADER-->
<div class="header">
<div class="left-section">
<img class="logo" src="images/logo2.png" onclick="window.location.href='index.html';">
</div>
<div class="right-section">
<div class="github-link">
<a href="https://github.com/DeepThePatel" target="_blank"><img src="images/github.png" title="GitHub" width="30px" height="30px"></a>
</div>
<div class="linkedin-link">
<a href="https://www.linkedin.com/in/deep-patel-a867a3170/" target="_blank"><img src="images/linkedin.png" title="LinkedIn" width="30px" height="30px"></a>
</div>
<div class="instagram-link">
<a href="https://www.instagram.com/dc4.deep/" target="_blank"><img src="images/instagram.png" title="Instagram" width="30px" height="30px"></a>
</div>
<div class="achievements">
<!--Medal icon created by Freepik - Flaticon https://www.flaticon.com/free-icons/medal -->
<img src="images/achievements.png" onclick="openHTML('achievements.html')" title="Achievements" width="30px" height="30px">
</div>
<div id="pdfContainer" class="resume-section">
<div class="resume-link" onclick="window.location.href='Resume_DeepPatel.pdf';">
<p>Resume</p>
</div>
</div>
</div>
</div>
<div class="header-background"></div>
<div class="introduction">
<p class ="name" style="margin-top:72px;">Artifical Intelligence Project</p>
<br>
<p class="date">FALL 2023</p>
<br>
<br>
</div>
<!--RESOURCES-->
<div class="resources">
<h5 class="title">RESOURCES</h5>
<a href="https://github.com/DeepThePatel/Binary-Classification-on-Images" target="_blank" rel="noopener noreferrer" title="https://github.com/DeepThePatel/Binary-Classification-on-Images">GitHub Repository ↗</a>
<br>
<br>
<a onclick="window.open('ai_report.pdf', '_blank');">View Full Project Report ↗</a>
<br>
<br>
<a href="https://www.youtube.com/watch?v=l0urnBij-W0&feature=youtu.be" target="_blank" rel="noopener noreferrer" title="https://www.youtube.com/watch?v=l0urnBij-W0&feature=youtu.be">Video Demo ↗</a>
</div>
<!--Overview-->
<div style="margin-bottom: 90px;">
<h5 class="title">LEARNING OUTCOMES</h5>
<ul>
<li>Machine Learning and Artifical Intelligence concepts</li>
<li>The use of convolutional neural networks</li>
<li>How to implement binary classification</li>
<li>How to perform data analysis using images</li>
<li>How to train and test a model</li>
<li>Generating data visualizations of test results</li>
<li>How to develop a basic chatbot</li>
<li>The use of Keras and PyTorch libraries</li>
</ul>
<br>
<br>
<h5 class="title">OVERVIEW</h5>
<p class="sub-content">
This is a project I completed in my Artificial Intelligence class. Over the course of the semester, I learned about the logisitics of AI and was to use that knowledge to create a model that would use machine learning/AI to solve an issue that I was to come up with.
<br>
<br>
The problem that I chose was to look at how effectively machine learning could be used in quality control in the manufacturing industry. To tackle this problem, I acquired a <a href="https://www.kaggle.com/datasets/concaption/pepsico-lab-potato-quality-control" style="text-decoration: underline;">dataset</a> online which consisted of images of defective and non-defective potato chips. These images were split into Train and Test directories and further into Defective and Non-Defective subdirectories. Using this dataset, I was able to create a model that implemented binary classification using the PyTorch and Keras libraries.
<br>
<br>
Below are the results of my research.
</p>
</div>
<!--Body-->
<!--Modal-->
<div id="myModal" class="modal">
<span class="close">×</span>
<img class="modal-content" id="modalImg">
</div>
<div>
<h5 class="title">CHATBOT</h5>
<p class="sub-content" style="font-style: italic;">Chatbot is rule-based and can be found <a href="https://github.com/DeepThePatel/CSCE580-Fall2023-DeepPatel-Repo/blob/main/code/chatbot.ipynb" style="text-decoration: underline;">here.</a> This example shows how to run the model with both libraries in the chatbot, random <a href="https://github.com/DeepThePatel/CSCE580-Fall2023-DeepPatel-Repo/blob/main/code/chitchat.txt" style="text-decoration: underline;">chitchat</a> has also been implemented. Click the images to enlargen.</p>
<img class="img img-modal" src="images/ai-images/current-chatbot-example.png">
<br>
<br>
<h5 class="title">KERAS</h5>
<p class="sub-content" style="font-style: italic;">Model checkpoints were used to save the model to mitigate retraining and save time when called in the chatbot. The epoch with the best accuracy is saved to the checkpoint file.</p>
<img class="img img-modal" src="images/ai-images/keras-train.png">
<br>
<br>
<img class="img img-modal" src="images/ai-images/keras-plot.png">
<br>
<br>
<img class="img img-modal" src="images/ai-images/keras-table.png">
<br>
<br>
<h5 class="title">PYTORCH</h5>
<img class="img img-modal" src="images/ai-images/pytorch-plot.png">
<br>
<br>
<img class="img img-modal" src="images/ai-images/pytorch-table.png">
<br>
<br>
<p class="sub-content" style="font-style: italic;">After fixing an error where the model was being evaluated twice during training, my model improved in runtime but showed no significant change in accuracy.</p>
<img class="img img-modal" src="images/ai-images/pytorch-table2.png">
<br>
<br>
<h5 class="title">COMPARISON WITH GOOGLE BARD</h5>
<p class="sub-content" style="font-style: italic;">The first 10 images from the Test/Defective and Test/Nondefective directories were used. The query "Is this chip defective?" was used.</p>
<img class="img img-modal" src="images/ai-images/bard-results.png" style="margin-bottom: 80px;">
</div>
<div style="margin-bottom: 80px;">
<h5 class="title">CONCLUSIVE REMARKS</h5>
<p class="sub-content">As a result of my research, I found that using the PyTorch library returns a higher accuracy of about 3%, but with a slower runtime of about 5 minutes. So in conclusion, it would be in a manufacturer's best interest to utilize the PyTorch library when using AI for quality control since accuracy is the most important factor. However, if runtime is an issue, then performing the classification using Keras would be the better option.</p>
</div>
<hr class="hr">
<div class="footer" style="font-size: 12px;">
<p style=>
<span style="color: rgb(100,255,218);">Email:</span> [email protected]
</p>
<p>
This website was published using Github Pages
</p>
</div>
</body>
</html>