diff --git a/_topic_map.yml b/_topic_map.yml
index 8356d9fc81..db6868931b 100644
--- a/_topic_map.yml
+++ b/_topic_map.yml
@@ -186,9 +186,12 @@ Topics:
 - Name: Configuring the web console
   File: configuring-web-console
 - Name: Customizing the web console
-  File: customizing-the-web-console  
+  File: customizing-the-web-console
+- Name: Developer perspective
+  File: odc-about-developer-perspective
 - Name: Disabling the web console
   File: disabling-web-console
+
 ---
 Name: Authentication
 Dir: authentication
@@ -545,8 +548,12 @@ Topics:
 - Name:  Application life cycle management
   Dir: application-life-cycle-management
   Topics:
-    - Name: Creating applications
-      File: creating-new-applications
+  - Name: Creating applications using the CLI
+    File: creating-applications-using-cli
+  - Name: Creating an application using the Developer perspective
+    File: odc-creating-applications-using-developer-perspective
+  - Name: Viewing application composition using the Topology view
+    File: odc-viewing-application-composition-using-topology-view
 - Name: Service brokers
   Dir: service_brokers
   Distros: openshift-enterprise,openshift-origin
diff --git a/applications/application-life-cycle-management/creating-new-applications.adoc b/applications/application-life-cycle-management/creating-applications-using-cli.adoc
similarity index 71%
rename from applications/application-life-cycle-management/creating-new-applications.adoc
rename to applications/application-life-cycle-management/creating-applications-using-cli.adoc
index 9ff4cc2cd9..659af8fae3 100644
--- a/applications/application-life-cycle-management/creating-new-applications.adoc
+++ b/applications/application-life-cycle-management/creating-applications-using-cli.adoc
@@ -1,7 +1,8 @@
-[id="creating-new-applications"]
-= Creating applications
+[id="creating-applications-using-cli"]
+= Creating applications using the CLI
 include::modules/common-attributes.adoc[]
-:context: creating-new-applications
+:context: creating-applications-using-cli
+
 toc::[]
 
 You can create an {product-title} application from components that include
@@ -11,13 +12,10 @@ CLI.
 The set of objects created by `new-app` depends on the artifacts passed as
 input: source repositories, images, or templates.
 
-[id="creating-application-using-cli-{context}"]
-== Creating an application by using the CLI
+include::modules/applications-create-using-cli-source-code.adoc[leveloffset=+1]
 
-include::modules/applications-create-using-cli-source-code.adoc[leveloffset=+2]
+include::modules/applications-create-using-cli-image.adoc[leveloffset=+1]
 
-include::modules/applications-create-using-cli-image.adoc[leveloffset=+2]
+include::modules/applications-create-using-cli-template.adoc[leveloffset=+1]
 
