Technigo · NikkiJoy · Sep 28, 2021 · Oct 2, 2021 · Oct 2, 2021 · Oct 23, 2021
diff --git a/code/10 vor 10.jpg b/code/10 vor 10.jpg
diff --git a/code/30 under 30.jpg b/code/30 under 30.jpg
diff --git a/code/AI Evaluation.jpg b/code/AI Evaluation.jpg
diff --git a/code/Arui Trockenblumen.jpg b/code/Arui Trockenblumen.jpg
diff --git a/code/Climate Ticker.jpg b/code/Climate Ticker.jpg
diff --git a/code/Data Café.jpg b/code/Data Café.jpg
diff --git a/code/Digital Ethics and Climate.jpg b/code/Digital Ethics and Climate.jpg
diff --git a/code/Digital Ethics.jpg b/code/Digital Ethics.jpg
diff --git a/code/Digital Shaper.jpg b/code/Digital Shaper.jpg
diff --git a/code/Digital Utopia.jpg b/code/Digital Utopia.jpg
diff --git a/code/Digitalbarometer Interview.jpg b/code/Digitalbarometer Interview.jpg
diff --git a/code/Escape Room.jpg b/code/Escape Room.jpg
diff --git a/code/Link Magazin.jpg b/code/Link Magazin.jpg
diff --git a/code/Mercator_Wert von Daten.pdf b/code/Mercator_Wert von Daten.pdf
diff --git a/code/Nikki Fav.jpg b/code/Nikki Fav.jpg
diff --git a/code/Nikki-Q.jpg b/code/Nikki-Q.jpg
diff --git a/code/Nikki.jpg b/code/Nikki.jpg
diff --git a/code/Nikki_fav.png b/code/Nikki_fav.png
diff --git a/code/OK Klima.jpg b/code/OK Klima.jpg
diff --git a/code/Podium Digitale Demokratie.jpg b/code/Podium Digitale Demokratie.jpg
diff --git a/code/Prototype Fund.jpg b/code/Prototype Fund.jpg
diff --git a/code/Responsible AI Check.jpg b/code/Responsible AI Check.jpg
diff --git a/code/Responsible AI Presentation.jpg b/code/Responsible AI Presentation.jpg
diff --git a/code/Security Awareness Day.jpg b/code/Security Awareness Day.jpg
diff --git a/code/Social Business Club.jpg b/code/Social Business Club.jpg
diff --git a/code/VersusVirus.jpg b/code/VersusVirus.jpg
diff --git a/code/Wert von Daten.jpg b/code/Wert von Daten.jpg
diff --git a/code/contact.html b/code/contact.html
@@ -0,0 +1,39 @@
+<!DOCTYPE html>
+<html>
+
+  <head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Project Name</title>
+    <link rel="stylesheet" type="text/css" href="style.css">
+    <!-- If you're using google fonts, that should be added here -->
+  </head>
+  <body>
+    <!--Menu-->
+    <menu>  
+      <div class="menu-left">
+        <a href="./index.html">Nikki Böhler</a>
+      </div>
+      <div class="menu-right">
+        <a href="./more.html">More</a>
+        <a href="./contact.html">Contact</a>
+      </div>
+    </menu>
+
+    <!-- Title-->
+    <h1>Get in touch</h1>
+
+    <!-- Description-->
+    <div>
+      <p>If you want to work with me, reach out to xy@protonmail.ch.</p>
+    </div>
+
+
+    <!-- Footer-->
+    <footer>
+      <p><a href="https://twitter.com/n3ijoy" target="_blank">Twitter</a> <a href="https://www.instagram.com/n3ijoy/" target="_blank">Instagram</a> <a href="https://www.linkedin.com/in/nikki-b%C3%B6hler-75922573/" target="_blank">Linkedin</a></p>
+      <p>powered by Nikki thanks to <a href="https://codeexcursion.ch/">Code Excursion</a></p>
+    </footer>
+
+  </body>
+</html>
diff --git a/code/data literacy panel.jpg b/code/data literacy panel.jpg
diff --git a/code/emoji.png b/code/emoji.png
diff --git a/code/index.html b/code/index.html
@@ -4,18 +4,149 @@
   <head>
     <meta charset="utf-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Project Name</title>
