copyedit and update screenshots

src/docs/product/sentry-basics/integrate-frontend/create-new-project.mdx

@@ -9,7 +9,7 @@ description: "Learn how to create a Sentry project and how it allows you to scop
 
 This section walks you through how to create a new project in your Sentry account and set up alerts for that project.
 
-## Step 1: Create a Project
+## 1. Create a Project
 
 _Projects_ allow you to scope events to a distinct application in your organization and assign responsibility and ownership to specific users and teams within your organization. You can create a project for a particular language or framework used in your application. For example, you might have separate projects for your API server and frontend client. For more information see [best practices for creating projects](/product/accounts/getting-started/#4-create-projects)
 
@@ -19,33 +19,40 @@ _Projects_ allow you to scope events to a distinct application in your organizat
 
 1. Click "Create Project".
 
-   ![Create new project](create-new-project-01.png)
+   <!--- ![Create new project](create-new-project-01.png) --->
 
    If there are no projects in your account, you might be redirected to the onboarding wizard to create your first project.
 
    - Select the language or framework for your project based on the code you wish to monitor — in this case, "React".
 
-   - Under "Set your default alert settings", select "I'll create my own alerts later".
+   - Under "Set your alert frequency", select "Alert me on every new issue".
 
-   - Give the project a name in the "Project name" field.
+   - Name your project in the "Project name" field.
 
    - Assign a team to the project by selecting one in the "Team" dropdown.
 
-     ![Select project language](create-new-project-02.png)
+    <!--- ![Select project language](create-new-project-02.png) --->
 
      > If you haven't defined any teams, you can either select the default org team (the team that has the same name as your Sentry org) or click on the "+" button to create a new team.
 
-     ![Select team](create-new-project-03.png)
+    <!--- ![Select team](create-new-project-03.png) --->
 
-   - Click "Create Project". This takes you to the configuration page. Read through the quick Getting Started guide.
+   - Click "Create Project". This takes you to the quick Configure React SDK guide, which provides an overview of how to configure the SDK. This tutorial covers the SDK setup in more detail.
 
-1. Copy the "DSN" key and keep it handy as you will be copying the key into the source code. You can also find this information any time in **[Project] > Settings > Client Keys (DSN)**.
+1. Copy the "DSN" key and keep it handy. You'll need to paste it into your source code so the SDK knows where to send events to. You can also find this information any time in **[Project] > Settings > Client Keys (DSN)**.
 
-   ![Copy DSN](create-new-project-04.png)
+   <!--- ![Copy DSN](create-new-project-04.png) --->
 
    > The DSN (or Data Source Name) tells the SDK where to send the events, associating them with the project you just created.
 
-1. Click on the "Got it!" button at the bottom to create the project.
+1. Click "Take me to Issues" to go to your new project's **Issues** page.
+
+
+### UI Walkthrough
+
+The animated gif below walks through how to create a new project in the UI.
+
+<div style="position: relative; padding-bottom: calc(56.88524590163935% + 41px); height: 0; width: 100%"><iframe src="https://demo.arcade.software/IUuJGLUBdRIa2yBFE35v?embed" frameborder="0" loading="lazy" webkitallowfullscreen mozallowfullscreen allowfullscreen style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;color-scheme: light;" title="FE Tutorial -> Create Project"></iframe></div>
 
 ## Next
 

src/docs/product/sentry-basics/integrate-frontend/generate-first-error.mdx

@@ -12,9 +12,9 @@ Now that the sample app is up and running on your local environment integrated w
 If you're using your own source code, you can skip this section. Instead:
 
 - Select your [platform](/platforms/) and follow its **Verify** step inside the **Getting Started** guide to introduce an error.
-- Then continue with [Step 2: Handle the error](#step-2-handle-the-error) here.
+- Then continue with [2. View the Error in Sentry](#2-view-the-error-in-sentry) here.
 
-## Step 1: Trigger an Error
+## 1. Trigger an Error
 
 Let's add in an obvious error that will be easy to see in Sentry.
 
@@ -46,7 +46,7 @@ Let's add in an obvious error that will be easy to see in Sentry.
 
      ![Import and Configure SDK](generate-first-error-03.png)
 
-## Step 2: View the Error in Sentry
+## 2. View the Error in Sentry
 
 1. Open up your project in [Sentry.io](https://sentry.io/).
 

src/docs/product/sentry-basics/integrate-frontend/initialize-sentry-sdk.mdx

@@ -11,10 +11,11 @@ This section walks you through how to import the sample application into your lo
 
 If you're using your own source code, you can skip this section. Instead:
 
-- Select your [platform](/platforms/) and follow its **Getting Started** guide to add the Sentry SDK to your code.
-- Then, skip to the [next step](/guides/integrate-frontend/generate-first-error/).
+   - Select your [platform](/platforms/) and follow its **Getting Started** guide to add the Sentry SDK to your code.
+   - Then, skip to the [next step](/guides/integrate-frontend/generate-first-error/).
 
-## Step 1: Clone the Sample Application
+
+## 1. Clone the Sample Application
 
 The sample application is a basic frontend-only application using React and Webpack.
 
@@ -28,19 +29,19 @@ The sample application is a basic frontend-only application using React and Webp
 
 1. Open the "frontend-tutorial" project in your preferred code editor.
 
-## Step 2: Add the Sentry React SDK
+## 2. Add the Sentry React SDK
 
-Sentry captures data by using a platform-specific SDK in added to your application's runtime. To use the SDK, import and configure it in your source code. This demo project uses [Sentry's React SDK](https://github.com/getsentry/sentry-javascript/tree/develop/packages/react).
+Sentry captures data by using a platform-specific SDK that you add to your application's runtime. To use the SDK, import and configure it in your source code. This demo project uses [Sentry's React SDK](https://github.com/getsentry/sentry-javascript/tree/develop/packages/react).
 
-1. Install the Sentry React SDK using NPM
+1. Install the Sentry React SDK using NPM.
 
-   Make sure you're in the "frontend-tutorial" project folders
+   Make sure you're in the `frontend-tutorial` project folder.
 
    ```bash
    npm install --save @sentry/react
    ```
 
-1. Import and initialize the SDK
+1. Import and initialize the SDK.
 
    Open `src/index.js` and add the following lines of code below the last import statement:
 
@@ -62,9 +63,9 @@ Sentry captures data by using a platform-specific SDK in added to your applicati
    });
    ```
 
-   It's important to import and initialize the SDK as early as possible in your application's lifecycle so Sentry can capture errors throughout the application's lifecycle.
+   It's important to import and initialize the SDK as early as possible in your application's lifecycle so Sentry can capture errors throughout the lifecycle.
 
-1. Add your DSN key to the Sentry SDK configuration
+1. Add your DSN key to the Sentry SDK configuration.
 
    Paste in the DSN key value you copied from the project created in the [previous section](/product/sentry-basics/integrate-frontend/create-new-project/).
 
@@ -75,21 +76,21 @@ Sentry captures data by using a platform-specific SDK in added to your applicati
    });
    ```
 
-   The options set in `Sentry.init()` are called the SDK's configuration. The only mandatory configuration option is the DSN however, the SDK supports many other configuration options. Learn more in our [Configuration](/platforms/javascript/guides/react/configuration/) docs.
+   The options set in `Sentry.init()` are called the SDK's configuration. The only mandatory configuration option is the DSN. However, the SDK supports many other configuration options. Learn more in our [Configuration](/platforms/javascript/guides/react/configuration/) docs.
 
    The configuration above enables Sentry's error monitoring feature, as well as its [Performance](/platforms/javascript/guides/react/performance) (tracing) and [Session Replay](/platforms/javascript/guides/react/session-replay) features.
 
-## Step 3: Build and Run the Sample Application
+## 3. Build and Run the Sample Application
 
-In the `frontend-monitoring` project folder:
+In the `frontend-tutorial` project folder:
 
-1. Install project dependencies
+1. Install project dependencies.
 
    ```bash
    npm install
    ```
 
-1. Start the application in develop mode
+1. Start the application in develop mode.
 
    ```bash
    npm start
@@ -104,7 +105,7 @@ In the `frontend-monitoring` project folder:
    webpack 5.87.0 compiled successfully in 1306 ms
    ```
 
-1. Open the sample application in your browser
+1. Open the sample application in your browser.
 
    The sample app should be running at [http://localhost:3000/](http://localhost:3000/) or the URL output in your terminal in the last step.