-include::modules/applications-create-using-cli-template.adoc[leveloffset=+2]
-
-include::modules/applications-create-using-cli-modify.adoc[leveloffset=+2]
+include::modules/applications-create-using-cli-modify.adoc[leveloffset=+1]
diff --git a/applications/application-life-cycle-management/images b/applications/application-life-cycle-management/images
new file mode 120000
index 0000000000..5e67573196
--- /dev/null
+++ b/applications/application-life-cycle-management/images
@@ -0,0 +1 @@
+../images
\ No newline at end of file
diff --git a/applications/application-life-cycle-management/modules b/applications/application-life-cycle-management/modules
new file mode 120000
index 0000000000..464b823aca
--- /dev/null
+++ b/applications/application-life-cycle-management/modules
@@ -0,0 +1 @@
+../modules
\ No newline at end of file
diff --git a/applications/application-life-cycle-management/odc-creating-applications-using-developer-perspective.adoc b/applications/application-life-cycle-management/odc-creating-applications-using-developer-perspective.adoc
new file mode 100644
index 0000000000..c31cbdb193
--- /dev/null
+++ b/applications/application-life-cycle-management/odc-creating-applications-using-developer-perspective.adoc
@@ -0,0 +1,30 @@
+[id="odc-creating-applications-using-developer-perspective"]
+= Creating applications using the Developer perspective
+include::modules/common-attributes.adoc[]
+:context: odc-creating-applications-using-developer-perspective
+
+toc::[]
+
+The *Developer* perspective in the web console provides you the following options from the *Add* view to create applications and associated services and deploy them on {product-title}:
+
+image::odc_add_view.png[Add View]
+
+* *From Git*: Use this option to import an existing codebase in a Git repository to create, build, and deploy an application on {product-title}.
+* *Container Image*: Use existing images from an image stream or registry to deploy it on to {product-title}.
+* *From Catalog*: Explore the *Developer Catalog* to select the required applications, services, or source to image builders and add it to your project.
+* *From Dockerfile*: Import a dockerfile from your Git repository to build and deploy an application.
+* *YAML*: Use the editor to add YAML or JSON definitions to create and modify resources.
+* *Add Database*: See the *Developer Catalog* to select the required database service and add it to your application.
+
+[NOTE]
+====
+The serverless sections in the above options are displayed only if the xref:../../serverless/installing-openshift-serverless.adoc#installing-openshift-serverless[*Serverless Operator*] is installed in your cluster.  OpenShift Serverless is a Technology Preview feature.
+====
+
+.Prerequisites
+To create applications using the *Developer* perspective ensure that:
+
+* You have xref:../../web-console/web-console.adoc#web-console[logged in to the web console].
+* You are in the xref:../../web-console/odc-about-developer-perspective.adoc#odc-about-developer-perspective[*Developer* perspective].
+
+include::modules/odc-importing-codebase-from-git-to-create-application.adoc[leveloffset=+1]
diff --git a/applications/application-life-cycle-management/odc-viewing-application-composition-using-topology-view.adoc b/applications/application-life-cycle-management/odc-viewing-application-composition-using-topology-view.adoc
new file mode 100644
index 0000000000..cb522ade74
--- /dev/null
+++ b/applications/application-life-cycle-management/odc-viewing-application-composition-using-topology-view.adoc
@@ -0,0 +1,27 @@
+[id="odc-viewing-application-composition-using-topology-view"]
+= Viewing application composition using the Topology view
+include::modules/common-attributes.adoc[]
+:context: viewing-application-composition-using-topology-view
+toc::[]
+
+The *Topology* view in the *Developer* perspective of the web console provides a visual representation of all the applications within a project, their build status, and the components and services associated with them.
+
+.Prerequisites
+To view your applications in the *Topology* view and interact with them, ensure that:
+
+* You have xref:../../web-console/web-console.adoc#web-console[logged in to the web console].
+* You are in the xref:../../web-console/odc-about-developer-perspective.adoc#odc-about-developer-perspective[*Developer* perspective].
+* You have xref:../application-life-cycle-management/odc-creating-applications-using-developer-perspective.adoc#odc-creating-applications-using-developer-perspective[created and deployed an application on {product-title} using the *Developer* perspective].
+
+
+include::modules/odc-viewing-application-topology.adoc[leveloffset=+1]
+
+include::modules/odc-interacting-with-applications.adoc[leveloffset=+1]
+
+include::modules/odc-scaling-application-pods-and-checking-builds-and-routes.adoc[leveloffset=+1]
+
+include::modules/odc-grouping-multiple-components.adoc[leveloffset=+1]
+
+include::modules/odc-connecting-components.adoc[leveloffset=+1]
+
+include::modules/odc-labels-and-annotations-used-for-topology-view.adoc[leveloffset=+1]
diff --git a/applications/projects/images b/applications/projects/images
new file mode 120000
index 0000000000..5e67573196
--- /dev/null
+++ b/applications/projects/images
@@ -0,0 +1 @@
+../images
\ No newline at end of file
diff --git a/applications/projects/modules b/applications/projects/modules
new file mode 120000
index 0000000000..464b823aca
--- /dev/null
+++ b/applications/projects/modules
@@ -0,0 +1 @@
+../modules
\ No newline at end of file
diff --git a/applications/projects/working-with-projects.adoc b/applications/projects/working-with-projects.adoc
index 7118ab5100..0fb5166a3f 100644
--- a/applications/projects/working-with-projects.adoc
+++ b/applications/projects/working-with-projects.adoc
@@ -10,6 +10,8 @@ isolation from other communities.
 
 include::modules/creating-a-project-using-the-web-console.adoc[leveloffset=+1]
 
+include::modules/odc-creating-projects-using-developer-perspective.adoc[leveloffset=+1]
+
 include::modules/creating-a-project-using-the-CLI.adoc[leveloffset=+1]
 
 include::modules/viewing-a-project-using-the-web-console.adoc[leveloffset=+1]