-    <!-- dont forget to add a css file and link it here! -->
-    <!-- If you're using google fonts, that should be added here -->
+    <title>Nikki Böhler</title>
+    <link rel='icon' href='Nikki Fav.jpg' type='image/x-icon'/ >
+    <link rel="stylesheet" type="text/css" href="style.css">
+    <!-- Add icon library -->
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/fork-awesome@1.2.0/css/fork-awesome.min.css" integrity="sha256-XoaMnoYC5TH6/+ihMEnospgm0J1PM/nioxbOUdnM8HY=" crossorigin="anonymous">
   </head>
   <body>
-    <!-- 
-      Write your code here inside the body to make it appear in the browser. 
-      Below is an example on how to use an image tag. Copy it and add it in the body, but outside the comment tag if you want to see how it looks like on the website. Then you can change the size and other styling for it in the css file.
+
+
+    <!-- Title -->
+    <h1>Hi</h1>
+
+    <!-- Introduction -->
+    <section class="boxes">
+      <p>I’m Nikki, an entrepreneur dedicated to tech, culture and feminism. I am a co-founder of <a href="https://intersections.ch" target="_blank">Intersections</a>, member of the art collective <a href="https://t8y.ch" target="_blank">t8y</a>, expert of the <a href="https://digitaltrust-label.swiss/" target="_blank">Digital Trust Label</a> and board member of <a href="https://hek.ch/" target="_blank">HEK</a> and <a href="https://code-excursion.ch/" target="_blank">CodeExcursion</a>.</p>
+    </section>
 
-      <img src="example-recipe-background.png" alt="Banana Bread">
 
