diff --git a/public/index.html b/public/index.html
index 6652c7dd60ad34f6d80148f3c8e6876702d19854..12a656c4e958ba1eab9eb63aecf573adc276d87e 100644
--- a/public/index.html
+++ b/public/index.html
@@ -1,23 +1,78 @@
 <!DOCTYPE html>
-<html>
-  <head>
-    <meta charset="utf-8">
-    <meta name="generator" content="GitLab Pages">
-    <title>Plain HTML site using GitLab Pages</title>
-    <link rel="stylesheet" href="style.css">
-  </head>
-  <body>
-    <div class="navbar">
-      <a href="https://pages.gitlab.io/plain-html/">Plain HTML Example</a>
-      <a href="https://gitlab.com/pages/plain-html/">Repository</a>
-      <a href="https://gitlab.com/pages/">Other Examples</a>
-    </div>
-
-    <h1>Hello World!</h1>
-
-    <p>
-      This is a simple plain-HTML website on GitLab Pages, without any fancy static site generator.
-    </p>
-  </body>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>HFT AR Projects</title>
+  <style>
+    body {
+      font-family: Arial, sans-serif;
+      text-align: center;
+      background-color: #f4f4f4;
+      margin: 0;
+      padding: 0;
+    }
+    header {
+      background-color: #003366;
+      color: white;
+      padding: 20px 0;
+      position: relative;
+    }
+    header img {
+      position: absolute;
+      right: 20px;
+      top: 20px;
+      width: 100px;
+      height: 100px;
+    }
+    header h1 {
+      margin: 0;
+    }
+    .content {
+      margin: 20px;
+    }
+    .button {
+      background-color: #003366;
+      color: white;
+      padding: 15px 25px;
+      margin: 10px;
+      border: none;
+      border-radius: 4px;
+      cursor: pointer;
+      font-size: 16px;
+    }
+    .button:hover {
+      background-color: #0055aa;
+    }
+    footer {
+      text-align: center;
+      margin-top: 50px;
+      padding: 10px;
+      background-color: #003366;
+      color: white;
+    }
+    footer a {
+      color: white;
+      text-decoration: none;
+    }
+    footer a:hover {
+      text-decoration: underline;
+    }
+  </style>
+</head>
+<body>
+  <header>
+    <h1>Welcome to HFT AR Projects</h1>
+    <img src="https://www.hft-stuttgart.de/typo3conf/ext/hft_sitepackage/Resources/Public/img/HFT_logo.svg" alt="HfT Stuttgart" />
+  </header>
+  <div class="content">
+    <p>Click on one of the buttons below to explore the AR projects:</p>
+    <button class="button" onclick="location.href='cube-project.html'">Cube Project</button>
+    <button class="button" onclick="location.href='tap-to-place-project.html'">Tap to Place Project</button>
+  </div>
+  <footer>
+    &copy; 2023 HfT Stuttgart. Prepared By <a href="mailto:your.email@example.com">Your Name</a>.
+  </footer>
+</body>
 </html>
 