diff --git a/images/odc_add_view.png b/images/odc_add_view.png
new file mode 100644
index 0000000000..3b434924a3
Binary files /dev/null and b/images/odc_add_view.png differ
diff --git a/images/odc_annotation.png b/images/odc_annotation.png
new file mode 100644
index 0000000000..73ddc5d32d
Binary files /dev/null and b/images/odc_annotation.png differ
diff --git a/images/odc_app_grouping_label.png b/images/odc_app_grouping_label.png
new file mode 100644
index 0000000000..61eec3e128
Binary files /dev/null and b/images/odc_app_grouping_label.png differ
diff --git a/images/odc_application_topology.png b/images/odc_application_topology.png
new file mode 100644
index 0000000000..f418a45cfe
Binary files /dev/null and b/images/odc_application_topology.png differ
diff --git a/images/odc_build_canceled.png b/images/odc_build_canceled.png
new file mode 100644
index 0000000000..0e4da383ba
Binary files /dev/null and b/images/odc_build_canceled.png differ
diff --git a/images/odc_build_completed.png b/images/odc_build_completed.png
new file mode 100644
index 0000000000..fa55d761cf
Binary files /dev/null and b/images/odc_build_completed.png differ
diff --git a/images/odc_build_failed.png b/images/odc_build_failed.png
new file mode 100644
index 0000000000..eb5a62cd45
Binary files /dev/null and b/images/odc_build_failed.png differ
diff --git a/images/odc_build_new.png b/images/odc_build_new.png
new file mode 100644
index 0000000000..52cb97fd6b
Binary files /dev/null and b/images/odc_build_new.png differ
diff --git a/images/odc_build_pending.png b/images/odc_build_pending.png
new file mode 100644
index 0000000000..a9d4615733
Binary files /dev/null and b/images/odc_build_pending.png differ
diff --git a/images/odc_build_running.png b/images/odc_build_running.png
new file mode 100644
index 0000000000..a0aaa83590
Binary files /dev/null and b/images/odc_build_running.png differ
diff --git a/images/odc_che_workspace.png b/images/odc_che_workspace.png
new file mode 100644
index 0000000000..fd17944d96
Binary files /dev/null and b/images/odc_che_workspace.png differ
diff --git a/images/odc_connecting_multiple_applications.png b/images/odc_connecting_multiple_applications.png
new file mode 100644
index 0000000000..510ffbd3fc
Binary files /dev/null and b/images/odc_connecting_multiple_applications.png differ
diff --git a/images/odc_connector.png b/images/odc_connector.png
new file mode 100644
index 0000000000..ec6be7fc58
Binary files /dev/null and b/images/odc_connector.png differ
diff --git a/images/odc_create_project.png b/images/odc_create_project.png
new file mode 100644
index 0000000000..fd92dfd7a6
Binary files /dev/null and b/images/odc_create_project.png differ
diff --git a/images/odc_developer_perspective.png b/images/odc_developer_perspective.png
new file mode 100644
index 0000000000..ad24511c19
Binary files /dev/null and b/images/odc_developer_perspective.png differ
diff --git a/images/odc_git_repository.png b/images/odc_git_repository.png
new file mode 100644
index 0000000000..4b22c5d567
Binary files /dev/null and b/images/odc_git_repository.png differ
diff --git a/images/odc_import_from_git.png b/images/odc_import_from_git.png
new file mode 100644
index 0000000000..8dd50660cc
Binary files /dev/null and b/images/odc_import_from_git.png differ
diff --git a/images/odc_open_url.png b/images/odc_open_url.png
new file mode 100644
index 0000000000..ad5498ec94
Binary files /dev/null and b/images/odc_open_url.png differ
diff --git a/images/odc_pod_failed.png b/images/odc_pod_failed.png
new file mode 100644
index 0000000000..94bb0a686b
Binary files /dev/null and b/images/odc_pod_failed.png differ
diff --git a/images/odc_pod_not_ready.png b/images/odc_pod_not_ready.png
new file mode 100644
index 0000000000..5b0f76daa2
Binary files /dev/null and b/images/odc_pod_not_ready.png differ
diff --git a/images/odc_pod_pending.png b/images/odc_pod_pending.png
new file mode 100644
index 0000000000..c0181dfdba
Binary files /dev/null and b/images/odc_pod_pending.png differ
diff --git a/images/odc_pod_running.png b/images/odc_pod_running.png
new file mode 100644
index 0000000000..75c015fab6
Binary files /dev/null and b/images/odc_pod_running.png differ
diff --git a/images/odc_pod_succeeded.png b/images/odc_pod_succeeded.png
new file mode 100644
index 0000000000..257b956f58
Binary files /dev/null and b/images/odc_pod_succeeded.png differ
diff --git a/images/odc_pod_terminating.png b/images/odc_pod_terminating.png
new file mode 100644
index 0000000000..f4f3fcdd37
Binary files /dev/null and b/images/odc_pod_terminating.png differ
diff --git a/images/odc_pod_unknown.png b/images/odc_pod_unknown.png
new file mode 100644
index 0000000000..d4d0b65664
Binary files /dev/null and b/images/odc_pod_unknown.png differ
diff --git a/images/odc_pod_warning.png b/images/odc_pod_warning.png
new file mode 100644
index 0000000000..8a6d5afb5b
Binary files /dev/null and b/images/odc_pod_warning.png differ
diff --git a/images/odc_serverless_app.png b/images/odc_serverless_app.png
new file mode 100644
index 0000000000..2b748c403b
Binary files /dev/null and b/images/odc_serverless_app.png differ
diff --git a/modules/applications-create-using-cli-image.adoc b/modules/applications-create-using-cli-image.adoc
index c349af466a..665588801e 100644
--- a/modules/applications-create-using-cli-image.adoc
+++ b/modules/applications-create-using-cli-image.adoc
@@ -1,6 +1,6 @@
 // Module included in the following assemblies:
 //
