feat: initiation-manual and create-interface updates

modules/applications/pages/create-an-interface.adoc

@@ -1,7 +1,40 @@
 = Create an interface
 :description:
 
-[NOTE]
-====
-For Subscription editions only.
-====
+Once you have downloaded and launch Bonita UI Builder, it's time to create your interface! 
+To do so, we will create a new application and move visual elements (also known as widgets) on the screen.
+On this page, we will try to create a form where customers can submit a claim. This is inspired by the Getting Started tutorial's xref:getting-started:create-web-user-interfaces.adoc[example].
+
+
+== Pre-requisites 
+* Bonita UI Builder downloaded and launched
+* A working Bonita project with a defined process diagram, BDM, and contract. Follow the xref:getting-started:getting-started-index.adoc[Getting Started tutorial] if you need any help
+
+
+== Create a new application
+From Bonita UI Builder's home page, click the top right `Create new` button. Then, select `Application`.
+You land on the design interface:
+
+image::images/create-an-interface/design-interface.PNG[design-interface]
+
+Describe
+On the left part can be found all widgets (visual elements) that you can drag and drop anywhere you want on the central part. 
+This is also where you can define your API requests (`Queries` tab) that will help you connect your widgets to your Bonita process, see xref:applications:interact-with-your-bonita-process.adoc[next section] for more details.
+
+On the right part, you can configure your widgets' properties as well as preview how the interface renders on different screen size.
+
+The central part is the canvas where you set visual elements and define what your interface will look like.
+
+== Design the interface
+
+Select a `form` widget, and drag and drop it on the central part:
+
+image::images/create-an-interface/drag-and-drop.gif[drag-and-drop]
+
+Now, drag and drop an `input` widget inside the form widget. This is what is should look like:
+
+image::images/create-an-interface/first-form.PNG[first-form]
+
+Your first interface is designed!
+
+In the next section, we’ll see how we can connect this interface and its elements to your Bonita project, so that it allows for submitting a claim and creating a process instance.

modules/applications/pages/initiation-manual.adoc

@@ -1,7 +1,43 @@
-Initiation Manual
+= Initiation Manual
 :description:
 
-[NOTE]
-====
-For Subscription editions only.
-====
+
+Bonita UI Builder allows for designing all kind of interfaces, forms and pages, without distinction. These interfaces interact with your Bonita process and BDM. 
+
+The initiation manual describes all the mandatory steps to successfully push your interfaces to production: from downloading Bonita UI Builder to running your applications. 
+
+
+[.card-section]
+== Sections
+
+[.card.card-index]
+--
+xref:download-and-launch.adoc[[.card-title]#Download and launch# [.card-body.card-content-overflow]#pass:q[Steps to download and launch Bonita UI Builder]#]
+--
+
+[.card.card-index]
+--
+xref:create-an-interface.adoc[[.card-title]#Create an interface# [.card-body.card-content-overflow]#pass:q[Steps to set the visual elements of your interface]#]
+--
+
+[.card.card-index]
+--
+xref:interact-with-your-bonita-process.adoc[[.card-title]#Interact with your Bonita process# [.card-body.card-content-overflow]#pass:q[Steps to bind your process data to your visual elements]#]
+--
+
+[.card.card-index]
+--
+xref:builder-declare-interface-in-bonita.adoc[[.card-title]#Declare the interface in Bonita# [.card-body.card-content-overflow]#pass:q[Steps to declare your Bonita UI Builder interface in your Bonita project]#]
+--
+
+[.card.card-index]
+--
+xref:package-and-deploy-your-application.adoc[[.card-title]#Package and deploy your application# [.card-body.card-content-overflow]#pass:q[Steps to package your interface in an application and push it to production]#]
+--
+
+[.card.card-index]
+--
+xref:next-steps.adoc[[.card-title]#Next steps# [.card-body.card-content-overflow]#pass:q[Steps to smoothly operation your application]#]
+--
+
+[.card-section]