-    -->
-    <h1>Hello there! 👋🏼</h1>
+    <!-- Ventures -->
+    <section class="boxes">
+      <div class="boxes-intro">
+        <h2>Ventures</h2>
+        <p>I advise organisations and co-develop projects for the responsible use of new technologies.</p>
+      </div>
+      <div class="boxes-cards">
+        <div class="cards">
+          <img src="Responsible AI Check.jpg" alt="Responsible AI Check Visual">
+          <p><a href="https://www.intersections.ch/" target="_blank">Responsible AI Check</a>:
+            An assessment of AI applications to identify risks and derive practical recommendations.</p>
+        </div>
+        <div class="cards">
+          <img src="Escape Room.jpg" alt="KI Escape Room Foto">
+          <p><a href="https://www.atelierdufutur.ch/" target="_blank">AI Escape Room</a>:
+          A playful and interactive training programme on various aspects of AI systems.</p>
+        </div>
+        <div class="cards">
+          <img src="OK Klima.jpg" alt="OK Klima Visual">
+          <p><a href="https://www.ok-klima.ch/" target="_blank">OK Klima</a>:
+          A nationwide platform and community to evaluate and participate in local climate policies.</p>
+        </div>
+        <div class="cards">
+          <img src="Prototype Fund.jpg" alt="Prototype Fund">
+          <p><a href="https://prototypefund.ch" target="_blank">Prototype Fund</a>:
+          A support program for interdisciplinary teams that work on open-source public interest tech.</p>
+        </div>
+        <div class="cards">
+          <img src="Data Café.jpg" alt="Data Café"> 
+          <p><a href="https://www.datacafe.ch/" target="_blank">Data Café</a>:
+          An awareness campaign about the value of data in modern society to strengthen data literacy.</p>
+        </div>
+        <div class="cards">
+          <img src="Arui Trockenblumen.jpg" alt="Arui Trockenblumen"> 
+          <p><a href="https://www.bio-blumen.ch/" target="_blank">Arui</a>:
+          An online start-up for sustainable dried flowers, sold to a family-owned organic farming business.</p>
+        </div>
+        <div class="cards">
+          <img src="VersusVirus.jpg" alt="Arui Trockenblumen"> 
+          <p><a href="https://www.de.versusvirus.ch/" target="_blank">VersusVirus</a>:
+          A national online Hackathon and incubation program to cope with the Covid-19 pandemic.</p>
+        </div>
+        <div class="cards">
+          <img src="Social Business Club.jpg" alt="Social Business Club"> 
+          <p><a href="https://www.socialbusinessclub.ch/" target="_blank">Social Business Club</a>:
+          An association at the University of St. Gallen that raises awareness for social entrepreneurship.</p>
+        </div>
+        <div class="cards">
+          <img src="Digital Utopia.jpg" alt="Digital Utopia Workshops"> 
+          <p><a href="https://medium.com/@nikkiboehler/on-the-way-to-digital-utopia-894c8f7ffdca" target="_blank">Digital Utopia Workshops</a>:
+          A workshop series to nurture the imagination of positive digital futures.</p>
+        </div>
+      </div>
+    </section>
+
+    <!-- Public-->
+    <section class="boxes">
+      <div class="boxes-intro">
+        <h2>Public</h2>
+        <p>Get in touch to raise awareness about value-driven digitalisation and innovation.</p>
+      </div>  
+      <div class="boxes-cards">
+        <div class="cards">
+          <img src="Responsible AI presentation.jpg" alt="Foto des Vortrags über responsible AI"> 
+          <p><a href="https://www.linkedin.com/feed/update/urn:li:activity:7219737407837921283/" target="_blank">Responsible AI Presentation</a>:
+            Don't panic, we have responsible AI now. But do we?</p>
+        </div>
+        <div class="cards">
+          <img src="swissfuture magazine.jpg" alt="swissfuture magazine"> 
+          <p><a href="https://www.intersections.ch/s/Bohler_Klauser_sf_rohstoffe_daten.pdf" target="_blank">Swissfuture Magazine</a>:
+            An article about data gaps, inclusion and ethics in the digital transformation.</p>
+        </div>
+        <div class="cards">
+          <img src="data literacy panel.jpg" alt="data literacy panel discussion"> 
+          <p><a href="https://www.youtube.com/watch?v=KQczNQy4PdE" target="_blank">Data Literacy Panel</a>:
+            A panel discussion about data literacy and how to make data tangible.</p>
+        </div>
+        <div class="cards">
+          <img src="Digital Ethics.jpg" alt="Digital Ethics Interview"> 
+          <p><a href="https://www.swiss-digital-initiative.org/news/on-digital-ethics-nikki-boehler/" target="_blank">Digital Ethics Interview</a>:
+            An interview with the Swiss Digital Initiative about digital ethics, privacy and literacy.</p>
+        </div>
+      <div class="cards">
+          <img src="10 vor 10.jpg" alt="10 vor 10 Beitrag"> 
+          <p><a href="https://www.srf.ch/sendungen/10vor10/serien/serien-offensiv-digital" target="_blank">10 vor 10 Portrait</a>:
+            A tv portrait about my engagement in civil society and digital policy.</p>
+        </div>
+        <div class="cards">
+          <img src="Podium Digitale Demokratie.jpg" alt="Podium Digitale Demokratie"> 
+          <p><a href="https://www.karldergrosse.ch/veranstaltungen/veranstaltung/digitale-demokratie-mit-digitalministerin-audrey-tang/" target="_blank">Digital Democracy Panel</a>:
+          A discussion about what Switzerland can learn from Taiwan on digital democracy.</p>
+        </div>
+        <div class="cards">
+          <img src="Digitalbarometer Interview.jpg" alt="Digitalbarometer Interview"> 
+          <p><a href=https://www.digitalbarometer.ch/de/blog/digitalbarometer2022-wunsch-nach-digitaler-souveraenitaet-DvY6GgY" target="_blank">'Digitalbarometer Interview</a>:
+            A video interview about data awareness for the Digitalbarometer study.</p>
+        </div>
+        <div class="cards">
+          <img src="Wert von Daten.jpg" alt="Wert von Daten Magazin"> 
+          <p><a href="Mercator_Wert von Daten.pdf" target="_blank">'Wert von Daten' Magazine</a>:
+            An article about the value of open data for the Foundation Mercator Switzerland.</p>
+        </div>
+        <div class="cards">
+          <img src="Link Magazin.jpg" alt="SRG Link Magazin"> 
+          <p><a href="https://www.srgd.ch/de/aktuelles/news/2020/12/03/die-forderung-von-datenkompetenz-ist-auch-aufgabe-der-medien/" target="_blank">SRG Link Magazine</a>:
+            An article about data awareness and literacy in the Link Magazine by SRG.</p>
+        </div>
+      </div>
+    </section>
+
+    <!-- Stay Connected-->
+    <section class="boxes">
+      <h2>Stay Connected</h2>
+      <p>Would you like to keep up to date with my work? Sign up for my <a href="https://seu2.cleverreach.com/f/354895-359560/" target="_blank">newsletter</a>.</p>
+      <p>Do you work towards similar visions and want to join forces? Reach out via <a href="mailto:boehlern@protonmail.ch">Email</a>.</p>
+    </section>
+
+
+    <!-- Footer-->
+    <footer>
+      <a href="https://mastodon.social/web/@nixter" target="_blank" class="fa fa-mastodon"></a>
+      <a href="https://www.instagram.com/n3ijoy/" target="_blank" class="fa fa-instagram"></a>
+      <a href="https://www.linkedin.com/in/nikki-b%C3%B6hler-75922573/" target="_blank" class="fa fa-linkedin"></a>
+    </footer>
+
   </body>
 </html>
