Skip to content

Commit

Permalink
Separated pages
Browse files Browse the repository at this point in the history
  • Loading branch information
samchon committed Sep 6, 2024
1 parent 2459dee commit c22a092
Show file tree
Hide file tree
Showing 5 changed files with 67 additions and 77 deletions.
14 changes: 8 additions & 6 deletions pages/docs/_meta.json
Original file line number Diff line number Diff line change
@@ -1,8 +1,10 @@
{
"index": {
"title": "🙋🏻‍♂️ Introduction",
"theme": {
"sidebar": false
}
}
"-- features": {
"type": "separator",
"title": "📖 Introduction"
},
"index": "Overview",
"core-elements": "Core Elements",
"getting-started": "Getting Started",
"use-cases": "Use Cases"
}
8 changes: 8 additions & 0 deletions pages/docs/core-elements.mdx
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
# 2. Core Elements

* **Interactive and User-Friendly Interface**: The user-friendly agentic interface that allows users to communicate and view the execution process of the Studio autonomous agent in the form of a workflow.
* **Workflow**: The execution path designed by the Studio autonomous agent to achieve the user's desired goals, broken down into actionable units.
* **Workflow Canvas**: A drag-and-drop low-code editor that visualizes the design and action-level execution paths created by the Studio autonomous agent. Connector node blocks are displayed and can be edited by the user as needed.
* **Marketplace**: A store where users can share or sell completed workflows, bot agents, connectors, and APIs. It aims to create an ecosystem that allows users to benefit from the collective expertise of the community.
* **Connector**: The external service and data connections, programming syntax, and expressions needed for the Studio autonomous agent to execute actions based on user context. Connectors are represented by Swagger documentation and visualized as node blocks on the Workflow Canvas. They are essential for connecting external services and data to execute user requests. In addition to core connectors, acquiring connectors for services frequently used in the local market is necessary for the Studio autonomous agent to understand and execute various user requests via natural language.
* **Human-in-the-loop**: A feature that enhances trust and control over outputs by allowing users to make immediate modifications, adjustments, and approvals within desired parameters under the supervision of the Studio autonomous agent.
39 changes: 39 additions & 0 deletions pages/docs/getting-started.mdx
Original file line number Diff line number Diff line change
@@ -0,0 +1,39 @@
# 3. Getting Started

## Example 1

Creating an a storybook author AI agent that allows users to export unique picture book to Google Slides

