diff --git a/static/directives/teams-manager.html b/static/directives/teams-manager.html
index 338e9fb72..99c248868 100644
--- a/static/directives/teams-manager.html
+++ b/static/directives/teams-manager.html
@@ -12,19 +12,23 @@
     <div class="tab-header-controls hidden-xs">
       <div class="btn-group btn-group-sm" ng-show="organization.is_admin">
         <button class="btn"
-                ng-class="!showingMembers ? 'btn-primary active' : 'btn-default'" ng-click="showMembers(false)">
+                ng-class="activeView == views.TEAMS ? 'btn-primary active' : 'btn-default'" ng-click="setActiveView(views.TEAMS)">
           <i class="fa fa-group"></i>Teams View
         </button>
         <button class="btn"
-                ng-class="showingMembers ? 'btn-info active' : 'btn-default'" ng-click="showMembers(true)">
+                ng-class="activeView == views.MEMBERS ? 'btn-info active' : 'btn-default'" ng-click="setActiveView(views.MEMBERS)">
           <i class="fa fa-user"></i>Members View
         </button>
+        <button class="btn"
+                ng-class="activeView == views.COLLABORATORS ? 'btn-info active' : 'btn-default'" ng-click="setActiveView(views.COLLABORATORS)">
+          <i class="fa fa-user-circle"></i>Collaborators View
+        </button>
       </div>
     </div>
   </div>
 
   <!-- Teams List -->
-  <div ng-show="!showingMembers">
+  <div ng-show="activeView == views.TEAMS">
     <button class="btn btn-primary hidden-xs"
             ng-show="organization.is_admin"
             style="margin-bottom: 10px; "
@@ -127,35 +131,35 @@
     </div>
   </div>
 
-  <!-- Members List -->
-  <div ng-show="showingMembers">
-    <div class="cor-loader" ng-if="!fullMemberList"></div>
+  <!-- Members or Collaborators List -->
+  <div ng-show="activeView == views.MEMBERS || activeView == views.COLLABORATORS">
+    <div class="cor-loader" ng-if="!usersView"></div>
 
-    <div class="filter-box" collection="fullMemberList" filter-model="memberFilter"
-         filter-name="Organization Members"></div>
+    <div class="filter-box" collection="usersView" filter-model="userFilter"
+         filter-name="Users"></div>
 
-    <div class="empty" ng-if="fullMemberList.length && !(fullMemberList | filter:memberFilter).length">
-      <div class="empty-primary-msg">No organization members found matching filter.</div>
+    <div class="empty" ng-if="usersView.length && !(usersView | filter:userFilter).length">
+      <div class="empty-primary-msg">No users found matching filter.</div>
       <div class="empty-secondary-msg">
-        Please change your filter to display members.
+        Please change your filter to display users.
       </div>
     </div>
 
-    <table class="cor-table" ng-if="(fullMemberList | filter:memberFilter).length">
+    <table class="cor-table">
       <thead>
-        <td>Member Name</td>
-        <td>Teams</td>
+        <td>User Name</td>
+        <td ng-if="activeView == views.MEMBERS">Teams</td>
         <td>Direct Repository Permissions</td>
         <td class="options-col"></td>
       </thead>
 
-      <tbody ng-repeat="memberInfo in fullMemberList | filter:memberFilter | orderBy:'name'" bindonce>
+      <tbody ng-repeat="orgUser in usersView | filter:userFilter | orderBy:'name'" bindonce>
         <tr>
           <td>
-            <div class="entity-reference" entity="memberInfo"></div>
+            <div class="entity-reference" entity="orgUser"></div>
           </td>
-          <td>
-             <span ng-repeat="team in memberInfo.teams"
+          <td ng-if="activeView == views.MEMBERS">
+             <span ng-repeat="team in orgUser.teams"
                    data-title="Team {{ team.name }}" bs-tooltip>
                <span class="anchor" href="/organization/{{ organization.name }}/teams/{{ team.name }}">
                  <span class="avatar" size="24" data="team.avatar"></span>
@@ -163,20 +167,20 @@
              </span>
           </td>
           <td>
-            <span class="empty" bo-if="memberInfo.repositories.length == 0">
+            <span class="empty" bo-if="orgUser.repositories.length == 0">
               (No direct permissions on any repositories)
             </span>
 
-            <span class="member-perm-summary" bo-if="memberInfo.repositories.length > 0">
-              Direct permissions on {{ memberInfo.repositories.length }}
-              <span bo-if="memberInfo.repositories.length == 1">repository</span>
-              <span bo-if="memberInfo.repositories.length > 1">repositories</span>
+            <span class="member-perm-summary" bo-if="orgUser.repositories.length > 0">
+              Direct permissions on {{ orgUser.repositories.length }}
+              <span bo-if="orgUser.repositories.length == 1">repository</span>
+              <span bo-if="orgUser.repositories.length > 1">repositories</span>
               under this organization
             </span>
           </td>
           <td class="options-col">
