Pam 152 more try it updates (#578)

* Updates to reflect new Studio web UI

* Updated screenshots and wording to reflect Studio Web UI

* Project UI updates

* Project UI updates

* Edited project toolbar section

* Editor panel updates

* Fixed heading levels

* Moved UI topic to basics section

* Updates to download project topic

* Last edits to getting started

* Fixed broken links

* fixed another broken xref

* Sheesh. Another one.

* added markdown to disable link check for a valid link

README.md

@@ -2,7 +2,9 @@
 
 [![Buy us a tree](https://img.shields.io/badge/Buy%20us%20a%20tree-%F0%9F%8C%B3-lightgreen)](https://offset.earth/stoplightinc)
 
-To report a bug, please go to https://support.stoplight.io/hc/en-us/requests/new
+<!-- markdown-link-check-disable -->
+To report a bug, please go to https://support.stoplight.io/hc/en-us/requests/new.
+<!-- markdown-link-check-enable -->
 
 Studio is Stoplight's next generation application for API design, modeling, and technical writing. A primary goal of Studio is to enrich, not replace, your existing workflows. When running locally it works fully offline, with folders and files on your computer just like your favorite IDE. When running in the browser, the web-native Git support allows you to effortlessly work with your existing repositories safely and efficiently.
 

docs/01-getting-started.md

@@ -1,37 +1,52 @@
 # Getting Started
 
-## Creating Your First Project
+## Create Your First Project
 
-The quickest way to get up and running with Studio is to clone an existing Git repository. If you're running Studio Desktop then this could be choosing a location on your computer where a repository already exists, or you could copy the URL to any GitHub, Bitbucket, GitLab, Gitea, or other Git repository.
+The quickest way to get up and running with Studio is to clone an existing Git repository. If you're running Studio Desktop, you can choose a location on your computer where a repository already exists. In Studio Web or Desktop, you can copy the URL to any GitHub, Bitbucket, GitLab, Gitea, or other Git repository. 
 
-Give it a shot with our sample project: 
+Try it with our sample project:
 
-```
-https://github.com/stoplightio/studio-demo
-```
+1. In Studio Web, select the **Add Project** icon at the top of the left navigation pane. ![](../assets/images/add-project.png)
 
-Paste the URL above into the "Open Git Project" form when you open Studio, and click "Clone".
+2. Select **Add from GitHub**, add the studio-demo URL, and then select **Add Git Project**.
+   ```
+   https://github.com/stoplightio/studio-demo
 
-![Start from an existing Git repo](../assets/images/studio-open-git-project-pre-filled.png)
+   ```
+   ![](../assets/images/add-demo-project-web.png)
 
-Assuming everything went to plan, you should now see a page resembling the one below.
+   In Studio Desktop, paste the URL into the Open Git Project page, and then select **Clone**.
+   ![](../assets/images/studio-open-git-project-pre-filled.png)
 
-![Overview of the Studio landing page](../assets/images/studio-web-landing.png)
+3. Explore the demo documentation, APIs, and schemas. 
 
-> Note that the screenshot above is of Studio Web, so there may be some slight differences if you are using Studio Desktop.
+   ![Overview of the Studio landing page](../assets/images/studio-web-landing.png)
 
-You have just created your first project! Be sure to review the [UI Overview](./ui-overview.md) for quick highlights on the Studio user interface.
+> Note that the screenshot above is of Studio Web. There are slight differences in Studio Desktop.
 
-## Creating an API
+4. Select **Edit** to begin working with API designs, documentation, models, and more.
 
-To create a new API, use the menu immediately next to the project name and select "API".
 
-![How to create an API from the Studio UI](../assets/images/studio-web-create-api.png)
+## Create an API
 
-From there you can name your API, and then optionally set the specification version (OpenAPI v2 or v3) and storage format (JSON or YAML).
+To create a new API:
 
-![New API menu](../assets/images/studio-new-api.png)
+1. Select the **Add** icon, and then select **API**.
 
-After clicking "Create", a new API description document will be created and added to the project. From there you can then set the global information about the API and get started adding your first operation.
+<!-- 
+focus: false
+ -->
+![Create an API from Studio Web](../assets/images/studio-web-create-api.png)
 
-Continue on to the [API Design Guide](./Design-and-Modeling/01-getting-started.md) to get started designing APIs.
+2. From the New OpenAPI pages, name your API, and then select the OpenAPI version and storage format (YAML or JSON). You can also choose to import an existing YAML or JSON file.
+
+<!-- 
+focus: false
+ -->
+![New API page](../assets/images/studio-new-api.png)
+
+3. Click **Create**. A new API description document is added to your project. 
+
+4. Add global information about the API (summary, description, servers, and more). 
+
+5. Continue on to the [API Design Guide](./Design-and-Modeling/01-getting-started.md) to get started designing APIs.

docs/Basics/download-project.md

@@ -1,17 +1,17 @@
 # Downloading Projects
 
-If you ever need to save the contents of your project without pushing to a Git repository,
-you can download a zip file of the current project directly from the Studio settings menu.
+Download a zip file of the current project if you need to save the contents of your project without pushing to a Git repository. 
 
-> Note that this functionality is only available in the **web version** of Studio. If you need the project contents using Studio Desktop look to see where the directory exists in Project Settings.
+To download a project in Studio Web:
 
-![](../../assets/images/download-project-as-zip.gif)
+1. Open a project in Edit mode.
+2. From the Project Options hamburger menu, select **Download Project Zip**.
 
-To download a project:
+To download a project in Studio Desktop:
 
-1. Select the project you would like to download from the Studio landing screen
-2. Navigate to the settings menu using the cog wheel at the left bottom corner of the screen
-3. Select the **Project Settings** option from the menu
-4. Click the **Download Project** button, which will start the download
+1. Open a project.
+2. From the Project Options hamburger menu, select **Open project folder**.
+3. Select **Open** to navigate to the folder.
+4. Create a zip file of the foder contents. 
 
-The download process will handle resolving $ref's in OpenAPI or JSON Schema files, so users of the design library will still see references to the models in the design library. For that, the "Export API" option might be more appropriate.
+> The download process resolves $ref's in OpenAPI or JSON Schema files, so users of the design library will still see references to the models in the design library. For that, the [Export API](https://meta.stoplight.io/docs/platform/c.troubleshooting.md) option might be more appropriate.

docs/Basics/ui-overview.md

@@ -0,0 +1,74 @@
+# Project UI Overview
+
+Use projects to manage APIs, documentation, and related files. Projects work and look the same in Studio Web and Studio Desktop, with a few differences. This topic describes projects in Studio Web. 
+
+To open a project:
+
+1. From the **Home** page:
+   - Select the project from the project sidebar (left pane), or 
+   - Select **Projects** from the tab the top of the page, and then click the name link for a project. 
+
+2. Project owners, admins, and editors can select **Edit** to manage the project. Viewers can navigate and read project content. 
+
+Once you are editing a project, there are three key areas of the interface:
+
+1. Project sidebar
+2. Project toolbar
+3. Editor panel
+
+![Projects Overview](../../assets/images/ui-overview.png)
+
+## Project Sidebar
+
+Switch between three tabs to work with project content:
+
+- **APIs** lists APIs, endpoints, and models.
+- **Docs** lists Markdown and image files.
+- **Files** lists all project files.
+
+Select an item on any tab to open it in the Editor panel. 
+
+## Project Toolbar
+
+**Project Options**: Select the hamburger menu to work with these options:
+
+* **Back to Workspace**: Leaves edit mode and returns you to the workspace home.
+* **Preferences**: 
+  - Autosave
+  - Show empty directories
+  - Theme (dark, light, or the default set in Workspace settings)
+* **Git**:
+  - Auto-pull 
+  - Auto-translate SSH URLs)
+  <!-- https://github.com/stoplightio/platform-docs/issues/159 created to better document Git settings at a later time -->
+* **Reclone Project**
+* [**Download Project ZIP**](download-project.md)
+
+
+<!-- focus: center -->
+![Project options](../../assets/images/project-preferences.png)
+
+**Search**: Find anything in your project files. 
+
+**Add to Project**: Use to add new assets to your project. This includes APIs, endpoints, models, articles, style guides, images, table of contents, files and directories. You can also import files and import directories and add a [Stoplight Config file](03-stoplight-config.md) to your project. 
+
+**Project Actions** (Changes depending on your state):
+  - **Back to workspace**: Shows when no changes have been made to the project.
+  - **Publish**: When the project is not connected to a repository, shows when at least one change has been made in the project. Select the down arrow to discard changes. 
+  - **Commit and Publish**: When the project is connection to a repository, shows when at least one change has been made in the project. Select the down arrow to discard changes. 
+
+**Project Name**: Shows the name of the current project. If the project is connected to a repository, the name of the burrent branch is also shown. Select the down arrow to pull changes into your project or to switch branches. 
+
+## Editor Panel
+
+Use the main editor panel to design APIs and write documentation. Choose different views:
+ - **Form**: Offers an intiutive editor for APIs, endpoints, and models. 
+ - **Code**: Enables the code view for applicable files. 
+ - **Preview**: Provides a preview of what the selected file will look like when it is published. For API operations, the [Try It](../Design-and-Modeling/03-http-endpoints.md) feature is available in Preview mode. 
+
+ **Validation and Linting** displays issues related to your API Specification (powered by Spectral). Select to expand window and view error and warning details and locations.
+
+A **Secondary Panel** is available on larger screens (width > 1400px). Switch between view types via the view toggle in the top right of the panel.
+
+![Validation and Linting Toggle](../../assets/images/spectral-view.png)
+

docs/Design-and-Modeling/03-http-endpoints.md

@@ -30,7 +30,7 @@ focus: false
 ![JSON Schema Editor](../../assets/images/crud-builder.png)
 
 We created the JSON Schema editor to make data structure creation as simple as
-possible. You can find the JSON Schema editor within any model or endpoint while [**Form View**](../ui-overview.md) is selected.
+possible. You can find the JSON Schema editor within any model or endpoint while [**Form View**](../Basics/ui-overview.md) is selected.
 
 To start utilizing the editor:
 
@@ -89,7 +89,7 @@ While not for the faint hearted, you can also edit the raw JSON Schema directly
 if you are familiar with the format, or have a pre-existing JSON Schema
 representation of your data structure.
 
-To edit the raw JSON Schema, [switch to the **Code** tab](../ui-overview.md) next to the **Form**
+To edit the raw JSON Schema, [switch to the **Code** tab](../Basics/ui-overview.md) next to the **Form**
 tab. This will switch you over to the Write view which will allow you to make edits directly in the raw schema.
 
 ## Try it Out

docs/Documentation/01-getting-started.md

@@ -18,7 +18,7 @@ Once you have created a New Personal Project, the first thing you will see is th
 
 ![Welcome Screen](../../assets/images/panel-general.png)
 
-The file tree to the left is where all of Stoplight’s Design files (API Specification: endpoints, models, paths, etc.) are stored and the main panel contains the [Table of Contents, API Design GUI, Read View, and Write View](../ui-overview.md). For more on API design, check out the [API Design Quick Start Guide](../Design-and-Modeling/01-getting-started.md).
+The file tree to the left is where all of Stoplight’s Design files (API Specification: endpoints, models, paths, etc.) are stored and the main panel contains the [Table of Contents, API Design GUI, Read View, and Write View](../Basics/ui-overview.md). For more on API design, check out the [API Design Quick Start Guide](../Design-and-Modeling/01-getting-started.md).
 
 ## 2. Directory Structure
 
@@ -40,7 +40,7 @@ Open the Markdown folder and select **Markdown Basics**. The main panel will swi
 
 ![Toggle View Modes](../../assets/images/main-panel-view-toggle.png)
 
-> For more on panel customization, check out [Panels](../ui-overview.md)
+> For more on panel customization, check out [Panels](../Basics/ui-overview.md)
 
 ## 5. Docs Preview (Web App Only)