diff --git a/README.md b/README.md
index d52ec38..fb36036 100644
--- a/README.md
+++ b/README.md
@@ -17,4 +17,6 @@
     ```
     python manage.py runserver
     ```
-3. Point your browser to http://localhost:8000/
+
+3. Point your browser to http://localhost:8000/workspace/storage/
+
diff --git a/airavata_mft/apps/workspace/templates/airavata_mft_workspace/storage.html b/airavata_mft/apps/workspace/templates/airavata_mft_workspace/storage.html
deleted file mode 100644
index ea6c899..0000000
--- a/airavata_mft/apps/workspace/templates/airavata_mft_workspace/storage.html
+++ /dev/null
@@ -1,4 +0,0 @@
-{% extends "base.html" %}
-{% block app %}
-    This is where list of storage unit goes
-{% endblock app %}
\ No newline at end of file
diff --git a/airavata_mft/apps/workspace/templates/storage.html b/airavata_mft/apps/workspace/templates/storage.html
new file mode 100644
index 0000000..563f92c
--- /dev/null
+++ b/airavata_mft/apps/workspace/templates/storage.html
@@ -0,0 +1,3 @@
+{% extends "base.html" %}
+{% block app %}
+{% endblock app %}
\ No newline at end of file
diff --git a/airavata_mft/settings.py b/airavata_mft/settings.py
index 3adb5cd..5bde881 100644
--- a/airavata_mft/settings.py
+++ b/airavata_mft/settings.py
@@ -38,7 +38,7 @@
     'django.contrib.messages',
     'django.contrib.staticfiles',
     'rest_framework',
-    'airavata_mft.apps.workspace.apps.WorkspaceConfig'
+    'airavata_mft.apps.workspace'
 ]
 
 MIDDLEWARE = [
diff --git a/airavata_mft/templates/base.html b/airavata_mft/templates/base.html
index 1c60320..59731c1 100644
--- a/airavata_mft/templates/base.html
+++ b/airavata_mft/templates/base.html
@@ -1,15 +1,89 @@
-<!DOCTYPE html>
+<!--- This has to change according to the latest UX design specified in https://issues.apache.org/jira/browse/AIRAVATA-3314--->
+{% load static %}
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+    <meta name="description" content="">
+    <meta name="author" content="">
 
-<head>
+    <title>Airavata MFT</title>
 
-</head>
+    <!--  Bootstrap CSS CDN -->
+    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css" integrity="sha384-9gVQ4dYFwwWSjIDZnLEWnxCjeSWFphJiwGPXr1jddIhOegiu1FwO5qRGvFXOdJZ4" crossorigin="anonymous">
 
-<style>
+    <!-- Custom styles -->
+    <link href="{% static 'base.css' %}" type="text/css" rel="stylesheet">
+  </head>
 
-</style>
+  <body>
+    <nav class="navbar navbar-dark fixed-top bg-dark flex-md-nowrap p-0 shadow">
+      <a class="navbar-brand col-sm-3 col-md-2 mr-0" href="#">Airavata MFT</a>
+      <ul class="navbar-nav px-3">
+        <li class="nav-item text-nowrap">
+          <a class="nav-link" href="#">Sign out</a>
+        </li>
+      </ul>
+    </nav>
 
-<body>
-    This is where the top banner, left navigation bar will go
-    {% block app %}
-    {% endblock app %}
-</body>
\ No newline at end of file
+    <div class="container-fluid">
+      <div class="row">
+        <nav class="col-md-2 d-none d-md-block bg-light sidebar">
+          <div class="sidebar-sticky">
+            <ul class="nav flex-column">
+              <li class="nav-item">
+                <a class="nav-link active" href="#">
+                  <span data-feather="home"></span>
+                  Agents <span class="sr-only">(current)</span>
+                </a>
+              </li>
+              <li class="nav-item">
+                <a class="nav-link" href="#">
+                  <span data-feather="file"></span>
+                  Transactions
+                </a>
+              </li>
+              <li class="nav-item">
+                <a class="nav-link" href="#">
+                  <span data-feather="shopping-cart"></span>
+                  Test
+                </a>
+              </li>
+              <li class="nav-item">
+                <a class="nav-link" href="#">
+                  <span data-feather="users"></span>
+                  Test
+                </a>
+              </li>
+              <li class="nav-item">
+                <a class="nav-link" href="#">
+                  <span data-feather="bar-chart-2"></span>
+                  Test
+                </a>
+              </li>
+              <li class="nav-item">
+                <a class="nav-link" href="#">
+                  <span data-feather="layers"></span>
+                  Test
+                </a>
+              </li>
+            </ul>
+          </div>
+        </nav>
+
+        <main role="main" class="col-md-9 ml-sm-auto col-lg-10 px-4">
+          <div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom">
+            <h1 class="h2">{% block title %}Dashboard{% endblock title %}</h1>
+          </div>
+        </main>
+        {% block app %}
+        {% endblock app %}
+
+    <!-- Icons -->
+    <script src="https://unpkg.com/feather-icons/dist/feather.min.js"></script>
+    <script>
+      feather.replace()
+    </script>
+  </body>
+</html>
\ No newline at end of file