-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
483 lines (386 loc) · 23.2 KB
/
index.html
File metadata and controls
483 lines (386 loc) · 23.2 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
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
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
<!DOCTYPE html>
<html lang="en-us">
<head>
<!-- App Title -->
<title>IMPAKT</title>
<!-- App Description -->
<meta name="description" content="...."/>
<meta charset="utf-8">
<meta name="author" content="DrQ">
<meta http-equiv="X-UA-Compatible" content="IE=Edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0" />
<link rel="stylesheet" type="text/css" href="css/bootstrap.css"/>
<link rel="stylesheet" type="text/css" href="css/owl.transitions.css"/>
<link rel="stylesheet" type="text/css" href="css/owl.carousel.css"/>
<link rel="stylesheet" type="text/css" href="css/animate.css"/>
<link rel="stylesheet" type="text/css" href="css/main.css"/>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/ajaxchimp.js"></script>
<script type="text/javascript" src="js/scrollTo.js"></script>
<script type="text/javascript" src="js/owl.carousel.min.js"></script>
<script type="text/javascript" src="js/wow.js"></script>
<script type="text/javascript" src="js/parallax.js"></script>
<script type="text/javascript" src="js/nicescroll.js"></script>
<script type="text/javascript" src="js/main.js"></script>
</head>
<body>
<!-- Header Section -->
<header>
<div class="container">
<nav class="pull-right">
<ul class="list-unstyled">
<li class="animated wow fadeInRight" data-wow-delay=".1s"><a href="#app_features">FUNCTIONALITY</a></li>
<li class="animated wow fadeInRight" data-wow-delay=".2s"><a href="#team">TEAM</a></li>
<li class="animated wow fadeInRight" data-wow-delay=".2s"><a href="#contact">CONTACT</a></li>
</ul>
</nav>
<!--
<div class="social pull-right">
<ul class="list-unstyled">
<li class="animated wow fadeInRight" data-wow-delay=".2s"><a href="#"><img src="img/facebook.png" alt="" title=""></a></li>
<li class="animated wow fadeInRight" data-wow-delay=".1s"><a href="#"><img src="img/twitter.png" alt="" title=""></a></li>
<li class="animated wow fadeInRight" data-wow-delay="0s"><a href="#"><img src="img/google.png" alt="" title=""></a></li>
</ul>
</div>
-->
<span class="burger_icon">menu</span>
</div>
</header>
<!-- End Header Section -->
<!-- Hero Section -->
<section class="hero" id="about">
<div class="container">
<div class="caption">
<h1 class="text-uppercase animated wow fadeInRight">Unlock the energy of your community with Impakt, the all-in-one app framework for grassroots causes.</h1>
<p animated wow fadeInRight">Our platform helps supporters connect, organize, persuade friends to join the cause, and stay safe from potential threats. Our team comprises of top makers and thinkers from both the hacker and progressive political worlds to deliver the best solution for your community. Join Impakt now and take the first step towards empowering your grassroots movement.</p>
</div>
</div>
</section>
<!-- End Hero Section -->
<!-- Featured On Section -->
<section class="featured_on">
<div class="container">
<div class="row text-center">
<div class="col-sm-4 col-md-4 details animated wow fadeInDown" data-wow-delay=".0s">
<a href="#activists" class="app_store_btn text-uppercase animated wow fadeInLeft"><span><img src="img/hands-helping.png"></br>FOR ACTIVISTS</span></a>
</div>
<div class="col-sm-4 col-md-4 details animated wow fadeInDown" data-wow-delay="0s">
<a href="#organisers" class="app_store_btn text-uppercase animated wow fadeInLeft"><span><img src="img/slideshare.png"></br>FOR ORGANISERS</span></a>
</div>
<div class="col-sm-4 col-md-4 details animated wow fadeInDown" data-wow-delay="0s">
<a href="#security" class="app_store_btn text-uppercase animated wow fadeInLeft"><span><img src="img/lock.png"></br>SECURITY</span></a>
</div>
</div>
</div>
</section>
<!-- End Featured On Section -->
<section class="app_features">
<div class="container">
<div class="col-sm-12 text-left" id="activists">
<div class="col-sm-12 text-left">
<h2 class="text-uppercase animated wow fadeInLeft">Community Advantage</h2></br>
<div class="col-md-3">
<!-- character --><figure class="portrait"><div class="image-cropper"><img src="img/tracy2.png" class="rounded"/></div></figure>
</div>
<div class="col-md-9">
<!-- story --><figure class="story">
<p align="justify">Tracy is a small town teacher. She is planning on joining an upcoming nationwide teachers' strike but she fears that her community would not support her. She wishes she had better resources to defend her decision in her community and convince others to support the strike.</p>
<h1>NO ONE CAN TALK TO YOUR FRIENDS BETTER THAN YOU.</br> WE HELP YOU MAKE THE BEST ARGUMENT TO CONVINCE</br> THEM, WITHOUT GATHERING ANY DATA.</h1>
</figure>
</div>
</div>
<div class="col-sm-12 animated wow fadeInLeft">
<div class="col-md-9 text-right">
<!--IMPAKT exp --><figure class="experience"><p align="justify">Using Impakt, Tracy had the news and press releases from her union, and reached out to many of her friends. She had relevant information for parents of school-age kids, other public-sector workers and so on. The sharing process was easy and personalised. And best of all - Impakt did not collect any data! Tracy had complete control over the whole process.</p>
</figure>
</div>
<div class="col-md-3">
<!--App screenshot--><figure class="screenshot"><img src="img/community.PNG" width="70%" alt=""></figure>
</div>
</div>
<h2 class="text-uppercase animated wow fadeInLeft">Anyone can have an IMPAKT</h2></br>
<div class="col-md-3">
<!-- character --><figure class="portrait"><div class="image-cropper"><img src="img/jenny2.png" class="rounded"/></div></figure>
</div>
<div class="col-md-9">
<!-- story --><figure class="story">
<p align="justify">Jenny is a young progressive in a small town. She's shy and fears going to a meeting in a nearby city with politically motivated strangers. But she would like to find a way to help a political cause.</p>
<h1> FOR MOST WOULD-BE ACTIVISTS, THE FIRST STEP </br>
IS THE HARDEST. IMPAKT MAKES IT EASY.</h1>
</figure>
</div>
</div>
<div class="col-sm-12 animated wow fadeInLeft">
<div class="col-md-9 text-right">
<!--IMPAKT exp --><figure class="experience"><p align="justify">When Jenny downloaded her favorite cause's Impakt, she met others like her thanks to the <b>local chat</b>, including several people in her home town. They got together and started brainstorming about what they could do locally. Jenny also used the <b>contact nearest coordinator</b> button to get in touch with organizers and got some logistics help from Matt, the regional coordinator for her area.</p>
</figure>
</div>
<div class="col-md-3">
<!--App screenshot--><figure class="screenshot"><img src="img/agency.PNG" width="70%" alt=""></figure>
</div>
</div>
<div class="col-sm-12 text-left" id="organisers">
<h2 class="text-uppercase animated wow fadeInLeft">ORGANISE GIG ECONOMY AND REMOTE WORKERS</h2><br>
<div class="col-md-3">
<!-- character --><figure class="portrait"><div class="image-cropper"><img src="img/greg2.png" class="rounded"/></div></figure>
</div>
<div class="col-md-9">
<!-- story --><figure class="story"><p align="justify">Greg works on a construction site. He knows that there are many intermediaries between the laborers and the site owner and each of them get a large cut of the money. He thinks the workers could get a fair shake by forming a co-op to be employed directly. But the frequent rotation of workers from site to site makes it difficult to gather numbers.</p>
<h1>IMPAKT MAKES IT POSSIBLE FOR TEMPORARY <br>WORKERS AND GIG ECONOMY WORKERS TO ORGANISE.<br></h1>
</figure>
</div>
</div>
<div class="col-sm-12 animated wow fadeInLeft">
<div class="col-md-9 text-right">
<!--IMPAKT exp --><figure class="experience"><p align="justify"><p align="justify">Greg decided to set up an instance of Impakt, so that construction workers in the entire country could self-organise regardless of what site they currently work at. They could coordinate events, vote and raise money. As an admin, Greg can also send alerts to anyone in an area for spontaneous gatherings.</p>
</figure>
</div>
<div class="col-md-3">
<!--App screenshot--><figure class="screenshot"><img src="img/convenience.PNG" width="70%" alt=""></figure>
</div>
</div>
<div class="col-sm-12 text-left">
<h2 class="text-uppercase animated wow fadeInLeft">ENGAGE WITH YOUR MEMBERS</h2></br>
<div class="col-md-3">
<!-- character --><figure class="portrait"><div class="image-cropper"><img src="img/anna2.png" class="rounded"/></div></figure>
</div>
<div class="col-md-9">
<!-- story --><figure class="story">
<p align="justify">Maryam is an organiser in an embattled trade union, engaged in heated negotiations. She often needs to make decisions in a matter of hours, but quite often she would like to be able to get input from the union members.</p>
</figure>
</div>
</div>
<div class="col-sm-12 animated wow fadeInLeft">
<div class="col-md-9 text-left">
<!--IMPAKT exp --><figure class="experience"><h1 class="text-uppercase">With Impakt, Maryam can create polls for union members,</br>and notify those eligible to vote with a push alert.</h1>
</figure>
</div>
<div class="col-md-3">
<!--App screenshot--><figure class="screenshot"><img src="img/participation2.PNG" width="70%" alt=""></figure>
</div>
</div>
<div class="col-sm-12 text-left" id="security">
<h2 class="text-uppercase animated wow fadeInLeft">EVADE WORKPLACE SURVEILLANCE</h2></br>
<div class="col-md-3">
<!-- character --><figure class="portrait"><div class="image-cropper"><img src="img/pete2.png" class="rounded"/></div></figure>
</div>
<div class="col-md-9">
<!-- story --><figure class="story">
<p align="justify">Pete works with Greg at the construction site, and he thinks Greg has a lot of great ideas. But he has a family to feed and doesn't want to make waves with the bosses. He's afraid to openly support a union.
He was relieved when Greg explained to him that Impakt has <b>domain fronting</b> - that is, the network operator can't see that you're connecting to it.</p>
</figure>
</div>
</div>
<div class="col-sm-12 animated wow fadeInLeft">
<div class="col-md-9 text-left">
<!--IMPAKT exp --><figure class="experience"><h1 class="text-uppercase">Even if Pete uses the work wifi, the bosses won't know that he's supporting the movement. Plus the Impakt server doesn't store any</br>identifying information, and Pete never had to so much as give his real name.
</h1>
</figure>
</div>
<div class="col-md-3">
<!--App screenshot--><figure class="screenshot"><img src="img/anonymity.PNG" width="70%" alt=""></figure>
</div>
</div>
<div class="col-sm-12 text-left">
<h2 class="text-uppercase animated wow fadeInLeft">THE CONTENT OF YOUR PHONE WON'T BETRAY YOU</h2></br>
<div class="col-md-3">
<!-- character --><figure class="portrait"><div class="image-cropper"><img src="img/maryam.png" class="rounded"/></div></figure>
</div>
<div class="col-md-9">
<!-- story --><figure class="story">
<p align="justify">Barbara lives in a country with mid-level surveillance capabilities and has concerns about rapidly diminishing civil liberties. She would like to get people involved in direct action, but has concerns about repercussions.</p>
</figure>
</div>
</div>
<div class="col-sm-12 animated wow fadeInLeft">
<div class="col-md-9 text-right">
<!--IMPAKT exp --><figure class="experience"><p align="justify"><p align="justify">She decided to use <i>Impakt</i> to coordinate, because the app is <i>stateless</i> - if anyone's phone gets seized the app will not show what they have been doing in it. She also likes the fact that all chats are <i>ephemeral</i> - the contents dissapear after a short time. No personal data is being collected by the <i>Impakt</i> server. On any Impakt screen, one can trace two circles to activate a <i>panic alert</i> and notify other members of the movement that they need help. This is the only time that the Impakt app uses a device's location.</p>
</figure>
</div>
<div class="col-md-3">
<!--App screenshot--><figure class="screenshot"><img src="img/ephemerality.PNG" width="70%" alt=""></figure>
</div>
</div></div></section>
<section class="transition1">
<div class="container"></div></section>
<!-- Testimonials Section -->
<section class="testimonials animated wow fadeIn" id="team">
<div class="container">
<img src="img/solidarity.png" class="animated wow fadeInLeft" data-wow-delay=".4s">
<div class="testimonials_list">
<ul class="list-unstyled text-center slides clearfix" id="tslider">
<li>
<blockquote>
<!-- left slider <div class="col-md-1 text-center">
<div class="#tslider"><div class="owl-controls clickable"><div class="owl-prev" style="margin-top: 150px"></div></div></div>
</div> -->
<!--photo--><div class="col-md-4 text-center"></br><div class="image-cropper">
<img src="img/ceo.png" class="rounded" align="middle"/></div></div>
<div class="col-md-8 text-left animated wow fadeInRight" data-wow-delay=".6s">
<span class="name text-uppercase">Dr Eva Infeld</span>
<span class="job">Architect</br></br></span>
<p align="justify"> </br>Mathematician, university lecturer, brainstormer, and computer security consultant. She taught at some of the world's best universities and is a designer of network infrastructure, cryptocurrency protocols and educational games. </br></br> Eva received her PhD from Dartmouth in Probabilistic Combinatorics and is a graduate of University of Cambridge and London School of Economics.</p>
</div>
<!-- right slider <div class="col-md-1 text-center">
<div class="#tslider"><div class="owl-controls"><div class="owl-next" style="margin-top: 150px"></div></div></div>
</div> -->
</blockquote>
</li>
<li>
<blockquote>
<!-- left slider <div class="col-md-1 text-center">
<div class="#tslider"><div class="owl-controls clickable"><div class="owl-prev" style="margin-top: 150px"></div></div></div>
</div> -->
<!--photo--><div class="col-md-4 text-center"></br><div class="image-cropper">
<img src="img/cto.png" class="rounded" align="middle"/></div></div>
<div class="col-md-8 text-left animated wow fadeInRight" data-wow-delay=".6s">
<span class="name text-uppercase">Bartosz Owczarek</span>
<span class="job">CTO and Backend Dev</br></br></span>
<p align="justify"> </br>After a decade of delivering backend and middleware solutions at major technology corporations, Bartosz has decided to combine his work experience with his passion for grassroots organising.</br></br>In addition to being a telecommunications specialist, he is a gifted coordinator who has led both large corporate projects and the logistics of social movements. Impakt couldn't hope for a better technical lead to ensure smooth development.</p></div>
<!-- right slider <div class="col-md-1 text-center">
<div class="#tslider"><div class="owl-controls"><div class="owl-next" style="margin-top: 150px"></div></div></div>
</div> -->
</blockquote>
</li>
<li>
<blockquote>
<!-- left slider <div class="col-md-1 text-center">
<div class="#tslider"><div class="owl-controls clickable"><div class="owl-prev" style="margin-top: 150px"></div></div></div>
</div> -->
<!--photo--><div class="col-md-4 text-center"></br><div class="image-cropper">
<img src="img/basia.png" class="rounded" align="middle"/></div></div>
<div class="col-md-8 text-left animated wow fadeInRight" data-wow-delay=".6s">
<span class="name text-uppercase">barbara Kłosowska</span>
<span class="job">Front End Dev</br></br></span>
<p align="justify"> </br>Barbara is a React Native sorceress who is usually brought on by big-budget projects to save the development that's falling behind.</br>
</br>She laid the foundation for what you can see and play with in the Impakt framework.</p>
</div>
</blockquote>
</li>
<li>
<blockquote>
<!-- left slider <div class="col-md-1 text-center">
<div class="#tslider"><div class="owl-controls clickable"><div class="owl-prev" style="margin-top: 150px"></div></div></div>
</div> -->
<!--photo--><div class="col-md-4 text-center"></br><div class="image-cropper">
<img src="img/cfo.png" class="rounded" align="middle"/></div></div>
<div class="col-md-8 text-left animated wow fadeInRight" data-wow-delay=".6s">
<span class="name text-uppercase">jan j. Zygmuntowski</span>
<span class="job">Business Lead</br></br></span>
<p align="justify"> </br>Jan is a progressive enterpreneur and economist specializing in digital economy and sustainability. He is the chairman of the board of the Instrat Foundation, and a formerly analyst at the Polish Development Fund.</br></br>He's written on social and economic issues for leading Polish opinion and business media. He advises and supports a number of tech projects with positive social impact. He's a graduate of the Warsaw School of Economics (SGH) and a G20 Global Solutions fellow.</p>
</div>
</blockquote>
</li>
<li>
<blockquote>
<!-- left slider <div class="col-md-1 text-center">
<div class="#tslider"><div class="owl-controls clickable"><div class="owl-prev" style="margin-top: 150px"></div></div></div>
</div> -->
<!--photo--><div class="col-md-4 text-center"></br><div class="image-cropper">
<img src="img/ania.png" class="rounded" align="middle"/></div></div>
<div class="col-md-8 text-left animated wow fadeInRight" data-wow-delay=".6s">
<span class="name text-uppercase">Anna O</span>
<span class="job">Full Stack Dev</br></br></span>
<p align="justify"> </br>Anna is a software developer with diverse experience, which includes a medical AI startup, 5 years of experience in game development and several years as a bioinformatics research fellow at International Institute of Molecular and Cell Biology (IIMCB) in Warsaw. </br></br>
She is also a former lecturer at Poland’s first programming bootcamp, as well as a university-level educator. She graduated from the University of Edinburgh.</p>
</div>
</blockquote>
</li>
<!--
<li>
<blockquote>
<span class="author text-uppercase">our team</br></br><img src="img/wojtek.png" width="20%" align="center" > </br> </br>wojciech kuśmierek</span>
<span class="job">UX designer</span>
<p> </br>....</p>
</blockquote>
</li> -->
</ul>
<div id="slider_nav">
<div id="prev_arrow"></div>
<div id="next_arrow"></div>
</div>
</div>
</div>
</section>
<!-- End Testimonials Section -->
<section class="featured_on" id="contact">
<div class="row text-center">
<div class="col-sm-4 col-md-4 details animated wow fadeInDown" data-wow-delay=".0s">Tech Contact:
</br> <a href="mailto: evainfeld@riseup.net" class="text-uppercase animated wow fadeInLeft">Dr Eva Infeld</a>
</br> <a href="mailto: bjowczarek@riseup.net" class="text-uppercase animated wow fadeInLeft"><span>Bartosz Owczarek</span></a>
</div>
<div class="col-sm-4 col-md-4 details animated wow fadeInDown" data-wow-delay="0s">Business Contact:</br>
<a href="mailto: jan.zygmuntowski@instrat.pl" class="text-uppercase animated wow fadeInLeft"> Jan Z. Zygmuntowski</a>
</div>
<div class="col-sm-4 col-md-4 details animated wow fadeInDown" data-wow-delay="0s">
The Impakt core team is based in Warsaw, Poland.
</div>
</div>
</section>
<!-- About Section
<section class="about" id="about">
</div>
</div>
<div class="container">
<div class="row">
<div class="col-sm-12 text-center animated wow fadeInRight">
</br></br>
<div class="col-md-2 text-center">
<img src="img/anna.PNG" width="100%" alt="" titl="">
</div>
<div class="col-md-8 text-center">
<p align="justify">Anna is an organiser in an embattled trade union, engaged in heated negotiations. She often needs to make decisions in a matter of hours, but quite often she would like to be able to get input from the union members.</p>
<h1 class="text-uppercase">With Impakt, Anna easily create polls for union members, and notify those eligible to vote with a push alert.</h1>
</div>
<div class="col-md-2 text-center">
<img src="img/participation2.PNG" width="70%" alt="">
</div>
</div>
<div class="col-sm-12 text-center animated wow fadeInLeft">
</br></br>
<div class="col-md-2 text-center">
<img src="img/pete.png" width="100%" alt="" titl="">
</div>
<div class="col-md-8 text-center">
<p align="justify">Pete works with Greg at the construction site, and he thinks Greg has a lot of great ideas. But he has a family to feed and doesn't want to make waves with the bosses. He's afraid to openly support a union.
He was relieved when Greg explained to him that <i>Impakt</i> has <i>domain fronting</i> - that is, the network operator can't see that you're connecting to it.</p>
<h1 class="text-uppercase">So even if Pete uses the work wifi, the bosses won't know that he's supporting the movement.
</h1><p>Also, the server doesn't store identifying information, and Pete never had to so much as give his real name.
</p>
</div>
<div class="col-md-2 text-center">
<img src="img/anonymity.PNG" width="100%" alt="">
</div>
</div>
<div class="col-sm-12 text-center animated wow fadeInRight">
</br></br>
<div class="col-md-2 text-center">
<img src="img/agnieszka.png" width="100%" alt="" titl="">
</div>
<div class="col-md-8 text-center">
<p align="justify">Agnieszka lives in a country with mid-level surveillance capabilities and has concerns about rapidly diminishing civil liberties. She would like to get people involved in direct action, but has concerns about repercussions.
</br></br>She decided to use <i>Impakt</i> to coordinate, because the app is <i>stateless</i> - if anyone's phone gets seized the app will not show what they have been doing in it. She also likes the fact that all chats are <i>ephemeral</i> - the contents dissapear after a short time. No personal data is being collected by the <i>Impakt</i> server. On any Impakt screen, one can trace two circles to activate a <i>panic alert</i> and notify other members of the movement that they need help. This is the only time that the Impakt app uses a device's location.</p>
</div>
<div class="col-md-2 text-center">
<img src="img/ephemerality.PNG" width="70%" alt="">
</div>
</div>
</div>
</section>
End Footer Section
<footer>
<ul class="list-unstyled list-inline app_platform">
<li class="animated wow fadeInDown" data-wow-delay="0s">
<a href=""><img src="img/android_icon.png" alt="" title=""></a>
</li>
<li class="animated wow fadeInDown" data-wow-delay=".1s">
<a href=""><img src="img/ios_icon.png" alt="" title=""></a>
</li>
<li class="animated wow fadeInDown" data-wow-delay=".2s">
<a href=""><img src="img/windows_icon.png" alt="" title=""></a>
</li>
</ul>
</footer>
-->
</body>
</html>