diff --git a/console/src/downloader.css b/console/src/downloader.css
index f0316f349f..22b217d0a5 100644
--- a/console/src/downloader.css
+++ b/console/src/downloader.css
@@ -5,15 +5,107 @@
 
 * {
     font-family: "Proxima Nova", "Open Sans", Arial, Helvetica, sans-serif;
-    font-size: 1.022em;
     line-height: 130%;
 }
 
 body {
     margin: 0;
     padding: 0;
+    color: #808785;
+    margin: 0 auto;
+    text-align: center;
+    font-size: 14pt;
+    -webkit-touch-callout: none;
+    -webkit-user-select: none;
+}
+
+#error-message {
+    background-color: #F7F8F8;
+    color: #EB4C5F;
+    padding: 20px;
+    margin: 20px 120px 0 120px;
+    -webkit-touch-callout: text;
+    -webkit-user-select: text;
 }
 
 progress {
-    margin: 0 auto;
+    height: 1px;
+    width: 300px;
+    -webkit-appearance: none;
+}
+
+progress[value]::-webkit-progress-bar {
+    background-color: #DADADA;
+    /* border-radius: 2px; */
+}
+
+progress[value]::-webkit-progress-value {
+    background-color: #21B7D4;
+    /* border-radius: 2px; */
+}
+
+.state {
+    padding-top: 100px;
+}
+
+h1 {
+    font-size: 29pt;
+    font-weight: normal;
+}
+
+#cancel-area {
+    margin-top: 100px;
+}
+
+a:link,
+a:visited,
+a:hover,
+a:active {
+    color: #B4B4B4;
+}
+
+a:hover {
+    color: #2D88A4;
+}
+
+.one {
+    opacity: 0;
+    animation: dot 2.3s infinite;
+    animation-delay: 0.0s;
+}
+
+.two {
+    opacity: 0;
+    animation: dot 2.3s infinite;
+    animation-delay: 0.2s;
+}
+
+.three {
+    opacity: 0;
+    animation: dot 2.3s infinite;
+    animation-delay: 0.3s;
+}
+
+@-webkit-keyframes dot {
+    0% {
+        opacity: 0;
+    }
+    50% {
+        opacity: 1;
+    }
+    100% {
+        opacity: 0;
+    }
+}
+
+@keyframes dot {
+    0% {
+        opacity: 0;
+    }
+    50% {
+        opacity: 1;
+    }
+    100% {
+        opacity: 0;
+    }
 }
\ No newline at end of file
diff --git a/console/src/downloader.html b/console/src/downloader.html
index 5db3b64385..1b5602455c 100644
--- a/console/src/downloader.html
+++ b/console/src/downloader.html
@@ -7,19 +7,31 @@
     </head>
     <body onload="ready()">
       <div id="state-downloading" class="state">
+
+        <h1>Downloading<span class="one">.</span><span class="two">.</span><span class="three">.</span></h1>
         <progress max="100" value="80" id="download-progress"></progress>
+        <div id="cancel-area">
+          <a id="cancel" href="#">Cancel</a>
+        </div>
+
       </div>
       <div id="state-installing" class="state">
-        Installing!
-      </div>
-      <div id="state-error" class="state">
-        Error :(
-        <div id='error-message'></div>
-        <button>OK</button>
+
+        <h1>Installing<span class="one">.</span><span class="two">.</span><span class="three">.</span></h1>
+        <em>Just a moment</em>
+
       </div>
+
       <div id="state-complete" class="state">
-        Complete
-        <button>OK</button>
+        <h1>Success!</h1>
+        <em>You're all set.</em>
       </div>
+
+      <div id="state-error" class="state">
+
+        <h1>Houston...</h1>
+        <em>An unfortunate error has occurred:</em>
+        <div id="error-message">
+        </div>
     </body>
 </html>
diff --git a/console/src/downloader.js b/console/src/downloader.js
index 14f8482415..d40da51c73 100644
--- a/console/src/downloader.js
+++ b/console/src/downloader.js
@@ -2,6 +2,7 @@ function ready() {
     console.log("Ready");
 
     const electron = require('electron');
+    const remote = require('remote');
     window.$ = require('./vendor/jquery/jquery-2.1.4.min.js');
 
     $(".state").hide();
@@ -10,14 +11,15 @@ function ready() {
 
     function updateState(state, args) {
         console.log(state, args);
-
         if (state == 'downloading') {
-            console.log("Updating progress bar");
             $('#download-progress').attr('value', args.progress * 100);
         } else if (state == 'installing') {
         } else if (state == 'complete') {
+            setTimeout(function() {
+                remote.getCurrentWindow().close();
+            }, 2000);
         } else if (state == 'error') {
-            $('#error-message').innerHTML = args.message;
+            $('#error-message').html(args.message);
         }
 
         if (currentState != state) {
@@ -33,5 +35,9 @@ function ready() {
         updateState(message.state, message.args);
     });
 
+    // updateState('error', { message: "This is an error message", progress: 0.5 });
+    // updateState('complete', { progress: 0 });
+
     updateState('downloading', { progress: 0 });
+    electron.ipcRenderer.send('ready');
 }
