index.html 34 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1">
  6. <meta name="description" content="Brainstorm about the ethical implications of your project and represent them in a canvas.">
  7. <meta name="keywords" content="ethics canvas, ethics, social entrepreneurship, research, innovation, privacy, business development, business model canvas, open source tools">
  8. <!-- favicon -->
  9. <link rel="icon" href="icon/favicon.ico"/>
  10. <title>The Ethics Canvas</title>
  11. <!-- Mailchimp -->
  12. <link href="//cdn-images.mailchimp.com/embedcode/classic-10_7.css" rel="stylesheet" type="text/css">
  13. <!-- Bootstrap -->
  14. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
  15. <!-- Google font -->
  16. <link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet" type="text/css">
  17. <!-- Mailchimp style -->
  18. <link rel="stylesheet" type="text/css" href="css/mailchimp.css">
  19. <!-- Slick Carousel jQuery plugin style -->
  20. <link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/jquery.slick/1.6.0/slick.css"/>
  21. <!-- Slick Carousel Theme style (Creates a basic layout)-->
  22. <link rel="stylesheet" type="text/css" href="css/slick-theme.css">
  23. <!-- Main Style -->
  24. <link rel="stylesheet" type="text/css" href="css/landing.css">
  25. </head>
  26. <body>
  27. <div class="container-fluid">
  28. <div class="row header">
  29. <header class=" col-md-4 col-md-offset-4 text-center">
  30. <!--logo -->
  31. <h1 class="page_title text-center">
  32. <a class="logo " href="index.html">
  33. <img src="icon/logo.svg" alt="Online Ethics Canvas"/>
  34. </a>
  35. </h1>
  36. </header>
  37. </div>
  38. <!-- ===================================
  39. Slick Carousel slider area
  40. =================================== -->
  41. <div class="container-fluid">
  42. <div class="slider-area col-md-12 text-center">
  43. <!-- ======= The markup for the Slick Carousel ======== -->
  44. <div class="slickCarousel">
  45. <div class="carousel-content">
  46. <div class="row">
  47. <div class="carousel-content-elements col-md-4 col-md-offset-4 ">
  48. <!-- <h2>Content 1</h2> -->
  49. <p>
  50. Brainstorm in a group about the ethical implications of your project and represent them in a canvas.
  51. </p>
  52. </div>
  53. <!-- end of .col-md-3 -->
  54. </div>
  55. <!-- end of inner content#1 .row -->
  56. </div>
  57. <!-- end of .carousel-content #1-->
  58. <div class="carousel-content">
  59. <div class="row">
  60. <div class="carousel-content-elements col-md-4 col-md-offset-4 ">
  61. <!-- <h2>Content 2 </h2> -->
  62. <p>
  63. Analyse the ethical concerns of your project and find suitable solutions.
  64. </p>
  65. </div>
  66. <!-- end of .col-md-3 -->
  67. </div>
  68. <!-- end of inner content#2 .row -->
  69. </div>
  70. <!-- end of .carousel-content #2-->
  71. <div class="carousel-content">
  72. <div class="row">
  73. <div class="carousel-content-elements col-md-4 col-md-offset-4 ">
  74. <!-- <h2>Content 3</h2> -->
  75. <p>
  76. Join the community, learn from similar use cases and share your experiences.
  77. </p>
  78. </div>
  79. <!-- end of .col-md-3 -->
  80. </div>
  81. <!-- end of inner content#3 .row -->
  82. </div>
  83. <!-- end of .carousel-content #3-->
  84. </div>
  85. <!-- end of Slick Carousel markup-->
  86. </div>
  87. <!-- end of .slider-area -->
  88. </div>
  89. <!-- end of .container-fluid 0f the slider area -->
  90. <!-- ========================================
  91. 3 Link Areas (Online, sign up, download)
  92. ========================================= -->
  93. <div class="row user-area">
  94. <!-- try it online -->
  95. <div class=" try-online col-md-4 ">
  96. <h2>Try the Canvas Online</h2>
  97. <p>Start using the online Ethics Canvas without registration, and export your work in PDF or JSON format.</p>
  98. <!-- link to the online canvas -->
  99. <a class="btn try-canvas" href="canvas/index.php">
  100. <span>Try It Online</span>
  101. </a>
  102. </div>
  103. <!-- sign up/sign in -->
  104. <div class=" sign-up-in col-md-4 " id="login-area">
  105. <h2>Sign Up to Save Your Canvas</h2>
  106. <p>Create an account so you can save your work in your dashboard.</p>
  107. <!-- ======================================= -->
  108. <div>
  109. <ul class="nav nav-tabs">
  110. <li class=" active" id="sign-up-pill">
  111. <a data-toggle="pill" href="#signup-tab">Sign Up</a>
  112. </li>
  113. <li id="log-in-pill">
  114. <a data-toggle="pill" href="#login-tab">
  115. Log In</a>
  116. </li>
  117. <li id="forgot-password-pill">
  118. <a data-toggle="pill" href="#reset-password-tab">
  119. New Password</a>
  120. </li>
  121. </ul>
  122. <div class="tab-content">
  123. <div id="signup-tab" class="tab-pane fade in active">
  124. <!-- ===================
  125. Sign up form area
  126. ====================== -->
  127. <div class="form-signup-feedback "></div>
  128. <form class="sign-up-form" action="sign-up.php" method="post" has-feedback>
  129. <!-- first name -->
  130. <div class="input-area">
  131. <label for="firstname-signup">
  132. Name</label>
  133. <p>
  134. <input id="firstname-signup" name="firstname-signup" type="text" required/>
  135. </p>
  136. <div class="form-message " id="name-register-message"></div>
  137. </div>
  138. <!-- email -->
  139. <div class="input-area">
  140. <label for="email-signup">
  141. Email</label>
  142. <p>
  143. <input id="email-signup" name="email-signup" type="email" required/>
  144. </p>
  145. <div class="form-message " id="email-register-message"></div>
  146. </div>
  147. <!-- password -->
  148. <div class="input-area">
  149. <label for="password-signup">Password</label>
  150. <p>
  151. <input id="password-signup" name="password-signup" type="password" required/>
  152. </p>
  153. <div class="form-message " id="pass-register-message"></div>
  154. </div>
  155. <!-- passworf confirmation -->
  156. <div class="input-area">
  157. <label for="password-signup-conf">Repeat Password</label>
  158. <p>
  159. <input id="password-signup-conf" name="password-signup-conf" type="password" required/>
  160. </p>
  161. <div class="form-message " id="pass-conf-register-message"></div>
  162. </div>
  163. <!-- sign up button -->
  164. <button class="btn sign-up" type="submit" id="sign-up-btn" name="sign-up">
  165. <span>Sign Up</span>
  166. </button>
  167. </form>
  168. </div>
  169. <!-- second pill content -->
  170. <div id="login-tab" class="tab-pane fade">
  171. <!-- ===================
  172. log in form area
  173. ====================== -->
  174. <div class="form-login-feedback "></div>
  175. <form class="log-in-form" action="log-in.php" method="post">
  176. <!-- email -->
  177. <div class="input-area">
  178. <label for="email-login">Email</label>
  179. <p>
  180. <input id="email-login" name="email-login" type="email" required/>
  181. </p>
  182. <div class="form-message" id="email-login-message"></div>
  183. </div>
  184. <!-- password -->
  185. <div class="input-area">
  186. <label for="password-login">Password</label>
  187. <p>
  188. <input id="password-login" name="password-login" type="password" required/>
  189. </p>
  190. <div class="form-message" id="pass-login-message"></div>
  191. </div>
  192. <div class="forgot-password">
  193. <a href="#">Forgot your password?</a>
  194. </div>
  195. <!-- log in button -->
  196. <button class="btn log-in" type="submit" id="log-in-btn" name="sign-up">
  197. <span>Log In</span>
  198. </button>
  199. </form>
  200. </div>
  201. <!-- end of second pill content -->
  202. <!-- third pill content -->
  203. <div id="reset-password-tab" class="tab-pane fade">
  204. <!-- ========================
  205. reset password form area
  206. =========================== -->
  207. <div class="form-reset-password-feedback "></div>
  208. <form class="reset-password-form" action="reset-password.php" method="post">
  209. <!-- email -->
  210. <div class="input-area">
  211. <label for="email-reset-password">Your Email</label>
  212. <p>
  213. <input id="email-reset-password" name="email-reset-password" type="email" required/>
  214. </p>
  215. <div class="form-message " id="reset-password-message"></div>
  216. </div>
  217. <!-- reset password button -->
  218. <button class="btn reset-password" type="submit" id="reset-password-btn" name="reset-password">
  219. <span>Reset My Password</span>
  220. </button>
  221. </form>
  222. </div>
  223. <!-- end of third pill content -->
  224. </div>
  225. </div>
  226. </div>
  227. <!-- download as pdf -->
  228. <div class="download-pdf col-md-4 ">
  229. <h2>Download a PDF Version</h2>
  230. <p>Work offline. Download a printable version of the Ethics Canvas to use it in workshops. <b>Need help?</b> <a href="download/handbook.pdf" target="_blank" download>Download the handbook</a> for further details and examples.</p>
  231. <!-- The attribute is not supported in Safari-->
  232. <a class="btn download-canvas" href="download/online-ethics-canvas.pdf" target="_blank" download>
  233. <span>Download as PDF</span>
  234. </a>
  235. </div>
  236. </div>
  237. <!-- end of .row .user-area -->
  238. <!-- ===================
  239. HOW IT WORKS
  240. ===================-->
  241. <div class="row">
  242. <div class="how-it-works col-md-8 col-md-offset-2">
  243. <h2>HOW IT WORKS</h2>
  244. <p>
  245. The Ethics Canvas helps you structure ideas about the ethical implications of the projects you are working on, to visualise them and to resolve them.
  246. </p>
  247. <img src="img/canvas-screen.png"/>
  248. </div>
  249. <div class="how-it-works col-md-8 col-md-offset-2">
  250. <p>
  251. Add cards with your ideas to the fields of the canvas. Drag and drop cards to different fields. Link cards to each other, for instance specific stakeholders to specific ethical concerns. The Canvas is dynamic and will adapt to your workflow.
  252. </p>
  253. <p>
  254. You’ll get an overview of the most prominent ethical concerns of your project by glancing at the canvas. No complicated setup or configuration is required; just plug and play!
  255. </p>
  256. </div>
  257. </div>
  258. <!-- ======================
  259. ABOUT THE ETHICS CANVAS
  260. =======================-->
  261. <div class="row">
  262. <div class="about-ethics-canvas col-md-8 col-md-offset-2">
  263. <h2>ABOUT THE ETHICS CANVAS</h2>
  264. <p>The Ethics Canvas has been developed to encourage educators, entrepreneurs, engineers and designers to engage with ethics in their research and innovation projects. Research and innovation foster great benefits for society, but also raise
  265. important ethical concerns.
  266. </p>
  267. </div>
  268. </div>
  269. <div class=" chalky-canvas about-ethics-canvas container-fluid">
  270. <img src="img/the-ethics-canvas.jpg" alt="The Ethics Canvas"/>
  271. </div>
  272. <div class="row">
  273. <div class="about-ethics-canvas col-md-8 col-md-offset-2">
  274. <p>
  275. The big data revolution raises important privacy concerns. Progress in automation such as self-driving cars raises responsibility issues. Sharing platforms trigger social conflicts and precarious workers protesting on the streets.
  276. </p>
  277. <p>
  278. These and other concerns need to be dealt with, but cannot be dealt with by ethicists alone. Identifying and solving ethical concerns needs a collaborative effort, with people from different disciplines and in different professional roles working
  279. together.
  280. </p>
  281. <p>
  282. The Ethics Canvas responds to this need, by providing an easy to use collaborative tool that assists in the identification, analysis and solving of ethical implications in research and innovation projects. It is both suitable for offline use, as a
  283. paper canvas, and for online use, as an online collaborative tool.
  284. </p>
  285. </div>
  286. </div>
  287. <!-- ======================
  288. OUR VALUES
  289. =======================-->
  290. <div class="row our-values">
  291. <h2>OUR VALUES</h2>
  292. <div class="nonprofit col-md-3 col-sm-6">
  293. <img src="icon/heart.svg"/>
  294. <h3>Driven by Conviction, Not by Money</h3>
  295. <p>We are a non-profit organisation. We work on the canvas for the purpose of empowering people, not for making money.
  296. </p>
  297. </div>
  298. <div class="inclusive col-md-3 col-md-6">
  299. <img src="icon/world.svg"/>
  300. <h3>Inclusive Design</h3>
  301. <p>We believe that the Ethics Canvas should be accessible to everyone. Therefore, joining is free. Also, the Ethics Canvas has a Creative Commons license. With proper attribution, everyone is able to use, modify and reuse the Ethics Canvas.
  302. </p>
  303. </div>
  304. <div class="open-source col-md-3 col-sm-6">
  305. <img src="icon/open.svg"/>
  306. <h3>Subscribing to the Open Source Principles</h3>
  307. <p>The online Ethics Canvas is an open source project, which means that the code is openly available. We support and adhere to the open source principles of transparency, participation and collaboration.
  308. </p>
  309. </div>
  310. <div class=" data-privacy col-md-3 col-sm-6 ">
  311. <img src="icon/key.svg"/>
  312. <h3>Responsible Use of Personal Data</h3>
  313. <p>As a platform that tries to promote ethics, our core priority is to focus on ethical data handling. Explicit consent for the use of personal data will always be asked, with clear and simple terms and conditions. Personal data will only be gathered
  314. for research purposes and community building purposes, never for commercial purposes.
  315. </p>
  316. <p>No third party exchange of personal data will happen through our online platform.
  317. </p>
  318. </div>
  319. </div>
  320. <!-- end of .row .our-values -->
  321. <!-- ======================
  322. MEAT THE TEAM
  323. =======================-->
  324. <div class="row meet-the-team">
  325. <div class="col-md-10 col-md-offset-1">
  326. <h2>MEET THE TEAM</h2>
  327. <p class="team-intro">A team of researchers in the
  328. <a class="adapt" href="http://adaptcentre.ie/">ADAPT Centre</a>
  329. has developed the Ethics Canvas. It is the result of a truly multidisciplinary effort, pulling together expertise from the areas of ethics, computer science and business development.
  330. </p>
  331. </div>
  332. <div class="team-member wessel col-md-4 col-sm-6">
  333. <h3 class="member-name">
  334. Wessel Reijers</h3>
  335. <p class="member-role">Concept developer, ethics
  336. </p>
  337. <p class="member-contact"> wessel@ethicscanvas.org
  338. </p>
  339. <img src="img/wessle.jpg" alt="Wessel Reijers, Concept developer in the Online Ethics Canvas project"/>
  340. <p>
  341. Wessel is doing research in the areas of philosophy and ethics of technology in the ADAPT Centre. His main focus is on how to integrate ethics in the practices of research and innovation.
  342. </p>
  343. <p>
  344. Currently, he is working on developing a theoretical, narrative approach to understand how technologies mediate human relations. Also, he works on a practical application of his research in the so-called "ethics canvas", which is a tool for
  345. researchers to explore ethical issues.
  346. </p>
  347. </div>
  348. <div class="team-member dave col-md-4 col-sm-6">
  349. <h3 class="member-name">David Lewis</h3>
  350. <p class="member-role">Coordinator</p>
  351. <p class="member-contact">dave@ethicscanvas.org
  352. </p>
  353. <img src="img/dave.jpg" alt="David Lewis, Coordinator in the Online Ethics Canvas project" />
  354. <p>
  355. Dave is a Research Lecturer in the Knowledge and Data Engineering Group of the School of Computer Science and Statistics at Trinity College Dublin. He moved to TCD in 2002 from University College London where he worked for 11 years as a Research
  356. Fellow in the Computer Science Department.
  357. </p>
  358. <p>
  359. Dave's research interests are in the Semantic Modelling and Policy-Based Management in self-managing networks, services and organisations.
  360. </p>
  361. <!-- </div> -->
  362. </div>
  363. <div class=" team-member killian col-md-4 col-sm-6">
  364. <h3 class="member-name">Dr.Killian Levacher
  365. </h3>
  366. <p class="member-role">Concept developer, ethics
  367. </p>
  368. <p class="member-contact">killian@ethicscanvas.org
  369. </p>
  370. <img src="img/killian.jpg" alt="Dr.Killian Levacher, Concept developer in the Online Ethics Canvas project"/>
  371. <p>
  372. Dr. Killian Levacher is a post-doctoral researcher at the ADAPT Centre, based in Trinity College the University of Dublin (TCD).
  373. His research focuses upon advancing the state of the art in the area of Deep Learning NLP within the context of Personalised Siri-like Dialogue Systems.
  374. </p>
  375. <p>
  376. Prior to joining the ADAPT centre, Killian obtained an MSc and PhD in TCD, for which he received multiple academic awards (best research thesis and best academic results)
  377. </p>
  378. </div>
  379. </div>
  380. <!-- end of first .row .meet-the-team -->
  381. <div class="row meet-the-team">
  382. <div class="team-member arturo col-md-4 col-sm-6">
  383. <h3>Arturo Calvo
  384. </h3>
  385. <p class="member-role">Concept developer and business developer</p>
  386. <p class="member-contact">arturo@ethicscanvas.org
  387. </p>
  388. <img src="img/arturo.jpg" alt="Arturo Calvo, Concept developer and business development in the Online Ethics Canvas project"/>
  389. <p>
  390. Arturo is a software professional with experience in the industry and in academia. As a Software Architect at <a href="http://www.adaptcentre.ie" target="_new">ADAPT Centre</a>, he coordinates the overall technology of a set of research projects ranging from Machine Learning to Ethics.</p><p> Passionate about entrepreneurship and technology, he is very active in the Dublin startup ecosystem. Arturo founded three companies in the past, and he is CTO of a new one: <a href="https://www.sedicii.com" target="_new">Sedicii</a>. He is the main organiser of the <a href="http://www.meetup.com/Machine-Learning-Dublin/" target="_new">Machine Learning Dublin</a> meetup group.
  391. </p>
  392. </div>
  393. <!--
  394. <div class=" team-member andreas col-md-4 col-sm-6 ">
  395. <h3>Andreas Burburan
  396. </h3>
  397. <p class="member-role">
  398. Web developer and Interaction Designer
  399. </p>
  400. <p class="member-contact">
  401. a.burburan@gmail.com
  402. </p>
  403. <img src="img/andreas.jpg" alt="Andreas Burburan, web developer and interaction designer in the Online Ethics Canvas project"/>
  404. <p>
  405. Andreas is a web developer and interaction designer.
  406. </p>
  407. </div>
  408. -->
  409. <div class=" team-member farnoosh col-md-4 col-sm-6 ">
  410. <h3>Farnoosh Mohri
  411. </h3>
  412. <p class="member-role">
  413. Front-end developer and Interaction Designer</p>
  414. <p class="member-contact">farnoosh@ethicscanvas.org
  415. </p>
  416. <img src="img/farnoosh.jpg" alt="Farnoosh Mohri, Concept developer and business development in the Online Ethics Canvas project"/>
  417. <p>
  418. Farnoosh is a front-end developer and interaction designer. She has a great passion for technology and how it can empower us as humans. She has studied web and multimedia development and she has been involved in different design and development projects with start-ups at Innovation Park in Sweden.
  419. </p>
  420. <p>
  421. Farnoosh believes that our global digital connection and engagement is a crucial part of the human experience. She has joined the Online Ethics Canvas team at ADAPT Centre, as a wish to create new possibilities through innovative digital content, and contribute to a better world.
  422. </p>
  423. </div>
  424. </div>
  425. <!-- end of second .row .meet-the-team -->
  426. <!-- ======================
  427. OUR PARTNERS
  428. =======================-->
  429. <div class="row our-partners">
  430. <h2>OUR PARTNERS</h2>
  431. <div class="nonprofit col-md-3 col-sm-6">
  432. <a href="http://adaptcentre.ie/"><h3>ADAPT Centre</h3>
  433. <img src="icon/adapt_logo.png" alt="logo of ADAPT Centre"/>
  434. </a>
  435. <p>
  436. </p>
  437. </div>
  438. <div class="inclusive col-md-3 col-md-6">
  439. <a href="https://www.tcd.ie/"><h3>Trinity College Dublin</h3>
  440. <img src="icon/TCD_logo.png" alt="logo of Trinity College Dublin"/></a>
  441. <p>
  442. </p>
  443. </div>
  444. <div class="open-source col-md-3 col-sm-6">
  445. <a href="http://www.dcu.ie/"><h3>Dublin City University</h3>
  446. <img src="icon/DCU_logo.png" alt="logo of Dublin City University"/></a>
  447. <p>
  448. </p>
  449. </div>
  450. <div class=" data-privacy col-md-3 col-sm-6 ">
  451. <a href="http://www.sfi.ie/"><h3>Science Foundation Ireland</h3>
  452. <img src="icon/SFI_logo.png" alt="logo of Science Foundation Ireland"/></a>
  453. <p>
  454. </p>
  455. </div>
  456. </div>
  457. <!-- end of .row .our-values -->
  458. <!-- =========================
  459. Embedding Mailchimp
  460. =========================== -->
  461. <div id="mc_embed_signup" class="col-md-4 col-md-offset-4 col-sm-6 col-sm-offset-3">
  462. <form action="//ethicscanvas.us13.list-manage.com/subscribe/post?u=53efa44306740eee9f381db25&amp;id=7d7866e017" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
  463. <div id="mc_embed_signup_scroll">
  464. <h2>
  465. <!-- aria-hidden="true" attribute for accessibility of icons (hide the decorative icons from the screen reader) -->
  466. <span class="envelope-icon glyphicon glyphicon-envelope
  467. " aria-hidden="true"></span>Subscribe to the Ethics Canvas mailing list</h2>
  468. <div class="mc-field-group">
  469. <label for="mce-FNAME">First Name
  470. </label>
  471. <input type="text" value="" name="FNAME" class="required" id="mce-FNAME">
  472. <label for="mce-LNAME">Last Name
  473. </label>
  474. <input type="text" value="" name="LNAME" class="required" id="mce-LNAME">
  475. <label for="mce-EMAIL">Email Address
  476. </label>
  477. <input type="email" value="" name="EMAIL" class="required email" id="mce-EMAIL">
  478. </div>
  479. <div id="mce-responses" class="clear">
  480. <div class="response" id="mce-error-response" style="display:none"></div>
  481. <div class="response" id="mce-success-response" style="display:none"></div>
  482. </div>
  483. <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
  484. <div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_53efa44306740eee9f381db25_7d7866e017" tabindex="-1" value=""></div>
  485. <div class="clear"><input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button Subscribe"></div>
  486. </div>
  487. </form>
  488. </div>
  489. <!-- End of Mailchimp -->
  490. <!-- FOOTER -->
  491. <div class="row">
  492. <footer class="col-md-12 text-center">
  493. <div class="contact">
  494. <h2>Contact us:</h2>
  495. <p>hello@ethicscanvas.org</p>
  496. </div>
  497. <div class="license">
  498. <p>The Ethics Canvas is adapted from Alex Osterwalder’s Business Model Canvas.</p>
  499. <p>The Business Model Canvas is designed by: Business Model Foundry AG.
  500. </p>
  501. <p>
  502. This work is licensed under the Creative Commons Attribution-Share Alike 3.0 unported license.</p>
  503. <p class="cc"><span class="glyphicon glyphicon-list" aria-hidden="true"></span> View a copy of this license on:</p>
  504. <p>
  505. <a href="https://creativecommons.org/licenses/by-sa/3.0/">creativecommons.org</a>
  506. </p>
  507. <p class="bmc"><span class="glyphicon glyphicon-th-large" aria-hidden="true"></span>
  508. View the original Business Model Canvas on:
  509. </p>
  510. <p>
  511. <a href="https://strategyzer.com/canvas">strategyzer.com</a>
  512. </p>
  513. </div>
  514. <div class="license-icons">
  515. <ul>
  516. <li><img src="icon/by.large.png" alt="ethics-canvas-by-icon"/> </li>
  517. <li><img src="icon/share.large.png" alt="ethics-canvas-share-icon"/> </li>
  518. <li><img src="icon/cc.large.png" alt="ethics-canvas-cc-icon"/> </li>
  519. <li> <img src="icon/remix.large.png" alt="ethics-canvas-remix-icon"/></li>
  520. <li> <img src="icon/sa.large.png" alt="ethics-canvas-sa-icon"/></li>
  521. </ul>
  522. </div>
  523. <p class="ethics-copy terms"><a href="privacy-terms/terms.html">Terms of Service</a></p>
  524. <p class="ethics-copy privacy"><a href="privacy-terms/privacy.html">Privacy Policy</a></p>
  525. <p class="ethics-copy">The ADAPT Centre for Digital Content Technology</p> <p class="ethics-copy">is funded under the SFI Research Centres Programme (Grant 13/RC/2106).</p><p class="ethics-copy">It is co-funded under the European Regional Development Fund.</p>
  526. <p class="ethics-copy">Ethics Canvas v1.8&nbsp;|&nbsp;&copy; ADAPT Centre &amp; Trinity College Dublin &amp; Dublin City University, 2017</p>
  527. </footer>
  528. </div>
  529. <!-- end of outer container-fluid -->
  530. <!-- Add jQuery -->
  531. <script src="https://code.jquery.com/jquery-3.0.0.min.js" integrity="sha256-JmvOoLtYsmqlsWxa7mDSLMwa6dZ9rrIdtrrVYRnDRH0=" crossorigin="anonymous"></script>
  532. <!-- jquery UI -->
  533. <script src="https://code.jquery.com/ui/1.12.0-rc.2/jquery-ui.min.js" integrity="sha256-55Jz3pBCF8z9jBO1qQ7cIf0L+neuPTD1u7Ytzrp2dqo=" crossorigin="anonymous"></script>
  534. <!-- Mailchimp Script-->
  535. <script type="text/javascript" src="//s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"></script>
  536. <script type="text/javascript">
  537. (function($) {
  538. window.fnames = new Array();
  539. window.ftypes = new Array();
  540. fnames[0] = 'EMAIL';
  541. ftypes[0] = 'email';
  542. fnames[1] = 'FNAME';
  543. ftypes[1] = 'text';
  544. fnames[2] = 'LNAME';
  545. ftypes[2] = 'text';
  546. }(jQuery));
  547. var $mcj = jQuery.noConflict(true);
  548. </script>
  549. <!-- jQuery -->
  550. <script src="https://code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script>
  551. <!-- Bootstrap -->
  552. <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
  553. <!-- The Slick Carousel jQuery plugin (slider) -->
  554. <script type="text/javascript" src="//cdn.jsdelivr.net/jquery.slick/1.6.0/slick.min.js"></script>
  555. <!-- The app javascript -->
  556. <script src="js/landing.js" charset="utf-8"></script>
  557. </body>
  558. </html>