diff --git a/view/index.html b/view/index.html
index 6a5c26a..aed4084 100644
--- a/view/index.html
+++ b/view/index.html
@@ -4,34 +4,44 @@
 <div class="col-lg-12">
 
 
-    <h2>indexer stats</h2>
+<h2>feta overview</h2>
+
+
+<div class="card m-5">
+  <h5 class="card-header">Instances</h5>
+  <div class="card-body">
+      <h5 class="card-title">Tracking {{ instances | length }} instances
+          across the Fediverse.</h5>
+    <!-- 
+        <p class="card-text">
+        </p> -->
+
+    <a href="/instances" class="btn btn-primary">View Instance List</a>
+  </div>
+</div>
+
+<div class="card m-5">
+  <h5 class="card-header">Toots</h5>
+  <div class="card-body">
+      <h5 class="card-title">I have {{ tootCount }} toots
+          in my database.</h5>
+    <a href="/toots" class="btn btn-primary">View Latest Toots</a>
+  </div>
+</div>
+
+<div class="card m-5">
+  <h5 class="card-header">Recent Events</h5>
+  <div class="card-body">
+      <h5 class="card-title">Last n System Events</h5>
+
+        <p class="card-text"> Discovered instance toot1.example.com </p>
+        <p class="card-text"> Discovered instance toot2.example.com </p>
+        <p class="card-text"> Discovered instance toot3.example.com </p>
+        <p class="card-text"> Discovered instance toot4.example.com </p>
+
+  </div>
+</div>
 
-<table class="table table-striped table-hover">
-  <thead class="thead-dark">
-<tr>
-  <th scope="col">instance id</th>
-  <th scope="col">hostname</th>
-  <th scope="col">status</th>
-  <th scope="col">tootCount</th>
-  <th scope="col">Detail</th>
-</tr>
-</thead>
-<tbody>
-{% for instance in instances %}
-    <tr>
-        <td><a href="/instance/{{instance.uuid}}">{{instance.uuid}}</a></td>
-        <td><a href="https://{{instance.hostname}}">{{instance.hostname}}</a></td>
-        <td>{{instance.status}}</td>
-        <td>{{instance.tootCount}}</td>
-        <td><a
-                href="/instance/{{instance.uuid}}"
-                class="btn btn-info">
-                <i class="fab fa-mastodon"></i>
-            </button></td>
-    </tr>
-{% endfor %}
- </tbody>
-</table>
 
 </div>
 {% endblock %}
diff --git a/view/instance.html b/view/instance.html
new file mode 100644
index 0000000..fa09213
--- /dev/null
+++ b/view/instance.html
@@ -0,0 +1,24 @@
+{% extends "page.html" %}
+
+{% block content %}
+<div class="col-lg-12">
+
+
+<h2>instance {{instance.hostname}}</h2>
+
+<div class="card m-5">
+  <div class="card-header">
+      <a href="/instance/{{instance.uuid}}">{{ instance.hostname }}</a>
+      ({{instance.tootCount}} toots)
+  </div>
+  <div class="card-body">
+      <h5 class="card-title">{{instance.status}}</h5>
+    <p class="card-text">First Stat</p>
+    <p class="card-text">Second Stat</p>
+    <p class="card-text">Third Stat</p>
+    <a href="https://{{instance.hostname}}" class="btn btn-primary">View Instance Website</a>
+  </div>
+</div>
+
+</div>
+{% endblock %}
diff --git a/view/instancelist.html b/view/instancelist.html
new file mode 100644
index 0000000..49234b1
--- /dev/null
+++ b/view/instancelist.html
@@ -0,0 +1,36 @@
+{% extends "page.html" %}
+
+{% block content %}
+<div class="col-lg-12">
+
+<h2>instance list</h2>
+
+<table class="table table-striped table-hover">
+  <thead class="thead-dark">
+<tr>
+  <th scope="col">hostname</th>
+  <th scope="col">status</th>
+  <th scope="col">tootCount</th>
+  <th scope="col">nextFetch</th>
+  <th scope="col">Detail</th>
+</tr>
+</thead>
+<tbody>
+{% for instance in instances %}
+    <tr>
+        <td><a href="https://{{instance.hostname}}">{{instance.hostname}}</a></td>
+        <td>{{instance.status}}</td>
+        <td>{{instance.tootCount}}</td>
+        <td>{{instance.nextFetch}}</td>
+        <td><a
+                href="/instance/{{instance.uuid}}"
+                class="btn btn-info">
+                <i class="fab fa-mastodon"></i>
+            </button></td>
+    </tr>
+{% endfor %}
+ </tbody>
+</table>
+
+</div>
+{% endblock %}