**Step 1:** Register or log in on the product page. ([https://studio-pro.wrtn.ai](https://studio-pro.wrtn.ai/login))

**Step 2:** In the prompt field, type: “Create a storybook author AI agent that allows users to build a unique story and create a picture book.”

![](/studio-pro/images/docs/intro-meta-step-2-1.png)

![](/studio-pro/images/docs/intro-meta-step-2-2.png)

**Step 3:** The Studio autonomous agent will ask follow-up questions to better understand your task and requirements.

![](/studio-pro/images/docs/intro-meta-step-3-1.png)

**Step 4:** Once the Studio autonomous agent has gathered all the necessary information and understands your requirements, it will present a task execution plan. Click the “Confirm” button to approve the plan.

![](/studio-pro/images/docs/intro-meta-step-4-1.png)

**Step 5:** You will be prompted to connect to your Google Slides account. Select your account and log in.

![](/studio-pro/images/docs/intro-meta-step-5-1.png)

![](/studio-pro/images/docs/intro-meta-step-5-2.png)

**Step 6:** The Studio autonomous agent will then create a workflow to develop the storyteller bot and generate a unique picture book. Click the “View Workflow” button on the workflow card to see the details.

![](/studio-pro/images/docs/intro-meta-step-6-1.png)

**Step 7:** View the workflow in the Canvas. Click the “Run Chatbot” button in the top right corner.

![](/studio-pro/images/docs/intro-meta-step-7-1.png)

**Step 8:** The storybook author bot will be launched. You can provide instructions on the theme or characters for the story.

![](/studio-pro/images/docs/intro-meta-step-8-1.png)
74 changes: 3 additions & 71 deletions pages/docs/index.mdx
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
## 1. Overview
# 1. Overview

![Intro](/studio-pro/images/docs/intro.png)
![Intro](/images/docs/intro.png)

Studio Pro is a creation tool that enhances productivity by allowing users to easily build their own AI workflow apps and agents using an AI agent-based low-code builder tool. Studio Pro provides an optimal AI user experience designed to automatically perform tasks as desired by the user. Within the studio, there is an AI agent that assists throughout the entire user journey. This agent is the autonomous agent that receives user requests via natural language or voice, formulates an execution plan, and uses the provided connectors to integrate with external services and data, creating action-node-block-based workflows. After user confirmation, it can directly perform tasks.

Expand Down Expand Up @@ -32,72 +32,4 @@ For power users, there is an option to extract their own workflow apps and APIs
referrerpolicy="strict-origin-when-cross-origin"
allowfullscreen>
</iframe>
</div>




## 2. Core Elements

* **Interactive and User-Friendly Interface**: The user-friendly agentic interface that allows users to communicate and view the execution process of the Studio autonomous agent in the form of a workflow.
* **Workflow**: The execution path designed by the Studio autonomous agent to achieve the user's desired goals, broken down into actionable units.
* **Workflow Canvas**: A drag-and-drop low-code editor that visualizes the design and action-level execution paths created by the Studio autonomous agent. Connector node blocks are displayed and can be edited by the user as needed.
* **Marketplace**: A store where users can share or sell completed workflows, bot agents, connectors, and APIs. It aims to create an ecosystem that allows users to benefit from the collective expertise of the community.
* **Connector**: The external service and data connections, programming syntax, and expressions needed for the Studio autonomous agent to execute actions based on user context. Connectors are represented by Swagger documentation and visualized as node blocks on the Workflow Canvas. They are essential for connecting external services and data to execute user requests. In addition to core connectors, acquiring connectors for services frequently used in the local market is necessary for the Studio autonomous agent to understand and execute various user requests via natural language.
* **Human-in-the-loop**: A feature that enhances trust and control over outputs by allowing users to make immediate modifications, adjustments, and approvals within desired parameters under the supervision of the Studio autonomous agent.




## 3. Getting Started

### Example 1

Creating an a storybook author AI agent that allows users to export unique picture book to Google Slides

**Step 1:** Register or log in on the product page. ([https://studio-pro.wrtn.ai](https://studio-pro.wrtn.ai/login))

**Step 2:** In the prompt field, type: “Create a storybook author AI agent that allows users to build a unique story and create a picture book.”

![](/studio-pro/images/docs/intro-meta-step-2-1.png)

![](/studio-pro/images/docs/intro-meta-step-2-2.png)

**Step 3:** The Studio autonomous agent will ask follow-up questions to better understand your task and requirements.

![](/studio-pro/images/docs/intro-meta-step-3-1.png)

**Step 4:** Once the Studio autonomous agent has gathered all the necessary information and understands your requirements, it will present a task execution plan. Click the “Confirm” button to approve the plan.

![](/studio-pro/images/docs/intro-meta-step-4-1.png)

**Step 5:** You will be prompted to connect to your Google Slides account. Select your account and log in.

![](/studio-pro/images/docs/intro-meta-step-5-1.png)

![](/studio-pro/images/docs/intro-meta-step-5-2.png)

**Step 6:** The Studio autonomous agent will then create a workflow to develop the storyteller bot and generate a unique picture book. Click the “View Workflow” button on the workflow card to see the details.

![](/studio-pro/images/docs/intro-meta-step-6-1.png)

**Step 7:** View the workflow in the Canvas. Click the “Run Chatbot” button in the top right corner.

![](/studio-pro/images/docs/intro-meta-step-7-1.png)

**Step 8:** The storybook author bot will be launched. You can provide instructions on the theme or characters for the story.

![](/studio-pro/images/docs/intro-meta-step-8-1.png)




## 4. Use Cases

![](/studio-pro/images/docs/intro-use-cases-1.png)

![](/studio-pro/images/docs/intro-use-cases-2.png)

![](/studio-pro/images/docs/intro-use-cases-3.png)

![](/studio-pro/images/docs/intro-use-cases-4.png)
</div>
9 changes: 9 additions & 0 deletions pages/docs/use-cases.mdx
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
# 4. Use Cases

![](/studio-pro/images/docs/intro-use-cases-1.png)

![](/studio-pro/images/docs/intro-use-cases-2.png)

![](/studio-pro/images/docs/intro-use-cases-3.png)

![](/studio-pro/images/docs/intro-use-cases-4.png)

0 comments on commit c22a092

Please sign in to comment.