diff --git a/code/more.html b/code/more.html
@@ -0,0 +1,68 @@
+<!DOCTYPE html>
+<html>
+
+  <head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Project Name</title>
+    <link rel="stylesheet" type="text/css" href="style.css">
+    <!-- If you're using google fonts, that should be added here -->
+  </head>
+  <body>
+    <!--Menu-->
+    <menu>  
+      <div class="menu-left">
+        <a href="./index.html">Nikki Böhler</a>
+      </div>
+      <div class="menu-right">
+        <a href="./more.html">More</a>
+        <a href="./contact.html">Contact</a>
+      </div>
+    </menu>
+
+    <!-- Title-->
+    <h1>What I'm up to</h1>
+
+    <!-- Description-->
+    <div>
+    </div>
+
+    <!-- Current Roles-->
+    <div class="boxes">
+      <h2>Current Roles</h2>
+      <ul>
+        <li>Opendata.ch, Director</li>
+        <li>Arui, Co-Director</li>
+        <li>SGG, Board Member</li>
+      </ul>
+    </div>
+
+     <!-- Ventures I co-founded-->
+     <div class="boxes">
+      <h2>Ventures I Co-Founded</h2>
+      <ul>
+        <li>Prototype Fund (Incubation Program)</li>
+        <li>Digitales Lernlabor (NGO)</li>
+        <li>Data Café (Awareness Campaign)</li>
+      </ul>    
+    </div>
+
+    <!-- Public-->
+    <div class="boxes">
+      <h2>Media, Publications & Talks</h2>
+      <ul>
+        <li>«Die Förderung von Datenkompetenz ist auch Aufgabe der Medien» – Article on data literacy in SRG Link Magazine</li>
+        <li>My recommendations at the onset of the pandemic – Opinion statement in Strategiedialog 21</li>
+        <li>Warum ein Schweizer Verein für mehr Klimadaten kämpft – Interview about climate data in Yova’s Blog </li>
+      </ul>     
+    </div>
+
+
+    <!-- Footer-->
+    <footer>
+      <p><a href="https://twitter.com/n3ijoy" target="_blank">Twitter</a> <a href="https://www.instagram.com/n3ijoy/" target="_blank">Instagram</a> <a href="https://www.linkedin.com/in/nikki-b%C3%B6hler-75922573/" target="_blank">Linkedin</a></p>
+      <p>powered by Nikki thanks to <a href="https://codeexcursion.ch/">Code Excursion</a></p>
+    </footer>
+
+  </body>
+</html>