diff --git a/app/templates/header.html.j2 b/app/templates/header.html.j2
index 2ba0fe21..ca892c12 100644
--- a/app/templates/header.html.j2
+++ b/app/templates/header.html.j2
@@ -1,24 +1,4 @@
 <header>
-  <nav>
-    <ul class="left hide-on-large-only">
-      <li><a href="#" data-target="slide-out" class="sidenav-trigger"><i class="material-icons">menu</i></a></li>
-    </ul>
-    <div class="nav-wrapper">
-      <span class="brand-logo center">
-        {% if title %}
-        {{ title }}
-        {% else %}
-        Opaque
-        {% endif %}
-      </span>
-      <ul class="right hide-on-med-and-down">
-        <li><a id="nav-notifications" class="dropdown-trigger" href="#!" data-target="nav-notifications-dropdown"><i class="material-icons">notifications</i></a></li>
-        <li><a id="nav-settings" class="dropdown-trigger" href="#!" data-target="nav-settings-dropdown"><i class="material-icons">settings</i></a></li>
-      </ul>
-    </div>
-  </nav>
-
-
   <!-- dropdowns -->
   <div id="nav-notifications-dropdown" class="dropdown-content">
     <p>Notifications</p>
@@ -26,9 +6,19 @@
   <div id="nav-settings-dropdown" class="dropdown-content">
     <p>Settings</p>
   </div>
+  <nav>
+    <div class="nav-wrapper">
+      <a href="#!" class="brand-logo">
+        {% if title %}{{ title }}{% else %}Opaque{% endif %}
+      </a>
+      <a href="#" data-target="slide-out" class="sidenav-trigger"><i class="material-icons">menu</i></a>
+      <ul class="right hide-on-med-and-down">
+        <li><a id="nav-notifications" class="dropdown-trigger" href="#!" data-target="nav-notifications-dropdown"><i class="material-icons">notifications</i></a></li>
+        <li><a id="nav-settings" class="dropdown-trigger" href="#!" data-target="nav-settings-dropdown"><i class="material-icons">settings</i></a></li>
+      </ul>
+    </div>
+  </nav>
 
-
-  <!-- sidenav -->
   <ul id="slide-out" class="sidenav sidenav-fixed">
     <li><a href="{{ url_for('index') }}">Opaque</a></li>
     <li><a href="{{ url_for('auth.login') }}">Login</a></li>
diff --git a/app/templates/index.html.j2 b/app/templates/index.html.j2
new file mode 100644
index 00000000..3648311a
--- /dev/null
+++ b/app/templates/index.html.j2
@@ -0,0 +1,55 @@
+{% extends "base.html.j2" %}
+
+{% block page_content %}
+<div class="col s12">
+  <h2>Services</h2>
+
+  <div class="row">
+    <div class="col s12 m4">
+      <div class="card small">
+        <div class="card-content">
+          <span class="card-title">Optical Character Recognition</span>
+          <p></p>
+        </div>
+      </div>
+    </div>
+
+    <div class="col s12 m4">
+      <div class="card small">
+        <div class="card-content">
+          <span class="card-title">Natural language processing</span>
+          <p></p>
+        </div>
+      </div>
+    </div>
+
+    <div class="col s12 m4">
+      <div class="card small">
+        <div class="card-content">
+          <span class="card-title">Text analysis</span>
+          <p></p>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <h2>Statistics</h2>
+  <div class="row">
+    <div class="col s12 m4">
+      <div class="card small">
+        <div class="card-content">
+          <span class="card-title">Server activity</span>
+          <div class="center">
+            <img src="{{ url_for('static', filename='images/server_activity.png') }}" alt="server activity"
+          class="responsive-image">
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+
+<!--
+
+-->
+{% endblock %}