diff --git a/docs/Configuration/images/introduction-userflow1.png b/docs/Configuration/images/introduction-userflow1.png
new file mode 100644
index 00000000000..729ab76c863
Binary files /dev/null and b/docs/Configuration/images/introduction-userflow1.png differ
diff --git a/docs/Configuration/images/introduction-userflow2.png b/docs/Configuration/images/introduction-userflow2.png
new file mode 100644
index 00000000000..ddb655535c2
Binary files /dev/null and b/docs/Configuration/images/introduction-userflow2.png differ
diff --git a/docs/Configuration/images/introduction-userflow3.png b/docs/Configuration/images/introduction-userflow3.png
new file mode 100644
index 00000000000..83c8eadbd6e
Binary files /dev/null and b/docs/Configuration/images/introduction-userflow3.png differ
diff --git a/docs/Configuration/images/introduction-userflow5.png b/docs/Configuration/images/introduction-userflow5.png
new file mode 100644
index 00000000000..b38cbf60c7d
Binary files /dev/null and b/docs/Configuration/images/introduction-userflow5.png differ
diff --git a/docs/Overview/Introduction.md b/docs/Overview/Introduction.md
index f590033570a..6e3ee30a7e8 100755
--- a/docs/Overview/Introduction.md
+++ b/docs/Overview/Introduction.md
@@ -17,30 +17,35 @@ Apache DevLake (Incubating) is an open-source dev data platform that ingests, an
Apache DevLake is designed for developer teams looking to make better sense of their development process and to bring a more data-driven approach to their own practices. You can ask Apache DevLake many questions regarding your development process. Just connect and query.
## What can be accomplished with DevLake?
-1. Collect DevOps data across the entire Software Development Life Cycle (SDLC) and connect the siloed data with a standard [data model](../DataModels/DevLakeDomainLayerSchema.md).
-2. Visualize out-of-the-box [engineering metrics](../Metrics) in a series of use-case driven dashboards
-3. Easily extend DevLake to support your data sources, metrics, and dashboards with a flexible [framework](Architecture.md) for data collection and ETL (Extract, Transform, Load).
+- Unified data integration: Bring together DevOps data from across the Software Development Life Cycle (SDLC) with our [standard data model](https://devlake.apache.org/docs/DataModels/DevLakeDomainLayerSchema/).
+- Out-of-the-box insights: Access key engineering metrics through intuitive, use-case driven dashboards.
+- Customizable: Extend DevLake to align with your unique needs, adding [data sources](https://devlake.apache.org/docs/next/Overview/SupportedDataSources/), [metrics](https://devlake.apache.org/docs/next/Metrics/), and [dashboards](https://devlake.apache.org/livedemo/EngineeringLeads/DORA/) as required.
+- Industry standards implementation: Use DevLake to apply recognized [DORA metrics](https://devlake.apache.org/docs/DORA/) to optimize DevOps performance.
+- Create a thriving culture: DevLake is centred on healthy practises that may help teams adopt and build a practical data-driven culture.
## How do I use DevLake?
-### 1. Set up DevLake
-You can easily set up Apache DevLake by following our step-by step instructions for [Docker Compose setup](../GettingStarted/DockerComposeSetup.md) or [Helm setup](../GettingStarted/HelmSetup.md).
+### 1. Setting-up DevLake
+- Create the proof of concept of Apache DevLake for your use-case by installing in your local machines via Docker Compose: [Docker Compose setup](../GettingStarted/DockerComposeSetup.md)
+- Alternatively, if you're powered by Kuberenetes, then check out the [Helm setup](../GettingStarted/HelmSetup.md).
-### 2. Create a Blueprint
-The DevLake Configuration UI will guide you through the process (a Blueprint) to define the data connections, data scope, transformation and sync frequency of the data you wish to collect.
+### 2. Configuring Data Source
+- Once Installed, you can start configuring DevLake with supported [data sources](https://devlake.apache.org/docs/next/Overview/SupportedDataSources) like GitHub, GitLab, Jira, Jenkins, BitBucket, Azure DevOps, SonarQube, PagerDuty, TAPD, ZenTao, Teambition, and we're extending our support to many other tools, feel free to check out the official roadmap.
+- If your CI / CD tool is not supported yet, then you may use the [Webhooks](https://devlake.apache.org/docs/Plugins/webhook/) feature.
-![img](/img/Introduction/userflow1.svg)
+![img](../Configuration/images/introduction-userflow1.png)
-### 3. Track the Blueprint's progress
-You can track the progress of the Blueprint you have just set up.
+![img](../Configuration/images/introduction-userflow2.png)
-![img](/img/Introduction/userflow2.svg)
+### 3. Creating your Project
+- After connecting the data-source, a "Project" makes sure that you're all set for execution. A four-step process allows you to play DevLake and visualize pre-built dashboards
-### 4. View the pre-built dashboards
-Once the first run of the Blueprint is completed, you can view the corresponding dashboards.
+![img](../Configuration/images/introduction-userflow3.png)
+
+### 4. Checking the results (Validation & Customization)
+- After configuring the project, you can take a look at our pre-built dashboards in Grafana.
![img](/img/Introduction/userflow3.png)
-### 5. Customize the dashboards with SQL
-If the pre-built dashboards are limited for your use cases, you can always customize or create your own metrics or dashboards with SQL.
+- Dashboards can be tweaked according to the goal and intent of [metrics](https://devlake.apache.org/docs/Metrics/) or create your own using SQL. You can also check out [Domain Layer Schema](https://devlake.apache.org/docs/Metrics/) - DevLake's standard data model.
-![img](/img/Introduction/userflow4.png)
+![img](../Configuration/images/introduction-userflow5.png)
\ No newline at end of file
diff --git a/docs/Plugins/azuredevops.md b/docs/Plugins/azuredevops.md
index e1fcf07da7a..3a337448976 100644
--- a/docs/Plugins/azuredevops.md
+++ b/docs/Plugins/azuredevops.md
@@ -8,6 +8,10 @@ description: >
This plugin collects Azure DevOps data through Azure DevOps REST API.
+## Supported Versions
+
+Available for Azure DevOps Cloud. Check [this doc](https://devlake.apache.org/docs/Overview/SupportedDataSources#data-sources-and-data-plugins) for more details.
+
## Entities
Check out the [Azure DevOps entities](/Overview/SupportedDataSources.md#data-collection-scope-by-each-plugin) collected by this plugin.
diff --git a/docs/Plugins/bamboo.md b/docs/Plugins/bamboo.md
index 3da09c1a60a..e67ae358d61 100644
--- a/docs/Plugins/bamboo.md
+++ b/docs/Plugins/bamboo.md
@@ -11,6 +11,10 @@ This plugin collects Bamboo's CI data through [API](https://developer.atlassian.
- What is the deployment frequency of your team?
- How long does it take for your codes to get deployed?
+## Supported Versions
+
+Will be available for Bamboo v6.8.1+. Check [this doc](https://devlake.apache.org/docs/Overview/SupportedDataSources#data-sources-and-data-plugins) for more details.
+
## Entities
Check out the [Bamboo entities](/Overview/SupportedDataSources.md#data-collection-scope-by-each-plugin) collected by this plugin.
diff --git a/docs/Plugins/bitbucket.md b/docs/Plugins/bitbucket.md
index bdb087b3d54..6cde9fe365b 100644
--- a/docs/Plugins/bitbucket.md
+++ b/docs/Plugins/bitbucket.md
@@ -12,6 +12,11 @@ This plugin collects various entities from Bitbucket, including pull requests, i
As of v0.14.2, `bitbucket` plugin can only be invoked through DevLake API. Its support in Config-UI is WIP.
+## Supported Versions
+
+Available for BitBucket Cloud. Check [this doc](https://devlake.apache.org/docs/Overview/SupportedDataSources#data-sources-and-data-plugins) for more details.
+
+
## Entities
Check out the [BitBucket entities](/Overview/SupportedDataSources.md#data-collection-scope-by-each-plugin) collected by this plugin.
diff --git a/docs/Plugins/feishu.md b/docs/Plugins/feishu.md
index 306f3bd9893..e40aabaca78 100644
--- a/docs/Plugins/feishu.md
+++ b/docs/Plugins/feishu.md
@@ -8,6 +8,9 @@ description: >
This plugin collects Feishu meeting data through [Feishu Openapi](https://open.feishu.cn/document/home/user-identity-introduction/introduction).
+## Supported Versions
+Will be available for all versions. Check [this doc](https://devlake.apache.org/docs/Overview/SupportedDataSources#data-sources-and-data-plugins) for more details.
+
## Configuration
In order to fully use this plugin, you will need to get `app_id` and `app_secret` from a Feishu administrator (for help on App info, please see [official Feishu Docs](https://open.feishu.cn/document/ukTMukTMukTM/ukDNz4SO0MjL5QzM/auth-v3/auth/tenant_access_token_internal)),
diff --git a/docs/Plugins/gitee.md b/docs/Plugins/gitee.md
index 79c3c907dac..f0e50a30be9 100644
--- a/docs/Plugins/gitee.md
+++ b/docs/Plugins/gitee.md
@@ -8,6 +8,10 @@ description: >
This plugin collects `Gitee` data through [Gitee Openapi](https://gitee.com/api/v5/swagger).
+## Supported Versions
+
+Will be available for Gitee Cloud. Check [this doc](https://devlake.apache.org/docs/Overview/SupportedDataSources#data-sources-and-data-plugins) for more details.
+
## Configuration
In order to fully use this plugin, you will need to get `token` on the Gitee website.
diff --git a/docs/Plugins/github.md b/docs/Plugins/github.md
index a57adee6bbf..e14cd532abc 100644
--- a/docs/Plugins/github.md
+++ b/docs/Plugins/github.md
@@ -12,6 +12,10 @@ This plugin collects GitHub data through [REST API](https://docs.github.com/en/r
- How fast do we respond to customer requirements?
- Was our quality improved or not?
+## Supported Versions
+
+Available for GitHub Cloud. Check [this doc](https://devlake.apache.org/docs/Overview/SupportedDataSources#data-sources-and-data-plugins) for more details.
+
## Entities
Check out the [GitHub entities](/Overview/SupportedDataSources.md#data-collection-scope-by-each-plugin) collected by this plugin.
diff --git a/docs/Plugins/gitlab.md b/docs/Plugins/gitlab.md
index 03dc16925a1..59f4a63f4f8 100644
--- a/docs/Plugins/gitlab.md
+++ b/docs/Plugins/gitlab.md
@@ -13,6 +13,10 @@ This plugin collects GitLab data through [API](https://docs.gitlab.com/ee/api/).
- How long does it take for your codes to get merged?
- How much time is spent on code review?
+## Supported Versions
+
+Available for GitLab Cloud, Community Edition 11+. Check [this doc](https://devlake.apache.org/docs/Overview/SupportedDataSources#data-sources-and-data-plugins) for more details.
+
## Entities
Check out the [GitLab entities](/Overview/SupportedDataSources.md#data-collection-scope-by-each-plugin) collected by this plugin.
diff --git a/docs/Plugins/jenkins.md b/docs/Plugins/jenkins.md
index d7b23ddf6fc..8ea5c3315ba 100644
--- a/docs/Plugins/jenkins.md
+++ b/docs/Plugins/jenkins.md
@@ -12,6 +12,10 @@ This plugin collects Jenkins data through [Remote Access API](https://www.jenkin
- What is the build success rate?
- How long does it take for a code change to be deployed into production?
+## Supported Versions
+
+Available for Jenkins v2.263.x+. Check [this doc](https://devlake.apache.org/docs/Overview/SupportedDataSources#data-sources-and-data-plugins) for more details.
+
### Note
Please note that it is important to avoid [rerunning Jenkins builds in place](https://www.jenkins.io/doc/pipeline/tour/running-multiple-steps/#timeouts-retries-and-more), and instead ensure that each rerun has a unique build number. This is because rerunning builds with the same build number can lead to inconsistencies in the data collected by the Jenkins plugin.
diff --git a/docs/Plugins/jira.md b/docs/Plugins/jira.md
index 88e72e3a1fc..8efc1a07113 100644
--- a/docs/Plugins/jira.md
+++ b/docs/Plugins/jira.md
@@ -8,6 +8,9 @@ description: >
This plugin collects Jira data through Jira REST API. It then computes and visualizes various engineering metrics from the Jira data.
+## Supported Versions
+Available for Jira Cloud, Sever/Data Center 7.x, 8.x. Check [this doc](https://devlake.apache.org/docs/Overview/SupportedDataSources#data-sources-and-data-plugins) for more details.
+
## Entities
Check out the [Jira entities](/Overview/SupportedDataSources.md#data-collection-scope-by-each-plugin) collected by this plugin.
diff --git a/docs/Plugins/pagerduty.md b/docs/Plugins/pagerduty.md
index dce17e8d0f6..438f1562a1c 100644
--- a/docs/Plugins/pagerduty.md
+++ b/docs/Plugins/pagerduty.md
@@ -4,8 +4,6 @@ description: >
PagerDuty Plugin
---
-
-
## Summary
This plugin collects all incidents from PagerDuty, and uses them to compute incident-type DORA metrics. Namely,
@@ -14,6 +12,9 @@ This plugin collects all incidents from PagerDuty, and uses them to compute inci
* [Incident Age](/Metrics/IncidentAge.md)
* [Incident Count Per 1k Lines of Code](/Metrics/IncidentCountPer1kLinesOfCode.md)
+## Supported Versions
+Available for PagerDuty Cloud. Check [this doc](https://devlake.apache.org/docs/Overview/SupportedDataSources#data-sources-and-data-plugins) for more details.
+
## Configuration
* Configure PagerDuty via Config UI. See instructions [here](/Configuration/PagerDuty.md).
diff --git a/docs/Plugins/sonarqube.md b/docs/Plugins/sonarqube.md
index 468c2014f30..1d1bdbacc10 100644
--- a/docs/Plugins/sonarqube.md
+++ b/docs/Plugins/sonarqube.md
@@ -9,6 +9,10 @@ description: >
This plugin collects SonarQube data through its REST APIs. SonarQube is a tool for static code analysis and code quality management. It can help you discover potential problems and defects in your code, and provide suggestions and solutions.
(Please note that this version of SonarQube cannot collect issues with more than 10k+)
+## Supported Versions
+
+Available for SonarQube Server v8.x, v9.x. Check [this doc](https://devlake.apache.org/docs/Overview/SupportedDataSources#data-sources-and-data-plugins) for more details.
+
## Entities
Check out the [SonarQube entities](/Overview/SupportedDataSources.md#data-collection-scope-by-each-plugin) collected by this plugin.
diff --git a/docs/Plugins/tapd.md b/docs/Plugins/tapd.md
index d4fa9125482..829954cdbab 100644
--- a/docs/Plugins/tapd.md
+++ b/docs/Plugins/tapd.md
@@ -8,6 +8,9 @@ description: >
This plugin collects TAPD data through its REST APIs. TAPD is an issue-tracking tool similar to Jira.
+## Supported Versions
+Advanced mode available for Tapd Cloud. Check [this doc](https://devlake.apache.org/docs/Overview/SupportedDataSources#data-sources-and-data-plugins) for more details.
+
## Metrics
Metrics that can be calculated based on the data collected from Tapd:
diff --git a/docs/Plugins/teambition.md b/docs/Plugins/teambition.md
index 9f3ac113cb4..601e238476d 100644
--- a/docs/Plugins/teambition.md
+++ b/docs/Plugins/teambition.md
@@ -9,6 +9,10 @@ description: >
This plugin collects Teambition data through its REST APIs. Teambition is an issue-tracking tool similar to Trello.
+## Supported Versions
+
+Available for Teambition Cloud. Check [this doc](https://devlake.apache.org/docs/Overview/SupportedDataSources#data-sources-and-data-plugins) for more details.
+
## Metrics
Metrics that can be calculated based on the data collected from Teambition:
diff --git a/docs/Plugins/zentao.md b/docs/Plugins/zentao.md
index 43d6398d492..223556e5c08 100644
--- a/docs/Plugins/zentao.md
+++ b/docs/Plugins/zentao.md
@@ -8,6 +8,10 @@ description: >
This plugin collects Zentao data through its REST APIs. [Zentao](https://github.com/easysoft/zentaopms) is an issue-tracking tool similar to Jira.
+## Supported Versions
+
+Advanced mode vailable for Zentao OSS v18.3, Enterprise v8.2, Flagship v4.3. Check [this doc](https://devlake.apache.org/docs/Overview/SupportedDataSources#data-sources-and-data-plugins) for more details.
+
## Metrics
Metrics that can be calculated based on the data collected from Zentao:
diff --git a/src/components/Sections/WhyDevlake.tsx b/src/components/Sections/WhyDevlake.tsx
index c1650183447..9f260f782cd 100644
--- a/src/components/Sections/WhyDevlake.tsx
+++ b/src/components/Sections/WhyDevlake.tsx
@@ -102,10 +102,10 @@ function Supports() {
className="text-label18 font-inter text-neutral-500 mt-6
sm:text-label16 sm:mt-4"
>
-
- More data sources
- {" "}
- coming soon...
+ Check out all {" "}
+
+ supported data sources
+
);