-
Notifications
You must be signed in to change notification settings - Fork 0
/
faq.html
394 lines (344 loc) · 15.1 KB
/
faq.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
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>About</title>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<!--CSS Stylesheets-->
<link rel="stylesheet" href="css/w3.css" />
<link rel="stylesheet" href="css/woza.css" />
<!--Link to Font Awesome icons-->
<link
rel="stylesheet"
href="https://use.fontawesome.com/releases/v5.4.2/css/all.css"
integrity="sha384-/rXc/GQVaYpyDdyxK+ecHPVYJSN9bmVFBvjA/9eOB+pb3F2w2N6fc5qB9Ew5yIns"
crossorigin="anonymous"
/>
<!--Link to fonts from google fonts-->
<link
href="https://fonts.googleapis.com/css?family=Oswald:300"
rel="stylesheet"
/>
<link
href="https://fonts.googleapis.com/css?family=Roboto&display=swap"
rel="stylesheet"
/>
<link rel="shortcut icon" type="image/png" href="robotfavicon.png" />
</head>
<body class="bground-color">
<!-- w3-content defines a container for fixed size centered content,
and is wrapped around the whole page content. -->
<div style="max-width: 1500px">
<!-- 1. HOME PAGE TAB -->
<div class="w3-animate-opacity w3-padding w3-margin-bottom bground-color">
<!-- 960 width region -->
<div class="w3-content w3-padding w3-white" style="max-width: 960px">
<div
class="w3-center title adjust-fontcolor logo w3-center w3-margin"
>
<h1>ABOUT</h1>
</div>
<!-- Top Bar -->
<div class="w3-center">
<p
class="
space-letters
w3-tag
bground-color
w3-text-teal w3-border w3-round
"
>
<a href="index.html"
><i class="fa fa-angle-double-left" style="font-size: 20px"></i
><b> Go back to the future...</b></a
>
</p>
</div>
<div class="bottom-margin">
<!-- Start of block -->
<div
class="
side-margin1
w3-round
text-color
space-letters
w3-margin-bottom
"
>
<p class="w3-text-pink topp-margin"><b>Design Status</b></p>
<p>This is a prototype.</p>
<p class="w3-text-pink topp-margin"><b>Purpose</b></p>
<p>
This web app uses computer vision to identify the three highest
probability diagnoses for a skin lesion. A more advanced version
could be used to identify cancerous skin lesions early.
</p>
<p class="w3-text-pink topp-margin"><b>Lesion Types</b></p>
<p>
The following descriptions were taken from this
<a class="w3-text-blue" href="https://arxiv.org/abs/1803.10417"
>research paper.</a
>
</p>
<p>
nv<br />
<span class="w3-text-teal"
>Melanocytic nevi are benign neoplasms of melanocytes and
appear in a myriad of variants, which all are included in our
series. The variants may differ significantly from a
dermatoscopic point of view.</span
>
</p>
<p>
mel<br />
<span class="w3-text-teal"
>Melanoma is a malignant neoplasm derived from melanocytes
that may appear in different variants. If excised in an early
stage it can be cured by simple surgical excision. Melanomas
can be invasive or non-invasive (in situ). We included all
variants of melanoma including melanoma in situ, but did
exclude non-pigmented, subungual, ocular or mucosal
melanoma.</span
>
</p>
<p>
bkl<br />
<span class="w3-text-teal"
>"Benign keratosis" is a generic class that includes
seborrheic ker- atoses ("senile wart"), solar lentigo - which
can be regarded a flat variant of seborrheic keratosis - and
lichen-planus like keratoses (LPLK), which corresponds to a
seborrheic keratosis or a solar lentigo with inflammation and
regression [22]. The three subgroups may look different
dermatoscop- ically, but we grouped them together because they
are similar biologically and often reported under the same
generic term histopathologically. From a dermatoscopic view,
lichen planus-like keratoses are especially challeng- ing
because they can show morphologic features mimicking melanoma
[23] and are often biopsied or excised for diagnostic
reasons.</span
>
</p>
<p>
bcc<br />
<span class="w3-text-teal"
>Basal cell carcinoma is a common variant of epithelial skin
cancer that rarely metastasizes but grows destructively if
untreated. It appears in different morphologic variants (flat,
nodular, pigmented, cystic, etc) [21], which are all included
in this set.</span
>
</p>
<p>
akiec<br />
<span class="w3-text-teal"
>Actinic Keratoses (Solar Keratoses) and intraepithelial
Carcinoma (Bowen’s disease) are common non-invasive, variants
of squamous cell car- cinoma that can be treated locally
without surgery. Some authors regard them as precursors of
squamous cell carcinomas and not as actual carci- nomas. There
is, however, agreement that these lesions may progress to
invasive squamous cell carcinoma - which is usually not
pigmented. Both neoplasms commonly show surface scaling and
commonly are devoid of pigment. Actinic keratoses are more
common on the face and Bowen’s disease is more common on other
body sites. Because both types are in- duced by UV-light the
surrounding skin is usually typified by severe sun damaged
except in cases of Bowen’s disease that are caused by human
papilloma virus infection and not by UV. Pigmented variants
exists for Bowen’s disease [19] and for actinic keratoses
[20]. Both are included in this set.</span
>
</p>
<p>
vasc<br />
<span class="w3-text-teal"
>Vascular skin lesions in the dataset range from cherry
angiomas to angiokeratomas [25] and pyogenic granulomas [26].
Hemorrhage is also included in this category.</span
>
</p>
<p>
df<br />
<span class="w3-text-teal"
>Dermatofibroma is a benign skin lesion regarded as either a
benign proliferation or an inflammatory reaction to minimal
trauma. It is brown often showing a central zone of fibrosis
dermatoscopically [24].</span
>
</p>
<p class="w3-text-pink topp-margin"><b>Image format</b></p>
<p>The app accepts images in jpg or png format.</p>
<p class="w3-text-pink topp-margin"><b>Limitations</b></p>
<p>
The Deep Learning model that powers this app is not skilled
enough to consistently assign the highest score to the correct
lesion. Although, the model is trained good enough to detect
melanoma better than others, its still not that good to be used
in real life. Also, during testing, the correct lesion was
regularly among the top 3 predicted lesions.
</p>
<p>
Note: The model was not trained using photos that were taken
with a mobile phone. Therefore, the model's prediction accuracy
could be affected by variations in the quality of mobile phone
images.
</p>
<p class="w3-text-pink topp-margin"><b>Published Design</b></p>
<p>
The design code and the step-by-step process used to train and
test the model has been published on Kaggle. You can find the
open source notebook
<a
class="w3-text-blue"
href="https://www.kaggle.com/indrashispaul/using-mobilenet-keras-tfjs-web-app/notebook"
target="_blank"
class="w3-text-blue"
>here</a
>. The test results are also available in the notebook.
</p>
<p class="w3-text-pink topp-margin"><b>Dataset Licence</b></p>
<p>
The model was trained using image
<a
class="w3-text-blue"
href="https://www.kaggle.com/kmader/skin-cancer-mnist-ham10000"
>data</a
>
that was released under a CC BY-NC-SA 4.0 licence. That means
that this app cannot be used for commercial purposes.
</p>
<hr />
<!-- FAQ Section -->
<div
class="
w3-center
title
adjust-fontcolor
logo
w3-center w3-margin
"
>
<h1 class="space-letters w3-text-pink"><b>FAQ</b></h1>
</div>
<p class="w3-text-black topp-margin">
<b
>Will I need to wait for the model to download every time I
use the app?</b
>
</p>
<p>
No. Once the model downloads it will be cached in memory. The
next time you visit this site you won’t need to wait.
</p>
<p>
That said, I suggest that you always use this tool with your web
browser set to incognito mode. The model won’t be saved, but
this will ensure that each time you visit this site you will
always use the most up to date version of the model and not the
old one that's stored in your device's memory.
</p>
<p class="w3-text-black topp-margin">
<b>What about patient data privacy?</b>
</p>
<p>
Your images are never sent to an external server. Any image you
submit stays on your computer or mobile phone. This is because
the model is running on your device. This is also why a batch of
images can be analyzed in less than two seconds.
</p>
<p>
The tech that makes this possible is called Tensorflow.js. It
was created by Google.
</p>
<p class="w3-text-black topp-margin">
<b>What do the decimal numbers mean?</b>
</p>
<p>
They are probability scores between 0 and 1. They show how
confident the model is that a particular condition is present on
the image. <br />
For example, <i>mel, Melanoma: 0.231</i> means that the model is
23% sure that the lesion shown in the image is melanoma.
</p>
<p class="w3-text-black topp-margin">
<b>How do I use this app on a computer? </b>
</p>
<p>
- Go to this site on your computer.<br />
- Click the orange button.<br />
- Select one image or multiple images and click ‘Open’.<br />
- The app will print results for each image.
</p>
<p class="w3-text-black topp-margin">
<b>How do I use this app on a mobile phone? </b>
</p>
<p>
You can take a new photo or you can submit photos that are
stored on your phone. The steps below apply to Android. iOS may
be similar but I'm not sure.
</p>
<p class="w3-text-pink"><b>[ 1 ] Take a photo</b></p>
<p>
- Go to this site on your phone.<br />
- Tap the orange button.<br />
- Select “Camera”<br />
- Take a photo<br />
- Tap the "tick"<br />
- The photo will be sent to the app for analysis.
</p>
<p class="w3-text-pink">
<b>[ 2 ] Use images from your photo folder</b>
</p>
<p>
- Go to this site on your phone.<br />
- Tap the orange button.<br />
- Tap "Files"<br />
- Tap the image name<br />
- To submit a batch of images, tap each image (tick) to select
it and then tap "Open".
</p>
<p class="w3-text-black topp-margin">
<b> What would it take to make this tool more trustworthy?</b>
</p>
<p>
Three things are needed:<br />
- Collaboration with a dermatologist/pathologist.<br />
- More high quality labeled training data.<br />
- Field testing.
</p>
<p>
AI-based Espert Systems can be brittle. Good training scores
don't guarantee that a model will perform well under real-world
conditions. This tool first needs to be field tested. Then the
model needs to be re-trained to make it more robust.
</p>
</div>
<!-- End of block -->
</div>
</div>
<!-- End of 960 width region -->
<!-- Bottom Bar -->
<div class="w3-center w3-margin-top">
<p class="space-letters">
<a
class="w3-small w3-hover-text-deep-orange text-color"
href="https://github.com/IndraP24/Skin-Cancer-Detector"
>
<b>GitHub Repo</b></a
>
||
<a
class="w3-small w3-hover-text-deep-orange text-color"
href="https://www.kaggle.com/indrashispaul/using-mobilenet-keras-tfjs-web-app/notebook"
>
<b>Kaggle Notebook</b></a
>
</p>
</div>
</div>
<!--END OF FAQ PAGE TAB-->
</div>
<!-- w3-content -->
</body>
</html>