diff --git a/source/Blerg.css b/source/Blerg.css
line changes: +38/-1
index b2f3e28..159bc39
--- a/source/Blerg.css
+++ b/source/Blerg.css

@@ -2,11 +2,48 @@ body {
 }
 
 .navigator-breadcrumbs {
-	padding: 4pt;
 	font-size: 14pt;
+	border-bottom: 1px solid #303060;
+}
+
+.vertical-button {
+	display: block;
+	width: 100%;
+	padding: 8pt;
+	margin: 8pt 0;
+}
+
+.crumb-button {
+	vertical-align: middle;
+	background: none;
+	border: none;
+	padding: 12pt;
+	display: inline-block;
+	font-weight: bold;
+}
+
+.crumb-button:active {
+	background: #c9e4ff;
 }
 
 .navigator-carousel > * {
 	min-width: 50%;
+	border-right: solid 1px #303060;
+}
+
+.listing-content {
 	padding: 8pt;
 }
+
+.listing > h2 {
+	margin: 4pt 4pt 8pt 4pt;
+	font-size: 14pt;
+}
+
+.record {
+	margin-bottom: 8pt;
+}
+
+.record > p {
+	margin-top: 0;
+}

diff --git a/source/Blerg.js b/source/Blerg.js
line changes: +2/-4
index f314d23..6620d0b
--- a/source/Blerg.js
+++ b/source/Blerg.js

