diff --git a/apps/sleeplog/interface.html b/apps/sleeplog/interface.html
new file mode 100644
index 000000000..98f5a8856
--- /dev/null
+++ b/apps/sleeplog/interface.html
@@ -0,0 +1,118 @@
+<html>
+  <head>
+    <link rel="stylesheet" href="../../css/spectre.min.css">
+  </head>
+  <body>
+    
+    <div id="table"></div>
+
+    <script src="../../core/lib/interface.js"></script>
+    <script>
+var domTable = document.getElementById("table");
+
+function saveCSV(logData, title) {
+  var timeFormat = domTable.querySelector("select").selectedIndex;
+  var csv = "time,sleep,consecutive\n";
+
+  logData.forEach(entry => {
+    entry[0] *= 6E5;
+    if (timeFormat === 1) entry[0] /= 1E3;
+    if (timeFormat === 2) entry[0] = entry[0] / 864E5 + 25569;
+    csv += [
+      entry[0],
+      entry[1],
+      entry[2]
+    ].join(",")+"\n";
+  }
+
+  Util.saveCSV(title, csv);
+}
+
+function readLog(date, callback) {
+  Util.showModal("Downloading logged data...");
+  Puck.eval(`require("sleeplog").readLog(date, date + 12096E5)`, logData => {
+    Util.hideModal();
+    callback(logData);
+  });
+}
+function getFnList() {
+  Util.showModal("Loading...");
+  domTable.innerHTML = "";
+  Puck.eval(`require("Storage").list(/^sleeplog_\\d{4}\.log$/)`, files => {
+    function fnToMs(no) { return (no + 0.25) * 12096E5; }
+    // add this fortnight
+    files.push("" + Math.floor(Date.now() / 12096E5 - 0.25));
+    files = files.map(file => {
+      var ret {
+        filename: file,
+        fortnigt: file.match(/\\d{4})/)[0], // 1234
+      };
+      ret.date: (ret.fortnigt + 0.25) * 12096E5;
+      ret.str: new Date(ret.date).toLocaleDateString(undefined) + " - " + new Date(ret.date + 12096E5).toLocaleDateString(undefined);
+      return ret;
+    })
+    var html = `<table class="table table-striped table-hover">
+  <thead>
+    <tr>
+      <th>Fortnight</th>
+      <th>
+        time format:
+        <select>
+          <option>JavaScript (msec since 1970-01-01T00:00)</option>
+          <option>UNIX (sec since 1970-01-01T00:00)</option>
+          <option>Office (days since 1900-01-01T00:00)</option>
+        </select>
+      </th>
+    </tr>
+  </thead>
+  <tbody>`;
+    files.forEach(file => {
+      html += `
+      <tr>
+        <td>${file.fortnigt}</td>
+        <td>
+          ${file.str}
+          <button class="btn btn-primary" task="downloadcsv" date="${file.date}" str="${file.str}">Download CSV</button>`;
+      if (file.filename.endsWith(".log")) html += `
+          <button class="btn btn-default" task="delete" filename="${file.filename}">Delete</button>`;
+      html += `
+        </td>
+      </tr>`;
+    });
+    html += `
+    </tbody>
+</table>`;
+    domTable.innerHTML = html;
+    Util.hideModal();
+    var buttons = domTable.querySelectorAll("button");
+    for (var i=0;i<buttons.length;i++) {
+      buttons[i].addEventListener("click",event => {
+        var button = event.currentTarget;
+        var task = button.getAttribute("task");
+        if (!task) return;
+        if (task=="downloadcsv") {
+          var date = button.getAttribute("date");
+          var str = button.getAttribute("str");
+          if (!date || !str) return;
+          readLog(date, logData => saveCSV(logData, "sleeplog_" + str + ".csv"));
+        } else if (task=="delete") {
+          var filename = button.getAttribute("filename");
+          if (!filename) return;
+          Util.showModal("Deleting...");
+          Util.eraseStorage(filename,()=>{
+            Util.hideModal();
+            getTrackList();
+          });
+        }
+      });
+    }
+  })
+}
+
+function onInit() {
+  getFnList();
+}
+
+    </script>
+  </body>
+</html>
diff --git a/apps/sleeplog/metadata.json b/apps/sleeplog/metadata.json
index 7ed0da1ce..909aee24e 100644
--- a/apps/sleeplog/metadata.json
+++ b/apps/sleeplog/metadata.json
@@ -9,6 +9,7 @@
   "tags": "tool,boot",
   "supports": ["BANGLEJS2"],
   "readme": "README.md",
+  "interface": "interface.html",
   "storage": [
     {"name": "sleeplog.app.js", "url": "app.js"},
     {"name": "sleeplog.img", "url": "app-icon.js", "evaluate": true},
