-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
223 lines (215 loc) · 9.69 KB
/
index.html
File metadata and controls
223 lines (215 loc) · 9.69 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>CYBERSPAN Overview Visualization</title>
<link rel="icon" href="assets/Cyberspan_Shield.ico" type="image/x-icon" />
<link
href="https://fonts.googleapis.com/css2?family=Roboto+Mono&display=swap"
rel="stylesheet"
/>
<link rel="stylesheet" href="css/styles.css" />
</head>
<body>
<a href="https://cyberspan.us" target="_blank" class="circle-button">
<img src="./assets/Cyberspan_Shield.jpg" alt="CYBERSPAN Logo" />
</a>
<div class="container">
<div class="graphic">
<svg id="viz"></svg>
</div>
<div class="steps">
<div class="step" data-step="1">
Welcome to the interactive <b>CYBERSPAN</b> visualizer!
<b>CYBERSPAN</b> is a project developed by <b>IntelliGenesis</b> and
works to recognize anomolous traffic and provide you with relevant
actions to take to address the situation. As you scroll through this
page, you will get a high level overview of <b>CYBERSPAN</b>. If you
would like to learn more, click the <b>CYBERSPAN</b> shield button or
the buttons at the end of the webpage. Note that this visualization
was originally created for desktop browsers beyond 1200px wide but was
adapted for smaller screens as well. Switching between under 1200px
and over 1200px during scrolling (by resizing your window) might cause
unintended behavior.
<br />
<br />
On the screen is an example network. If you are on a computer with a
large enough browser screen you can drag around the nodes if you would
like.
<br />
<br />
<br />
<br />
<div class="scroll-hint">
<p>Scroll to get started!</p>
<div class="down-arrow">↓</div>
</div>
</div>
<div class="step" data-step="2">
<p>This example network includes:</p>
<ul>
<li>
<span class="highlight-node" data-node="Modem">a modem</span>
</li>
<li>
<span class="highlight-node" data-node="Router/Firewall"
>a router/firewall</span
>
</li>
<li>
<span class="highlight-node" data-node="Switch">switches</span>
</li>
<li>
<span class="highlight-node" data-node="Workstation"
>a workstation</span
>
</li>
<li><span class="highlight-node" data-node="Wifi">wifi</span></li>
<li>
<span class="highlight-node" data-node="Laptop">a laptop</span>
</li>
<li>
<span class="highlight-node" data-node="iPhone">an iPhone</span>
</li>
<li>
<span class="highlight-node" data-node="Server">a server</span>
</li>
<li>
<span class="highlight-node" data-node="Desktop PC"
>desktops</span
>
</li>
</ul>
</div>
<div class="step" data-step="3">
The network is connected to the Internet through a modem which
translates the analog signals it receives from the Internet service
provider (ISP) into a digital format that can be understood by the
rest of the network.
<br />
<br />
Then a router/firewall is used to block some malicious incoming
traffic with a rules-based approach and then send it to the correct
device the traffic is meant for.
<br />
<br />
A core switch then connects this chain to the other parts of the
network.
</div>
<div class="step" data-step="4">
In normal operation, the network data goes to the modem to transform
the signals and then the router to direct traffic and the firewall to
block some traffic before going through the core switch and to the
correct device.
<br />
<br />
This visualization only shows incoming traffic, but a real network
will have information (in the form of packets) leaving the network and
going to the Internet as well. The amount of information being
processed in a network is also drastically simplified for this
visualization. Instead of one connection every 1.5 seconds (as the
visualization shows), a real network will process many more packets
(thousands to millions depending on the size of the network) per
second.
</div>
<div class="step" data-step="5">
But how do you know if that traffic is
<span style="color: #011640">good</span> or
<span style="color: #f8333c">bad</span>?
<br />
<br />
Firewalls can block some known malicious activity through rules-based
blocking (e.g. blocking a specific ip address, port, protocol, or
url), but in the evolving cybersecurity landscape, it is not
sufficient for full protection. Firewalls require that threats be
known ahead of time to be mitigated, but this is just not possible for
all malicous actors and traffic. Therefore, to protect the network we
need a way to dynamically identify anomolous or malicious traffic as
it enters our network and provide recommendations on mitigation
options.
</div>
<div class="step" data-step="6">
Insert <b>CYBERSPAN</b> into the network!
<br />
<br />
<b>CYBERSPAN</b> connects to the Switched Port Analyzer (SPAN) port on
the core network switch which quietly mirrors all of the traffic that
passes through it. <b>CYBERSPAN</b> collects the network traffic with
Zeek and then applies AI models and analytics to determine anomolous
traffic.
<br />
<br />
Through this data gathering process, <b>CYBERSPAN</b> is able to
analyze over a dozen network services and protocols from Zeek's
analytic-ready logs such as HTTP, FTP, DNS, NTP, DHCP, and more. The
process also does not decrypt any content (such as data transmitted
over HTTPS) meaning secure communication will still be secure, even
from <b>CYBERSPAN</b>.
<br />
<br />
<b>CYBERSPAN</b> first requires some time to do clustering to get a
baseline of the network traffic of the system. Different networks with
different uses will have differences in what looks anomolous to them.
This initial learning time acclimatizes <b>CYBERSPAN</b> to a given
network so that it will be able to recognize anomolous activity for a
specific network.
</div>
<div class="step" data-step="7">
<b>CYBERSPAN</b> uses AI models and analytics on the gathered network
traffic to determine anomolous traffic. However, anomolous traffic is
plentiful for any network, so a key feature of <b>CYBERSPAN</b> is
that it gathers anomolous traffic in the form of <em>evidence</em> and
displays it to the user in aggregated <em>events</em> when large
enough anomalies occur.
<br />
<br />
<b>CYBERSPAN</b> allows for advanced traffic queries to quickly search
network traffic, a user-friendly dashboard that can be used to view
anomolous <em>events</em>, and anomaly heatmap and network graph
visualizations.
<br />
<br />
In addition to identifying anomolous traffic, <b>CYBERSPAN</b> also
provides users with actions they can take to remedy the situation.
When an <em>event</em> is created by <b>CYBERSPAN</b>, <b>CYBERSPAN</b> provides it's
supporting <em>evidence</em>; recommended mitigations; and a mapping
to MITRE ATT&CK tactics, techniques, and procedures (TTPs).
</div>
<div class="step" data-step="8">
<b>CYBERSPAN</b> integration and deployment is easy and we will help
you get up and running! We provide on-premesis, virtual, or
cloud-hosted options to fit your business needs.
<br />
<br />
<b>CYBERSPAN</b> is non-agentic, meaning that it is simply our server
connected to your network and not a software deployed on many machines
which reduces complexity and increases security.
<br />
<br />
<b>CYBERSPAN's</b> on-premesis processing is also another security
feature. Because it sits behind your existing firewall, requires no
open inbound ports, and does not use agents, the attack surface of
<b>CYBERSPAN</b> is very small.
<br />
<br />
<b>CYBERSPAN</b> also includes an API (which is used to build the
dashboard) which allows for further integration or extension.
</div>
<div class="step" data-step="9">
Learn more about <b>CYBERSPAN</b> or about <b>IntelliGenesis</b> using
the buttons!
<br />
<br />
To restart the visualization scroll to the top of the page and reload.
</div>
</div>
</div>
<!-- Load Libraries -->
<script src="https://d3js.org/d3.v7.min.js"></script>
<script src="https://unpkg.com/scrollama"></script>
<!-- Load Custom Scripts -->
<script src="js/viz.js"></script>
<script src="js/main.js"></script>
</body>
</html>