-// * applications/creating-new-applications.adoc
+// * applications/application-life-cycle-management/creating-applications-using-the-cli.adoc
 
 [id="applications-create-using-cli-image-{context}"]
 = Creating an application from an image
diff --git a/modules/applications-create-using-cli-modify.adoc b/modules/applications-create-using-cli-modify.adoc
index 18f63ca737..d890368df5 100644
--- a/modules/applications-create-using-cli-modify.adoc
+++ b/modules/applications-create-using-cli-modify.adoc
@@ -1,6 +1,6 @@
 // Module included in the following assemblies:
 //
-// * applications/creating-new-applications.adoc
+// * applications/application-life-cycle-management/creating-applications-using-the-cli.adoc
 
 [id="applications-create-using-cli-modify-{context}"]
 = Modifying application creation
diff --git a/modules/applications-create-using-cli-source-code.adoc b/modules/applications-create-using-cli-source-code.adoc
index baa2f84ff1..5485fcc06f 100644
--- a/modules/applications-create-using-cli-source-code.adoc
+++ b/modules/applications-create-using-cli-source-code.adoc
@@ -1,9 +1,9 @@
 // Module included in the following assemblies:
 //
-// * applications/creating-new-applications.adoc
+// * applications/application-life-cycle-management/creating-applications-using-the-cli.adoc
 
 [id="applications-create-using-cli-source-code-{context}"]
-= Creating an application from source code 
+= Creating an application from source code
 
 With the `new-app` command you can create applications from source code in a
 local or remote Git repository.
diff --git a/modules/applications-create-using-cli-template.adoc b/modules/applications-create-using-cli-template.adoc
index 1b65cac732..354269d893 100644
--- a/modules/applications-create-using-cli-template.adoc
+++ b/modules/applications-create-using-cli-template.adoc
@@ -1,8 +1,8 @@
 // Module included in the following assemblies:
 //
-// * applications/creating-new-applications.adoc
+// * applications/application-life-cycle-management/creating-applications-using-the-cli.adoc
 
-[id="applications-create-using-cli-template-{context}"]
+[id="applications-create-using-cli-template_{context}"]
 = Creating an application from a template
 
 You can create an application from a previously stored template or from a
