Fill in the tour for organizations. Add the CTA to the bottom of the orgs page. Generate screenshots for the org.

screenshots/screenshots.js

@@ -94,14 +94,14 @@ casper.then(function() {
   this.capture(outputDir + 'repo-admin.png');
 });
 
-casper.thenOpen(rootUrl + 'organizations/new/', function() {
-  this.waitForText('Create');
+casper.thenOpen(rootUrl + 'repository/?namespace=' + org, function() {
+  this.waitForText('Repositories');
 });
 
 disableOlark();
 
 casper.then(function() {
-  this.capture(outputDir + 'org-create.png');
+  this.capture(outputDir + 'org-repo-list.png');
 });
 
 casper.thenOpen(rootUrl + 'organization/' + org, function() {

static/css/quay.css

@@ -954,6 +954,11 @@ p.editable:hover i {
   float: right;
 }
 
+.button-bar-bottom {
+  margin-bottom: 60px;
+}
+
+
 .repo-list .section-header {
   padding: 10px;
   border-bottom: 1px solid #eee;
@@ -1949,4 +1954,8 @@ p.editable:hover i {
   top: -9px;
   font-weight: bold;
   font-size: .4em;
+}
+
+.page-description {
+  margin-bottom: 40px;
 }

static/partials/organizations.html

@@ -35,37 +35,95 @@
       <div class="col-md-12">
         <div class="tour-section-title">Organizations</div>
         <div class="tour-section-description">
-          Organizations in Quay provide unique features for businesses and other groups, such as team-based sharing and fine-grain permission controls.
+          Organizations in Quay provide unique features for businesses and other
+          groups, including team-based sharing and fine-grained permission controls.
         </div>
       </div>
     </div>
 
     
     <div class="tour-section row">
-      <div class="col-md-7">
-        <img src="/static/img/user-home.png" title="Organization Overview"
-             data-screenshot-url="https://quay.io/organization/myorg/" class="img-responsive">
-      </div>
+      <div class="col-md-7"><img src="/static/img/org-repo-list.png" title="Repositories - Quay" data-screenshot-url="https://quay.io/repository/" class="img-responsive"></div>
       <div class="col-md-5">
-        <div class="tour-section-title">Working in teams</div>
+        <div class="tour-section-title">A central collection of repositories</div>
         <div class="tour-section-description">
-          Organizations are designed for business blah blah blah
+          Your organization is the focal point for all activity that occurs within
+          your public or private repositories. Your repositories are centrally visible
+          and managed within the namespace of your organization. You may share
+          your repositories with as many users and teams as you like, without
+          any additional cost.
         </div>
       </div>
     </div>
 
     <div class="tour-section row">
-      <div class="col-md-7">
-        <img src="/static/img/user-home.png" title=""
-             data-screenshot-url="https://quay.io/organization/myorg/" class="img-responsive">
-      </div>
-      <div class="col-md-5">
-        <div class="tour-section-title">Global and Local Permissions</div>
+      <div class="col-md-7 col-md-push-5"><img src="/static/img/org-admin.png" title="buynlarge Admin - Quay" data-screenshot-url="https://quay.io/organization/buynlarge/admin" class="img-responsive"></div>
+      <div class="col-md-5 col-md-pull-7">
+        <div class="tour-section-title">Organization settings at a glance</div>
         <div class="tour-section-description">
-          Organizations are designed for business blah blah blah
+          Your organization allows you to view your private repository count
+          and manage billing settings in a centralized place.
+        </div>
+        <div class="tour-section-description">
+          You can also see all of the users who have access to your organization
+          and the teams of which they are members. This allows you to audit the
+          access that has been granted in your organization.
         </div>
       </div>
     </div>
 
+    <div class="tour-section row">
+      <div class="col-md-7"><img src="/static/img/org-teams.png" title="buynlarge - Quay" data-screenshot-url="https://quay.io/organization/buynlarge" class="img-responsive"></div>
+      <div class="col-md-5">
+        <div class="tour-section-title">Teams simplify access controls</div>
+        <div class="tour-section-description">
+          Teams allow your organization to delegate access to your namespace and
+          repositories in a controlled fashion. Each team has permissions that
+          apply across the entire org, and can also be given specific levels of
+          access to specific repositories. A user is switching roles? No problem,
+          change their team membership and their access will be adjusted accordingly.
+        </div>
+        <div class="tour-section-description">
+          Owners of your organization, and members of other teams with
+          administrator privileges, have full permissions to all repositories
+          in the organization, as well as permissions to view and adjust the
+          account settings for the organization. Add users to these teams with
+          caution.
+        </div>
+      </div>
+    </div>
+
+    <div class="tour-section row">
+      <div class="col-md-7 col-md-push-5"><img src="/static/img/org-repo-admin.png" title="buynlarge/orgrepo - Quay" data-screenshot-url="https://quay.io/repository/buynlarge/orgrepo" class="img-responsive"></div>
+      <div class="col-md-5 col-md-pull-7">
+        <div class="tour-section-title">Fine-grained control of sharing</div>
+        <div class="tour-section-description">
+          Repositories that you create within your organization can be assigned
+          fine-grained permissions just like any other repository. You can also
+          add teams that exist in your organization, or individual users from
+          inside our outside your organization.
+        </div>
+        <div class="tour-section-description">
+          In order to protect your intellectual property, we warn you before
+          you share your repositories with anyone who is not currently a member
+          of a team in your organization.
+        </div>
+      </div>
+    </div>
+
+    <div class="button-bar-right button-bar-bottom">
+      <a href="/organizations/new/" title="Starts the process to create a new organization" bs-tooltip="tooltip.title">
+        <button class="btn btn-success">
+          <i class="fa fa-plus"></i>
+          Create New Organization
+        </button>
+      </a>
+      <a href="/user/?migrate" ng-show="!user.anonymous" title="Starts the process to convert this account into an organization" bs-tooltip="tooltip.title">
+        <button class="btn btn-primary">
+          <i class="fa fa-caret-square-o-right"></i>
+          Convert account
+        </button>
+      </a>
+    </div>
   </div>
 </div>