-            <span class="cor-options-menu" ng-if="memberInfo.name != user.username">
-              <span class="cor-option" option-click="askRemoveMember(memberInfo)">
+            <span class="cor-options-menu" ng-if="orgUser.name != user.username">
+              <span class="cor-option" option-click="askRemoveMember(orgUser)">
                 <i class="fa fa-times"></i> Remove From Organization
               </span>
             </span>
@@ -197,8 +201,8 @@
   <div class="cor-confirm-dialog"
      dialog-context="removeMemberInfo"
      dialog-action="removeMember(info, callback)"
-     dialog-title="Remove Organization Member"
-     dialog-action-title="Remove Member">
+     dialog-title="Remove User from Organization"
+     dialog-action-title="Remove">
      <div class="co-alert co-alert-info" style="margin-bottom: 10px;">
        <span class="entity-reference" entity="removeMemberInfo"></span> will be removed from all teams and repositories under this organization in which they are a
        member or have permissions.
diff --git a/static/js/directives/ui/teams-manager.js b/static/js/directives/ui/teams-manager.js
index 63ef68540..1254675b6 100644
--- a/static/js/directives/ui/teams-manager.js
+++ b/static/js/directives/ui/teams-manager.js
@@ -17,6 +17,12 @@ angular.module('quay').directive('teamsManager', function () {
       $scope.Config = Config;
       $scope.Features = Features;
 
+      $scope.views = Object.freeze({
+        TEAMS: 0,
+        MEMBERS: 1,
+        COLLABORATORS: 2
+      });
+
       $scope.options = {
         'predicate': 'ordered_team_index',
         'reverse': false,
@@ -35,8 +41,11 @@ angular.module('quay').directive('teamsManager', function () {
       $scope.orderedTeams = null;
       $scope.showingMembers = false;
       $scope.fullMemberList = null;
+      $scope.collaboratorList = null;
+      $scope.userView = null;
       $scope.feedback = null;
       $scope.createTeamInfo = null;
+      $scope.activeView = $scope.views.TEAMS;
 
       var getRoleIndex = function(name) {
         for (var i = 0; i < $scope.teamRoles.length; ++i) {
@@ -67,6 +76,62 @@ angular.module('quay').directive('teamsManager', function () {
             ['ordered_team_index', 'member_count', 'repo_count', 'role_index']);
       };
 
+      var loadMembers = function(callback) {
+        var params = {
+          'orgname': $scope.organization.name
+        };
+
+        ApiService.getOrganizationMembers(null, params).then(function(resp) {
+          $scope.fullMemberList = resp['members'];
+          callback();
+        }, ApiService.errorDisplay('Could not load full membership list'));
+      };
+
+      var loadCollaborators = function(callback) {
+        var params = {
+          'orgname': $scope.organization.name
+        };
+
+        ApiService.getOrganizationCollaborators(null, params).then(function(resp) {
+          $scope.collaboratorList = resp['collaborators'];
+          callback();
+        }, ApiService.errorDisplay('Could not load collaborators list'));
+      };
+
+      $scope.setActiveView = function(view) {
+        switch(view) {
+        case $scope.views.TEAMS:
+          // Nothing to do here.
+          break;
+
+        case $scope.views.MEMBERS:
+          if (!$scope.fullMemberList) {
+            loadMembers(function() {
+              $scope.usersView = $scope.fullMemberList;
+            });
+          }
+
+          $scope.usersView = $scope.fullMemberList;
+          break;
+
+        case $scope.views.COLLABORATORS:
+          if (!$scope.collaboratorList) {
+            loadCollaborators(function() {
+              $scope.usersView = $scope.collaboratorList;
+            });
+          }
+
+          $scope.usersView = $scope.collaboratorList;
+          break;
+
+        default:
+          console.error('Invalid team-manager view: ' + view);
+          return;
+        }
+
+        $scope.activeView = view;
+      }
+
       $scope.setRole = function(role, teamname) {
         var previousRole = $scope.organization.teams[teamname].role;
         $scope.organization.teams[teamname].role = role;
@@ -158,19 +223,6 @@ angular.module('quay').directive('teamsManager', function () {
         $location.path('/organization/' + $scope.organization.name + '/teams/' + teamName);
       };
 
-      $scope.showMembers = function(value) {
-        $scope.showingMembers = value;
-        if (value && !$scope.fullMemberList) {
-          var params = {
-            'orgname': $scope.organization.name
-          };
-
-          ApiService.getOrganizationMembers(null, params).then(function(resp) {
-            $scope.fullMemberList = resp['members'];
-          }, ApiService.errorDisplay('Could not load full membership list'));
-        }
-      };
-
       $scope.removeMember = function(memberInfo, callback) {
         var params = {
           'orgname': $scope.organization.name,
@@ -184,7 +236,8 @@ angular.module('quay').directive('teamsManager', function () {
         ApiService.removeOrganizationMember(null, params).then(function(resp) {
           // Reset the state of the directive.
           $scope.fullMemberList = null;
-          $scope.showMembers(true);
+          $scope.collaboratorList = null;
+          $scope.setActiveView($scope.activeView);
 
           callback(true);
 
@@ -226,4 +279,4 @@ angular.module('quay').directive('teamsManager', function () {
   };
 
   return directiveDefinitionObject;
-});
\ No newline at end of file
+});