--- a/static/css/custom.css	Fri Nov 08 14:43:16 2013 +0900
+++ b/static/css/custom.css	Fri Nov 08 18:25:36 2013 +0900
@@ -58,3 +58,12 @@
 .align-right {
     text-align: right;
 }
+
+.ui-sidebar {
+    position: relative;
+    margin-top: 20px;
+}
+
+.workspace-tabs {
+    position: absolute;
+}

--- a/static/js/framework/collections.js	Fri Nov 08 14:43:16 2013 +0900
+++ b/static/js/framework/collections.js	Fri Nov 08 18:25:36 2013 +0900
@@ -1,3 +1,8 @@
+var Workspaces = Backbone.Collection.extend({
+    localStorage: new Backbone.LocalStorage('workspaces'),
+    model: Workspace
+});
+
 var Projects = Backbone.Collection.extend({
     model: Project
 });

--- a/static/js/framework/models.js	Fri Nov 08 14:43:16 2013 +0900
+++ b/static/js/framework/models.js	Fri Nov 08 18:25:36 2013 +0900
@@ -17,6 +17,10 @@
     }
 });
 
+var Workspace = Backbone.Model.extend({
+    idAttribute: 'name'
+});
+
 var Project = Model.extend({
     idAttribute: '_id',
     

--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/static/js/framework/views/workspaces.js	Fri Nov 08 18:25:36 2013 +0900
@@ -0,0 +1,24 @@
+var WorkspaceTabsView = CollectionView.extend({
+    initialize: function(options) {
+        this.compileTemplates(options.templates);
+        this.bindCollection();
+    },
+
+    clear: function() {
+        this.$el.empty();
+    },
+
+    renderItem: function(workspace) {
+        return $(this.templates.tab(workspace.toJSON()));
+    },
+
+    appendItem: function(workspace) {
+        var $item = this.renderItem(workspace);
+        this.$el.append($item);
+    },
+
+    activate: function(workspace) {
+        this.$el.find('[data-workspace]').removeClass('active');
+        this.$el.find('[data-workspace="' + workspace + '"]').addClass('active');
+    }
+});

--- a/static/js/ui.js	Fri Nov 08 14:43:16 2013 +0900
+++ b/static/js/ui.js	Fri Nov 08 18:25:36 2013 +0900
@@ -1,5 +1,6 @@
  $(function() {
     window.fruitbar = new Backbone.View();
+    fruitbar.workspaces = new Workspaces();
     fruitbar.tasks = new Tasks();
     fruitbar.projects = new Projects();
     fruitbar.router = new Router();
@@ -33,6 +34,14 @@
         el: $('.workspace-title')
     });
     
+    fruitbar.workspaceTabs = new WorkspaceTabsView({
+        el: $('.workspace-tabs'),
+        collection: fruitbar.workspaces,
+        templates: {
+            tab: $.trim($('#workspace-tab-template').html())
+        }
+    });
+    
     fruitbar.projectCounter = new CollectionCounterView({
         el: $('.project-counter'),
         collection: fruitbar.projects,
@@ -58,6 +67,7 @@
         this.xhrs.abort();
         
         this.workspace = workspace;
+        this.workspaces.create({name: workspace});
         this.tasks.url = '/' + encodeURIComponent(workspace) + '/tasks/';
         this.projects.url = '/' + encodeURIComponent(workspace) + '/projects/';
         
@@ -67,6 +77,7 @@
             fetch.then(function() {
                 if (xhrs.done()) {
                     fruitbar.workspaceTitleDisplayer.render(workspace);
+                    fruitbar.workspaceTabs.activate(workspace);
                     
                     $('body').stop().animate({opacity: 1});
                 }
@@ -79,6 +90,8 @@
             fruitbar.xhrs.push(fruitbar.fetchAll('/' + encodeURIComponent(fruitbar.workspace) + '/all/'));
         }, 60000);
     });
-    
+
+    fruitbar.workspaces.fetch();
+
     Backbone.history.start();
 });

--- a/templates/index.html	Fri Nov 08 14:43:16 2013 +0900
+++ b/templates/index.html	Fri Nov 08 18:25:36 2013 +0900
@@ -10,6 +10,7 @@
     <script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
     <script src="//cdnjs.cloudflare.com/ajax/libs/underscore.js/1.4.4/underscore-min.js"></script>
     <script src="//cdnjs.cloudflare.com/ajax/libs/backbone.js/1.0.0/backbone-min.js"></script>
+    <script src="//cdnjs.cloudflare.com/ajax/libs/backbone-localstorage.js/1.1.0/backbone.localStorage-min.js"></script>
     <script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.2.1/js/bootstrap.min.js"></script>
     {% assets filters='jsmin', output='bundles/fruitbar.%(version)s.js',
        'js/backbone.shard.js',
@@ -17,6 +18,7 @@
        'js/framework/collections.js',
        'js/framework/views/base.js',
        'js/framework/views/inline.js',
+       'js/framework/views/workspaces.js',
        'js/framework/views/projects.js',
        'js/framework/views/tasks.js',
        'js/framework/router.js',
@@ -34,10 +36,8 @@
   <body style="opacity: 0;">
     <div class="container">
       <div class="row">
-        <div class="span2">
-          <h3 class="align-right">
-            <button class="btn btn-mini btn-success btn-new-project">New project</button>
-          </h3>
+        <div class="span2 ui-sidebar align-right">
+          <button class="btn btn-mini btn-success btn-new-project">New project</button>
         </div>
         <div class="span8">
           <h3>
@@ -45,6 +45,15 @@
           </h3>
           <hr>
         </div>
+        <div class="span2 ui-sidebar">
+          <ul class="nav nav-tabs nav-stacked workspace-tabs">
+            <script id="workspace-tab-template" type="text/template">
+              <li data-workspace="<%- data.name %>">
+                <a href="#<%- data.name %>">#<%- data.name %></a>
+              </li>
+            </script>
+          </ul>
+        </div>
       </div>
       
       <section class="projects">