diff --git a/app/core/Router.coffee b/app/core/Router.coffee
index 5dee4e159..21a002e79 100644
--- a/app/core/Router.coffee
+++ b/app/core/Router.coffee
@@ -44,6 +44,10 @@ module.exports = class CocoRouter extends Backbone.Router
'beta': go('HomeView')
'cla': go('CLAView')
+
+ 'clans': go('clans/ClansView')
+ 'clans/:clanID': go('clans/ClanDetailsView')
+
'community': go('CommunityView')
'contribute': go('contribute/MainContributeView')
diff --git a/app/styles/clans/clan-details.sass b/app/styles/clans/clan-details.sass
new file mode 100644
index 000000000..175754b11
--- /dev/null
+++ b/app/styles/clans/clan-details.sass
@@ -0,0 +1 @@
+// #clan-details-view
diff --git a/app/styles/clans/clans.sass b/app/styles/clans/clans.sass
new file mode 100644
index 000000000..83e2cf2fb
--- /dev/null
+++ b/app/styles/clans/clans.sass
@@ -0,0 +1,5 @@
+#clans-view
+ color: black
+
+ .clan-title
+ cursor: pointer
diff --git a/app/templates/clans/clan-details.jade b/app/templates/clans/clan-details.jade
new file mode 100644
index 000000000..2ab26af33
--- /dev/null
+++ b/app/templates/clans/clan-details.jade
@@ -0,0 +1,42 @@
+extends /templates/base
+
+block content
+
+ ol.breadcrumb
+ li
+ a(href="/")
+ span.glyphicon.glyphicon-home
+ li
+ a(href="/clans") Clans
+
+ li.active= clan.title
+
+ h1= clan.title
+ div
+ span Owner:
+ a(href="/user/#{clan.ownerID}")= clan.owner
+ div Members: #{clan.memberCount}
+ if clan.owner === 'mrsmith'
+ div
+ button.btn.btn-sm.btn-warning Delete Clan
+
+ h3 Clan Members
+ table.table.table-striped.table-condensed
+ thead
+ tr
+ th Name
+ th Level
+ th
+ tbody
+ each member in members
+ tr
+ td
+ a(href="/user/#{member.id}")= member.name
+ td= member.level
+ if member.name !== clan.owner && clan.owner === 'mrsmith'
+ td
+ button.btn.btn-sm.btn-warning Remove Member
+ else
+ td
+
+ button.btn.btn-sm Load More
diff --git a/app/templates/clans/clans.jade b/app/templates/clans/clans.jade
new file mode 100644
index 000000000..1f73d23df
--- /dev/null
+++ b/app/templates/clans/clans.jade
@@ -0,0 +1,74 @@
+extends /templates/base
+
+block content
+
+ ol.breadcrumb
+ li
+ a(href="/")
+ span.glyphicon.glyphicon-home
+ li.active Clans
+
+ div
+ button.btn.btn-sm.btn-success Create New Clan
+ span.spr.spl
+ input(type='text' placeholder='New clan name')
+ br
+
+ div(role='tabpanel')
+ ul.nav.nav-tabs(role='tablist')
+ li.active(role='presentation')
+ a(href='#public-clans' aria-controls='public-clans', role='tab', data-toggle='tab') Public Clans
+ li(role='presentation')
+ a(href='#my-clans' aria-controls='my-clans', role='tab', data-toggle='tab') My Clans
+
+ .tab-content
+ .tab-pane.active#public-clans(role='tabpanel')
+ table.table.table-striped.table-condensed
+ thead
+ tr
+ th Clan Name
+ th Members
+ th Owner
+ th
+ tbody
+ each clan in publicClans
+ tr
+ td
+ if clan.owner === 'mrsmith'
+ a(href="/clans/#{clan.id}", style='font-weight:bold')= clan.title
+ else
+ a(href="/clans/#{clan.id}")= clan.title
+ td= clan.memberCount
+ td
+ a(href="/user/#{clan.ownerID}")= clan.owner
+ td
+ if !clan.member
+ button.btn.btn-sm.btn-success Join Clan
+ else if clan.owner !== 'mrsmith'
+ button.btn.btn-sm.btn-warning Leave Clan
+ button.btn.btn-sm Load More
+
+ .tab-pane#my-clans(role='tabpanel')
+ table.table.table-striped.table-condensed
+ thead
+ tr
+ th Clan Name
+ th Members
+ th Owner
+ th
+ tbody
+ each clan in myClans
+ tr
+ td
+ if clan.owner === 'mrsmith'
+ a(href="/clans/#{clan.id}", style='font-weight:bold')= clan.title
+ else
+ a(href="/clans/#{clan.id}")= clan.title
+ td= clan.memberCount
+ td
+ a(href="/user/#{clan.ownerID}")= clan.owner
+ td
+ if clan.owner !== 'mrsmith'
+ button.btn.btn-sm.btn-warning Leave Clan
+
+ button.btn.btn-sm Load More
diff --git a/app/views/clans/ClanDetailsView.coffee b/app/views/clans/ClanDetailsView.coffee
new file mode 100644
index 000000000..65337c341
--- /dev/null
+++ b/app/views/clans/ClanDetailsView.coffee
@@ -0,0 +1,30 @@
+RootView = require 'views/core/RootView'
+template = require 'templates/clans/clan-details'
+
+module.exports = class ClanDetailsView extends RootView
+ id: 'clan-details-view'
+ template: template
+
+ constructor: (options, @clanID) ->
+ super options
+ @initMockData()
+
+ getRenderData: =>
+ context = super()
+ context.clan = @clan
+ context.members = @members
+ context
+
+ initMockData: ->
+ @clan =
+ title: 'Slay more munchkins'
+ owner: 'mrsmith'
+ memberCount: 8
+ ownerID: me.get('_id')
+
+ @members = [
+ {id: me.get('_id'), name: 'mrsmith', level: 24}
+ {id: me.get('_id'), name: 'Superman', level: 2}
+ {id: me.get('_id'), name: 'batman', level: 1}
+ {id: me.get('_id'), name: 'Bruce', level: 4}
+ ]
diff --git a/app/views/clans/ClansView.coffee b/app/views/clans/ClansView.coffee
new file mode 100644
index 000000000..d587a370d
--- /dev/null
+++ b/app/views/clans/ClansView.coffee
@@ -0,0 +1,41 @@
+app = require 'core/application'
+RootView = require 'views/core/RootView'
+template = require 'templates/clans/clans'
+
+module.exports = class MainAdminView extends RootView
+ id: 'clans-view'
+ template: template
+
+ events:
+ 'click .clan-title': 'onClickClanTitle'
+
+ constructor: (options) ->
+ super options
+ @initMockData()
+
+ getRenderData: ->
+ context = super()
+ context.myClans = @myClans
+ context.publicClans = @publicClans
+ context
+
+ onClickClanTitle: (e) ->
+ if clanID = $(e.target).data('id')
+ app.router.navigate "/clans/#{clanID}"
+ else
+ console.error "No clan ID found for public clan row."
+
+ initMockData: ->
+ @myClans = [
+ {id: 1, title: 'FC Dallas', owner: 'soccerfan', memberCount: 4, member: true, ownerID: me.get('_id')}
+ {id: 2, title: 'Mr. Smith 4th period', owner: 'mrsmith', memberCount: 23, member: true, ownerID: me.get('_id')}
+ {id: 3, title: 'Test Title 21', owner: 'matt', memberCount: 12, member: true, ownerID: me.get('_id')}
+ {id: 4, title: 'Slay more munchkins', owner: 'mrsmith', memberCount: 8, member: true, ownerID: me.get('_id')}
+ ]
+
+ @publicClans = [
+ {id: 1, title: 'FC Dallas', owner: 'soccerfan', memberCount: 4, member: true, ownerID: me.get('_id')}
+ {id: 2, title: 'Mr. Smith 4th period', owner: 'mrsmith', memberCount: 23, member: true, ownerID: me.get('_id')}
+ {id: 5, title: 'tourney tanks', owner: 'jkl324', memberCount: 7, member: false, ownerID: me.get('_id')}
+ {id: 6, title: 'Pythonistas', owner: 'bob219', memberCount: 50, member: false, ownerID: me.get('_id')}
+ ]