-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
275 lines (242 loc) · 14.9 KB
/
Copy pathindex.html
File metadata and controls
275 lines (242 loc) · 14.9 KB
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>USC Data Science - Phishing Data Insights</title>
<!-- Bootstrap Core CSS -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<!-- Scrolling Nav CSS -->
<link href="css/scrolling-nav.css" rel="stylesheet">
<!-- Custom CSS -->
<link href="css/styles.css" rel="stylesheet">
</head>
<!-- The #page-top ID is part of the scrolling feature - the data-spy and data-target are part of the built-in Bootstrap scrollspy function -->
<body id="page-top" data-spy="scroll" data-target=".navbar-fixed-top">
<!-- Navigation -->
<div id="nav-main">
<nav class="navbar mav-main navbar-default navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header page-scroll">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand page-scroll" href="#page-top" style="color:white">Home</a>
</div>
<div class="collapse navbar-collapse navbar-ex1-collapse">
<nav id="nav-wrap">
<ul class="nav navbar-nav navbar-custom">
<!-- Hidden li included to remove active class from about link when scrolled up past about section -->
<li class="hidden"><a class="page-scroll" href="#page-top" style="color:white"></a></li>
<li><a class="page-scroll" href="#about" style="color:#ffffff">About</a></li>
<li><a class="page-scroll" href="#features" style="color:#ffffff">Teams</a></li>
<li><a class="page-scroll" href="#search" style="color:#ffffff">Search</a></li>
<li><a class="page-scroll" style="color:#ffffff" href="#learn-more">Partners</a></li>
</ul>
</nav>
<a href="http://usc.edu" class="pull-right">
<img src="images/usc-primary-logotype.svg" width="176px" height="38px">
</a>
</div>
</div>
</nav>
</div>
<!-- Intro Section -->
<div>
<section id="intro" class="intro-section" style="background-image: url('images/phishing-cybersecurity-banner.png'); opacity: 1.0;background-attachment: fixed; background-size: cover;
background-repeat: no-repeat;">
<div class="container" style="padding-top:100px">
<div class="row">
<div class="col-lg-12" >
<h1 class="title">Phishing Data Insights</h1>
<br><a style="text-decoration: none;" href="http://irds.usc.edu/"><h3 id="irdsgroup">USC Data Science</h3></a>
</div>
</div>
<div class="row" style="padding-top:15px">
<div class="col-md-12">
<a class="btn btn-default btn-lg page-scroll" href="#about" style="margin-top:5%">Learn More</a>
</div>
</div>
<div class="row" style="padding-top:30px">
<div class="col-md-12">
<a class="btn btn-default btn-lg page-scroll" href="html/d3-examples.html">Explore Visualizations</a>
</div>
</div>
</div>
</section>
</div>
<!-- About Section -->
<div>
<section id="about" class="about-section" style="margin-top:-1%; margin-bottom:5%">
<div class="container">
<div class="row">
<hr class="about-divider">
<h1>About Us</h1>
<hr class="about-divider">
<div class="jumbotron" style="margin-bottom:5%; margin-top:3%">
<h2>What is Phishing Data Insights?</h2>
<p class="lead text-left" style="margin-top:2%">This site presents Spring 2021 DSCI 550 student work on phishing and fraudulent email data. The assignment asked teams to turn phishing datasets into a web data visualization site: extract and summarize the raw data, convert the results into JSON/CSV/TSV for D3, build browser-based visualizations, and connect the work to larger-scale search and exploration tools such as Solr, ImageSpace/ImageCat, and GeoParser.</p>
<p class="lead text-left">Students explored how fraudulent messages vary by time, sender geography, subject and body vocabulary, urgency, attacker titles, social-engineering cues, language style, and pairwise similarity. The local archive includes the <a href="https://www.kaggle.com/datasets/rtatman/fraudulent-email-corpus" target="_blank">Kaggle Fraudulent E-mail Corpus</a> used for fraudulent message analysis, plus a copy of Phishing_Legitimate_full.arff, which corresponds to Choon Lin Tan's <a href="https://data.mendeley.com/datasets/h3cgnj8hft/1" target="_blank">Mendeley phishing feature dataset</a>.</p>
</div>
<div class="col-md-4">
<div class="media">
<div class="media-left">
<img class="media-object" src="images/searchimg.jpg" alt="...">
</div>
<div class="media-body">
<h4 class="media-heading">Data Integration & Search</h4>
Connecting phishing email content, sender metadata, inferred geography, and extracted keywords into queryable datasets for visualization and search.
</div>
</div>
</div>
<div class="col-md-4">
<div class="media">
<div class="media-left">
<img class="media-object" src="images/visualimg.jpg" alt="...">
</div>
<div class="media-body">
<h4 class="media-heading">Interactive Visualizer</h4>
D3.js charts, heatmaps, bubble charts, histograms, and circular bar plots created from the enriched fraudulent-email dataset.
</div>
</div>
</div>
<div class="col-md-4">
<div class="media">
<div class="media-left">
<img class="media-object" src="images/publicizer.png" alt="...">
</div>
<div class="media-body">
<h4 class="media-heading">Publicizer</h4>
Student-built phishing data mini-sites and search artifacts that demonstrate the educational value of cybersecurity datasets and modern data science tooling.
</div>
</div>
</div>
</div>
</div>
</section>
</div>
<!-- Features Section -->
<div>
<section id="features" class="features-section" style="margin-top:-1%; margin-bottom:5%">
<div class="container">
<div class="row">
<div class="col-lg-12">
<hr class="featurette-divider">
<h1>Student Visualization Teams</h1>
<hr class="featurette-divider">
</div>
<div class="col-sm-6 col-md-4">
<div class="thumbnail team-card">
<img src="teams/team_4/images/phish_prediction_calendar.JPG" alt="Team 4 phishing calendar view">
<div class="caption">
<h3>Team 4</h3>
<p>Team 4 investigated phishing attack behavior across time, geography, urgency, wording, and language style. Their work includes calendar frequency views, attacker-location maps, time-of-day urgency bars, phishing and reconnaissance word clouds, and a sunburst of misspellings and capitalization patterns.</p>
<p><a href="teams/team_4/team_4.html" class="btn btn-primary" role="button">View Team 4 Visualizations</a></p>
</div>
</div>
</div>
<div class="col-sm-6 col-md-4">
<div class="thumbnail team-card">
<img src="teams/team_8/d3/images/heatmap.png" alt="Team 8 email send-time heatmap">
<div class="caption">
<h3>Team 8 / Team Banana</h3>
<p>Team 8 enriched fraudulent email records with timestamps, sender context, social-engineering tags, attacker titles, and similarity scores. Their D3 views show sent-time signatures, common phishing terms, attacker title frequencies, unemployment context, and Tika-Similarity distributions.</p>
<p><a href="teams/team_8/team_8.html" class="btn btn-primary" role="button">View Team 8 Visualizations</a></p>
</div>
</div>
</div>
<div class="col-sm-12">
<p class="lead" style="margin-top:20px;"> <a href="html/d3-examples.html">Open the full team gallery.</a> </p>
</div>
</div>
</div>
</section>
</div>
<!-- Search Section (for sub-page navbar consistency and to highlight exploration tools) -->
<div>
<section id="search" class="search-section" style="margin-top:-1%; margin-bottom:5%">
<div class="container">
<div class="row">
<div class="col-lg-12">
<hr class="featurette-divider">
<h1>Search & Explore</h1>
<hr class="featurette-divider">
</div>
<div class="col-lg-12">
<p class="lead">The visualizations in this gallery come from the Spring 2021 DSCI 550 phishing web data visualization assignment. Student teams analyzed fraudulent email and phishing feature datasets, extracted social-engineering and sender features, and produced D3.js visualizations plus search and ImageSpace artifacts.</p>
<p><a class="btn btn-primary btn-lg" href="html/d3-examples.html">Browse the Student Visualizations</a></p>
<p><a class="btn btn-primary btn-lg" href="https://www.kaggle.com/datasets/rtatman/fraudulent-email-corpus" target="_blank">Open Fraudulent E-mail Corpus on Kaggle</a> <a class="btn btn-primary btn-lg" href="https://data.mendeley.com/datasets/h3cgnj8hft/1" target="_blank">Open Phishing Feature Dataset</a></p>
<p class="text-muted small">Originally parts of the submitted workflow used local preprocessing, Solr ingest, and ImageSpace/ImageCat artifacts. The D3 visualizations here are static browser assets that can be previewed with a local HTTP server.</p>
<p style="margin-top:10px; font-size: 0.95em;">
<strong>ImageCat</strong> (from the <a href="http://github.com/chrismattmann/imagecat" target="_blank">chrismattmann/imagecat</a> repo) is an OODT/RADIX app that extracts metadata and OCR text via Tika + Tesseract, then loads records into Solr for search.
<br>
<strong>ImageSpace</strong> (from the <a href="http://github.com/nasa-jpl-memex/image_space" target="_blank">nasa-jpl-memex/image_space</a> repo, part of the DARPA MEMEX program) builds on ImageCat to support visual browsing, search, and similarity exploration using metadata, OCR, and computer-vision plugins.
</p>
</div>
</div>
</div>
</section>
</div>
<!-- Learn More Section -->
<div>
<section id="learn-more" class="learn-more-section">
<div class="container">
<div class="col-lg-12" style="margin-top:8%">
<hr class="featurette-divider" style="margin-top:-1%">
<h1 align=center>USC Data Science Partner Sites</h1>
<hr class="featurette-divider">
</div>
<div class="row">
<div class="col-md-12 col-sm-4 col-xs-4" style="margin-top:3%">
<div class="panel panel-info">
<div class="panel-heading">
<h4><center>IRDS</h4>
</div>
<div class="panel-body">
<p style="font-size: 15pt;">
The Information Retrieval and Data Science Group’s (I.R.D.S.) mission is to research and develop new methodology and open source software to analyze, ingest, process, and manage Big Data and to turn it into
information.
</p>
<p style="font-size: 15pt;">
We have expertise in data collection and contribute to the world's largest and most often downloaded open-source projects, working with NASA, DARPA, DHS, NIH across a number of domains, Earth Science,Planetary Science, Astronomy, defense, and private industry.
</p>
</div>
<div class="panel-footer">
<center><a href="http://irds.usc.edu/" class="btn btn-info ">Visit IRDS</a>
</div>
</div>
</div>
</div>
<div class="col-lg-12" style="margin-top:5%;" >
<h3 align=center>Credits</h3>
<hr class="featurette-divider">
<div class="row">
<p>Dr. Chris Mattmann - <a href="http://mattmann.ai">Visit his website</a></p>
<p>DSCI 550 Spring 2021 Class - phishing web data visualization assignment</p>
</div>
</div>
</div>
</section>
</div>
<hr class="featurette-divider">
<div>
<div class="container">
<footer>
<p align=center>© USC Data Science Group. All Rights Reserved</p>
</footer>
</div>
</div>
<!-- jQuery -->
<script src="js/jquery.js"></script>
<!-- Bootstrap Core JavaScript -->
<script src="js/bootstrap.min.js"></script>
<!-- Scrolling Nav JavaScript -->
<script src="js/jquery.easing.min.js"></script>
<script src="js/scrolling-nav.js"></script>
<script src="js/cardpanel.js"></script>
</body>
</html>