diff --git a/modules/odc-accessing-developer-perspective.adoc b/modules/odc-accessing-developer-perspective.adoc
new file mode 100644
index 0000000000..2eec07efac
--- /dev/null
+++ b/modules/odc-accessing-developer-perspective.adoc
@@ -0,0 +1,17 @@
+// Module included in the following assemblies:
+//
+// web-console/odc-about-developer-perspective.adoc
+
+[id="accessing-developer-perspective_{context}"]
+= Accessing Developer Perspective
+
+The *Developer* perspective in the {product-title} web console provides workflows specific to developer use cases.
+
+You can access the *Developer* perspective from the web console as follows:
+
+.Procedure
+
+. Log in to the {product-title} web console using your login credentials. The default view for the {product-title} web console is the *Administrator* perspective.
+. Use the perspective switcher to switch to the *Developer* perspective. The *Topology* view with options to create an application is displayed.
++
+image::odc_developer_perspective.png[Developer Perspective]
diff --git a/modules/odc-connecting-components.adoc b/modules/odc-connecting-components.adoc
new file mode 100644
index 0000000000..30f5ee2f90
--- /dev/null
+++ b/modules/odc-connecting-components.adoc
@@ -0,0 +1,29 @@
+// Module included in the following assemblies:
+//
+// applications/application-life-cycle-management/odc-viewing-application-composition-using-the-topology-view.adoc
+
+[id="odc-connecting-components_{context}"]
+= Connecting components within an application and across applications
+
+In addition to grouping multiple components within an application, you can also use the *Topology* view to connect components with each other.
+You can connect a MongoDB service with a Node.js application as follows:
+
+.Prerequisites
+
+* Ensure that you have created and deployed a Node.js application on {product-title} using the *Developer* perspective.
+* Ensure that you have created and deployed a MongoDB service on {product-title} using the *Developer* perspective.
+
+.Procedure
+
+. Hover over the MongoDB service to see a dangling arrow on the node.
++
+image::odc_connector.png[Connector]
+
+. Click and drag the arrow towards the Node.js component to connect the MongoDB service with it.
+. Click on the MongoDB service to see the *Overview* Panel. In the *Annotations* section, click the edit icon to see the *Key = `app.openshift.io/connects-to`* and *Value = `nodejs-ex`* annotation added to the service.
++
+image::odc_annotation.png[Annotation]
++
+Similarly you can create other applications and components and establish connections between them.
++
+image::odc_connecting_multiple_applications.png[Connecting Multiple Applications]
diff --git a/modules/odc-creating-projects-using-developer-perspective.adoc b/modules/odc-creating-projects-using-developer-perspective.adoc
new file mode 100644
index 0000000000..28db268fc7
--- /dev/null
+++ b/modules/odc-creating-projects-using-developer-perspective.adoc
@@ -0,0 +1,25 @@
+// Module included in the following assemblies:
+//
+// applications/projects/working-with-projects.adoc
+
+[id="odc-creating-projects-using-developer-perspective_{context}"]
+= Creating a project using the Developer perspective in the web console
+
+You can use the *Developer* perspective in the {product-title} web console to create a project in your namespace.
+
+.Prerequisites
+
+* Ensure that you have the appropriate link:https://docs.openshift.com/container-platform/latest/authentication/using-rbac.html#default-roles_using-rbac[roles and permissions] to create projects, applications, and other workloads in {product-title}.
+
+.Procedure
+You can create a project using the *Developer* perspective, as follows:
+
+. In the *Add* view, click the *Project* drop-down menu to see a list of all available projects. Select *Create Project*.
++
+image::odc_create_project.png[Create Project]
+
+. In the *Create Project* dialog box, enter a unique name for the *Name* field. For example, enter `myproject` as the name of the project in the *Name* field.
+. Optionally, add the *Display Name* and *Description* details for the Project.
+. Click *Create*.
+
+Your project is now created and you can add applications and other workloads in to this project.
diff --git a/modules/odc-grouping-multiple-components.adoc b/modules/odc-grouping-multiple-components.adoc
new file mode 100644
index 0000000000..02457c599d
--- /dev/null
+++ b/modules/odc-grouping-multiple-components.adoc
@@ -0,0 +1,34 @@
+// Module included in the following assemblies:
+//
+// applications/application-life-cycle-management/odc-viewing-application-composition-using-the-topology-view.adoc
+
+[id="odc-grouping-multiple-components_{context}"]
+= Grouping multiple components within an application
+
+You can use the *Add* page to add multiple components or services to your project and use the *Topology* page to group applications and resources within an application group.
+The following procedure adds a MongoDB database service to an existing application with a Node.js component.
+
+
+.Prerequisites
+
+* Ensure that you have created and deployed a Node.js application on {product-title} using the *Developer* perspective.
+
+.Procedure
+
+. Create and deploy the MongoDB service to your project as follows:
+.. In the *Developer* perspective, navigate to the *Add* view and select the *Database* option to see the *Developer Catalog*, which has multiple options that you can add as components or services to your application.
+.. Click on the *MongoDB* option to see the details for the service.
+.. Click *Instantiate Template* to see an automatically populated template with details for the MongoDB service, and click *Create* to create the service.
+
+. On the left navigation panel, click *Topology* to see the MongoDB service deployed in your project.
+. To add the MongoDB service to the existing application group, select the *mongodb* Pod and drag it to the application; the MongoDB service is added to the existing application group.
+. Dragging a component and adding it to an application group automatically adds the required labels to the component. Click on the MongoDB service node to see the label `app.kubernetes.io/part-of=myapp` added to the *Labels* section in the *Overview* Panel.
++
+image::odc_app_grouping_label.png[Application Grouping]
+
+Alternatively, you can also add the component to an application as follows:
+
+. To add the MongoDB service to your application, click on the *mongodb* Pod to see the *Overview* panel to the right.
+. Click the *Actions* drop-down menu on the upper right of the panel and select *Edit Application Grouping*.
+. In the *Edit Application Grouping* dialog box, click the *Select an Application* drop-down list, and select the appropriate application group.
+. Click *Save* to see the MongoDB service added to the application group.
diff --git a/modules/odc-importing-codebase-from-git-to-create-application.adoc b/modules/odc-importing-codebase-from-git-to-create-application.adoc
new file mode 100644
index 0000000000..b58430cb38
--- /dev/null
+++ b/modules/odc-importing-codebase-from-git-to-create-application.adoc
@@ -0,0 +1,72 @@
+// Module included in the following assemblies:
+//
+// applications/application-life-cycle-management/odc-creating-applications-using-developer-perspective.adoc
+
+[id="odc-importing-codebase-from-git-to-create-application_{context}"]
+= Importing a codebase from Git to create an application
+
+The following procedure walks you through the *Import from Git* option in the *Developer* perspective to create an application.
+
+Create, build, and deploy an application on {product-title} using an existing codebase in GitHub as follows:
+
+.Procedure
+
+. In the *Add* view, click *From Git* to see the *Import from git* form.
++
+image::odc_import_from_git.png[Import from Git]
+
+. In the *Git* section, enter the Git repository URL for the codebase you want to use to create an application. For example, enter the URL of this sample nodejs application `\https://github.com/sclorg/nodejs-ex`.
+. Optionally, you can click *Show Advanced Git Options*  to add details such as:
+
+* *Git Reference* to point to code in a specific branch, tag, or commit to be used to build the application.
+* *Context Dir* to specify the subdirectory for the application source code you want to use to build the application.
+* *Source Secret* to create a *Secret Name* with credentials for pulling your source code from a private repository.
+
+. In the *Builder* section, select the required builder image to see the details of the builder image. If required, you can change the version using the *Builder Image Version* drop-down list. For example, select the *Node.js* builder image.
+. In the *General* section:
+.. In the *Application Name* field, enter a unique name for the application grouping, for example, `myapp`. Ensure that the application name is unique in a namespace.
+.. The *Name* field to identify the resources created for this application is automatically populated.
++
+[NOTE]
+====
+The resource name must be unique in a namespace. Modify the resource name if you get an error.
+====
+
+. In the *Serverless* section, select *Enable scaling to zero when idle* to create a serverless application that automatically scales your Pods to zero to prevent consumption of resources when idle.
++
+[NOTE]
+====
+The *Serverless* section is displayed in the *Import from git* form only if the *Serverless Operator* is installed in your cluster. For further details refer to documentation on installing OpenShift Serverless.
+====
+
+. In the *Advanced Options* section, the *Create a route to the application* is selected by default so that you can access your application using a publicly available URL. You can clear the check box if you do not want to expose your application on a public route.
+. Optionally, you can use the following advanced options to further customize your application:
+
+Routing::
+Click the *Routing* link to:
+* Customize the hostname for the route.
+* Specify the path the router watches.
+* Select the target port for the traffic from the drop-down list.
+* Secure your route by selecting the *Secure Route* check box. Select the required TLS termination type and set a policy for insecure traffic from the respective drop-down lists.
++
+For serverless applications, the Knative Service manages all the routing options above. However, you can customize the target port for traffic, if required. If the target port is not specified, the default port of `8080` is used.
+
+Build and Deployment Configuration::
+Click the *Build Configuration* and *Deployment Configuration* links to see the respective configuration options. Some of the options are selected by default; you can customize them further by adding the necessary triggers and environment variables. For serverless applications, the *Deployment Configuration* option is not displayed as the Knative configuration resource maintains the desired state for your deployment instead of a DeploymentConfig.
+
+Scaling::
+Click the *Scaling* link to define the number of Pods or instances of the application you want to deploy initially.
++
+For serverless applications, you can:
+
+* Set the upper and lower limit for the number of pods that can be set by the autoscaler. If the lower limit is not specified, it defaults to zero.
+* Define the soft limit for the required number of concurrent requests per instance of the application at a given time. It is the recommended configuration for autoscaling. If not specified, it takes the value specified in the cluster configuration.
+* Define the hard limit for the number of concurrent requests allowed per instance of the application at a given time. This is configured in the revision template. If not specified, it defaults to the value specified in the cluster configuration.
+
+Resource Limit::
+Click the *Resource Limit* link to set the amount of *CPU* and *Memory* resources a container is guaranteed or allowed to use when running.
+
+Labels::
+Click the *Labels* link to add custom labels to your application.
+
+. Click *Create* to create the application and see its build status in the *Topology* view.
diff --git a/modules/odc-interacting-with-applications.adoc b/modules/odc-interacting-with-applications.adoc
new file mode 100644
index 0000000000..e4a06f360f
--- /dev/null
+++ b/modules/odc-interacting-with-applications.adoc
@@ -0,0 +1,20 @@
+// Module included in the following assemblies:
+//
+// applications/application-life-cycle-management/odc-viewing-application-composition-using-the-topology-view.adoc
+
+[id="odc-interacting-with-applications_{context}"]
+= Interacting with the application
+
+The *Topology* view in the *Developer* perspective of the web console provides the following options to interact with the application:
+
+* Click *Open URL* (image:odc_open_url.png[title="Application Link"]) to see your application exposed by the route on a public URL.
+* Click *Edit Source code* to access your source code and modify it.
++
+[NOTE]
+====
+This feature is available only when you create applications using the *From Git*, *From Catalog*, and the *From Dockerfile* options.
+====
++
+If the *Eclipse Che* Operator is installed in your cluster, a Che workspace (image:odc_che_workspace.png[title="Che Workspace"]) is created and you are directed to the workspace to edit your source code. If it is not installed, you will be directed to the Git repository (image:odc_git_repository.png[title="Git Repository"]) your source code is hosted in.
+
+* Hover your cursor over the lower left icon on the Pod to see the name of the latest build and its status. The status of the application build is indicated as *New* (image:odc_build_new.png[title="New Build"]), *Pending* (image:odc_build_pending.png[title="Pending Build"]), *Running* (image:odc_build_running.png[title="Running Build"]), *Completed* (image:odc_build_completed.png[title="Completed Build"]), *Failed* (image:odc_build_failed.png[title="Failed Build"]), and *Canceled* (image:odc_build_canceled.png[title="Canceled Build"]).
diff --git a/modules/odc-labels-and-annotations-used-for-topology-view.adoc b/modules/odc-labels-and-annotations-used-for-topology-view.adoc
new file mode 100644
index 0000000000..b081001694
--- /dev/null
+++ b/modules/odc-labels-and-annotations-used-for-topology-view.adoc
@@ -0,0 +1,15 @@
+// Module included in the following assemblies:
+//
+// applications/application-life-cycle-management/odc-viewing-application-composition-using-the-topology-view.adoc
+
+[id="odc-labels-and-annotations-used-for-topology-view_{context}"]
+= Labels and annotations used for the Topology view
+
+The *Topology* view uses the following labels and annotations:
+
+Icon displayed in the node:: Icons in the node are defined by looking for matching icons using the `app.openshift.io/runtime` label, followed by the `app.kubernetes.io/name` label. This matching is done using a predefined set of icons.
+Link to the source code editor or the source:: The `app.openshift.io/vcs-uri` annotation is used to create links to the source code editor.
+Node Connector:: The `app.openshift.io/connects-to` annotation is used to connect the nodes.
+App grouping:: The `app.kubernetes.io/part-of=<appname>` label is used to group the applications, services, and components.
+
+For detailed information on the labels and annotations {product-title} applications must use, see link:https://github.com/gorkem/app-labels/blob/master/labels-annotation-for-openshift.adoc[Guidelines for labels and annotations for OpenShift applications].
diff --git a/modules/odc-scaling-application-pods-and-checking-builds-and-routes.adoc b/modules/odc-scaling-application-pods-and-checking-builds-and-routes.adoc
new file mode 100644
index 0000000000..473cce357f
--- /dev/null
+++ b/modules/odc-scaling-application-pods-and-checking-builds-and-routes.adoc
@@ -0,0 +1,23 @@
+// Module included in the following assemblies:
+//
+// applications/application-life-cycle-management/odc-viewing-application-composition-using-the-topology-view.adoc
+
+[id="odc-scaling-application-pods-and-checking-builds-and-routes_{context}"]
+= Scaling application pods and checking builds and routes
+
+The *Topology* view provides the details of the deployed components in the *Overview* panel. You can use the *Overview* and *Resources* tabs to scale the application Pods, check build status, services, and routes as follows:
+
+
+* Click on the component node to see the *Overview* panel to the right. Use the *Overview* tab to:
+
+** Scale your Pods using the up and down arrows to increase or decrease the number of instances of the application manually. For serverless applications, the Pods are automatically scaled down to zero when idle and scaled up depending on the channel traffic.
+** Check the *Labels*, *Annotations*, and *Status* of the application.
+
+* Click the *Resources* tab to:
+
+** See the list of all the Pods, view their status, access logs, and click on the Pod to see the Pod details.
+** See the builds, their status, access logs, and start a new build if needed.
+** See the services and routes used by the component.
+
++
+For serverless applications, the *Resources* tab provides information on the revision, routes, and the configurations used for that component.
diff --git a/modules/odc-viewing-application-topology.adoc b/modules/odc-viewing-application-topology.adoc
new file mode 100644
index 0000000000..278f629a9e
--- /dev/null
+++ b/modules/odc-viewing-application-topology.adoc
@@ -0,0 +1,24 @@
+// Module included in the following assemblies:
+//
+// applications/application-life-cycle-management/odc-viewing-application-composition-using-the-topology-view.adoc
+
+[id="odc-viewing-application-topology_{context}"]
+= Viewing the topology of your application
+
+You can navigate to the *Topology* view using the left navigation panel in the *Developer* perspective. After you create an application, you are directed automatically to the *Topology* view where you can see the status of the application Pods, quickly access the application on a public URL, access the source code to modify it, and see the status of your last build.
+
+A serverless application is visually indicated with the Knative symbol (image:odc_serverless_app.png[title="Serverless Application"]). You can zoom in and out to see more details for a particular application.
+
+The status or phase of the Pod is indicated by different colors and tooltips as *Running* (image:odc_pod_running.png[title="Pod Running"]), *Not Ready* (image:odc_pod_not_ready.png[title="Pod Not Ready"]), *Warning*(image:odc_pod_warning.png[title="Pod Warning"]), *Failed*(image:odc_pod_failed.png[title="Pod Failed"]), *Pending*(image:odc_pod_pending.png[title="Pod Pending"]), *Succeeded*(image:odc_pod_succeeded.png[title="Pod Succeeded"]), *Terminating*(image:odc_pod_terminating.png[title="Pod Terminating"]), or *Unknown*(image:odc_pod_unknown.png[title="Pod Unknown"]).
+For more information about pod status, see the link:https://kubernetes.io/docs/concepts/workloads/pods/pod-lifecycle/#pod-phase[Kubernetes documentation].
+
+After you create an application and an image is deployed, the status is shown as *Pending*. After the application is built, it is displayed as *Running*.
+
+image::odc_application_topology.png[Application Topology]
+
+The application resource name is appended with indicators for the different types of resource objects as follows:
+
+* *DC*: DeploymentConfigs
+* *D*: Deployment
+* *SS*: StatefulSet
+* *DS*: Daemonset
diff --git a/web-console/images b/web-console/images
new file mode 120000
index 0000000000..e4c5bd02a1
--- /dev/null
+++ b/web-console/images
@@ -0,0 +1 @@
+../images/
\ No newline at end of file
diff --git a/web-console/modules b/web-console/modules
new file mode 120000
index 0000000000..43aab75b53
--- /dev/null
+++ b/web-console/modules
@@ -0,0 +1 @@
+../modules/
\ No newline at end of file
diff --git a/web-console/odc-about-developer-perspective.adoc b/web-console/odc-about-developer-perspective.adoc
new file mode 100644
index 0000000000..f662c84049
--- /dev/null
+++ b/web-console/odc-about-developer-perspective.adoc
@@ -0,0 +1,26 @@
+[id="odc-about-developer-perspective"]
+= About the Developer perspective in the web console
+include::modules/common-attributes.adoc[]
+:context: odc-about-developer-perspective
+toc::[]
+
+The {product-title} web console provides two perspectives; the *Administrator* perspective and the *Developer* perspective.
+
+The *Developer* perspective provides workflows specific to developer use cases, such as the ability to:
+
+* Create and deploy applications on {product-title} by importing existing codebases, images, and dockerfiles.
+* Visually interact with applications, components, and services associated with them within a project and monitor their deployment and build status.
+* Group components within an application and connect the components within and across applications.
+* Integrate serverless capabilities (Technology Preview).
+* Create workspaces to edit your application code using Eclipse Che.
+
+.Prerequisites
+
+To access the *Developer* perspective, ensure that you have xref:../web-console/web-console.adoc#web-console[logged in to the web console].
+
+include::modules/odc-accessing-developer-perspective.adoc[leveloffset=+1]
+
+.Additional resources
+
+* xref:../applications/application-life-cycle-management/odc-creating-applications-using-developer-perspective.adoc#odc-creating-applications-using-developer-perspective[Creating and deploying applications on {product-title} using the *Developer* perspective]
+* xref:../applications/application-life-cycle-management/odc-viewing-application-composition-using-topology-view.adoc#odc-viewing-application-composition-using-topology-view[Viewing the applications in your project, verifying their deployment status, and interacting with them in the *Topology* view].