@@ -2,14 +2,12 @@ enyo.kind({
     name: "Blerg",
     kind: "FittableRows",
     components: [
-        {kind: "onyx.Toolbar", components: [
-            {content: "Blerg Mobile"}
-        ]},
         {name: "navigator", kind: "Navigator", fit: true}
     ],
     create: function() {
         this.inherited(arguments);
-        this.$.navigator.waterfall('onContentLoad', {
+        this.$.navigator.waterfall('onNavigate', {
+            kind: "Welcome"
         });
     }
 });

diff --git a/source/Listing.js b/source/Listing.js
line changes: +3/-22
index 6ac679b..770685c
--- a/source/Listing.js
+++ b/source/Listing.js

@@ -2,27 +2,8 @@ enyo.kind({
     name: "Listing",
     kind: "FittableRows",
     published: {
-        title: "Listing"
+        title: "Abstract Listing"
     },
-    components: [
-        {name: "title", content: "Listing", tag: "h2"},
-        {name: "list", kind: "List", onSetupItem: "setupItem", count:10, fit: true, components: [
-            {name: "record", kind: "blerg.Record", ontap: "itemTap"}
-        ]}
-    ],
-    create: function() {
-        this.inherited(arguments);
-        this.titleChanged();
-    },
-    setupItem: function(inSender, inEvent) {
-        this.$.record.setAuthor("Blerger");
-        this.$.record.setTimestamp(new Date().getTime() / 1000);
-        this.$.record.setData("Blerg " + inEvent.index);
-    },
-    itemTap: function(inSender, inEvent) {
-        this.bubble('onContentLoad', {author: this.$.record.getAuthor});
-    },
-    titleChanged: function() {
-        this.$.title.setContent(this.title);
-    }
+    classes: "listing",
+    // Abstract base for other Navigator client widgets
 });

diff --git a/source/Navigator.js b/source/Navigator.js
line changes: +25/-14
index 64c33c9..6f43b1a
--- a/source/Navigator.js
+++ b/source/Navigator.js

@@ -1,30 +1,40 @@
 enyo.kind({
+    name: "CrumbButton",
+    kind: "Control",
+    classes: "crumb-button",
+    published: {
+        page: null
+    },
+    handlers: {
+        ontap: "tapHandler",
+    },
+    tapHandler: function(inSender, inEvent) {
+        this.bubble('onSelectPage', {page: this.page});
+    }
+});
+
+enyo.kind({
     name: "Navigator",
     kind: "FittableRows",
     handlers: {
-        onContentLoad: "contentLoad"
+        onNavigate: "navigate",
+        onSelectPage: "selectPage"
     },
     count: 0,
     components: [
         {name: "breadcrumbs", classes: "navigator-breadcrumbs"},
         {name: "carousel", kind: "Panels", arrangerKind: "CarouselArranger", classes: "navigator-carousel", fit: true}
     ],
-    contentLoad: function(inSender, inEvent) {
-        if (this.count > 0 && inEvent.originator.kind == "Listing") {
-            for (var i = 0; i < this.$.carousel.children.length; i++) {
-                if (this.$.carousel.children[i] == inEvent.originator)
-                    break;
-            }
+    navigate: function(inSender, inEvent) {
+        if (this.count > 0 && inEvent.originator instanceof Listing) {
+            var i = this.$.carousel.children.indexOf(inEvent.originator);
             while (this.$.carousel.children.length - 1 > i) {
                 this.$.carousel.children[i + 1].destroy();
                 this.count--;
             }
         }
 
-        var newpage = this.$.carousel.createComponent({
-            kind: "Listing",
-            title: "Listing " + this.count
-        });
+        var newpage = this.$.carousel.createComponent(inEvent)
         this.render();
         this.count++;
         this.$.carousel.setIndex(this.count - 1);

@@ -37,8 +47,9 @@ enyo.kind({
         var crumbs = [];
         for (var i = 0; i < this.$.carousel.children.length; i++) {
             this.$.breadcrumbs.createComponent({
-                kind: "onyx.Button",
-                content: this.$.carousel.children[i].title
+                kind: "CrumbButton",
+                content: this.$.carousel.children[i].title,
+                page: i
             });
             if (i < this.$.carousel.children.length - 1)
                 this.$.breadcrumbs.createComponent({tag: null, content: " >> "});

@@ -46,6 +57,6 @@ enyo.kind({
         this.$.breadcrumbs.render();
     },
     selectPage: function(inSender, inEvent) {
-        this.$.carousel.setIndex(inSender.relatedPage);
+        this.$.carousel.setIndex(inEvent.page);
     }
 });

diff --git a/source/UserListing.js b/source/UserListing.js
line changes: +29/-0
index 0000000..7dfb7a5
--- /dev/null
+++ b/source/UserListing.js

@@ -0,0 +1,29 @@
+enyo.kind({
+    name: "UserListing",
+    kind: "Listing",
+    published: {
+        user: null
+    },
+    components: [
+        {name: "title", content: "Listing", tag: "h2"},
+        {name: "list", kind: "List", classes: "listing-content", onSetupItem: "setupItem", count:10, fit: true, components: [
+            {name: "record", kind: "blerg.Record", ontap: "itemTap"}
+        ]}
+    ],
+    create: function() {
+        this.inherited(arguments);
+        this.userChanged();
+    },
+    userChanged: function() {
+        this.title = "@" + this.user
+        this.$.title.setContent(this.title);
+    },
+    setupItem: function(inSender, inEvent) {
+        this.$.record.setAuthor("Blerger");
+        this.$.record.setTimestamp(new Date().getTime() / 1000);
+        this.$.record.setData("Blerg " + inEvent.index);
+    },
+    itemTap: function(inSender, inEvent) {
+        this.bubble('onNavigate', {kind: "UserListing", user: inEvent.originator.getAuthor()});
+    }
+});

diff --git a/source/Welcome.js b/source/Welcome.js
line changes: +16/-0
index 0000000..5f11018
--- /dev/null
+++ b/source/Welcome.js

@@ -0,0 +1,16 @@
+enyo.kind({
+    name: "Welcome",
+    kind: "Listing",
+    title: "Blërg",
+    components: [
+        {kind: "Scroller", classes: "listing-content", components: [
+            {content: "Welcome to Blërg!"},
+            {kind: "onyx.Button", classes: "onyx-affirmative vertical-button", content: "Create an account"},
+            {kind: "onyx.Button", classes: "vertical-button", content: "Log In"},
+            {kind: "onyx.Button", classes: "vertical-button", content: "Listing", ontap: "showListing"},
+        ]}
+    ],
+    showListing: function() {
+        this.bubble('onNavigate', {kind: "UserListing", user: "user" + Math.floor(Math.random() * 1000)});
+    }
+});

diff --git a/source/package.js b/source/package.js
line changes: +3/-1
index 6ae56d3..e03ac77
--- a/source/package.js
+++ b/source/package.js

@@ -6,5 +6,7 @@ enyo.depends(
     'Blerg.js',
     'Record.js',
     'Navigator.js',
-    'Listing.js'
+    'Listing.js',
+    'Welcome.js',
+    'UserListing.js'
 );