We.Gov and We.Finance reference site walkthrough

Pre-requisites

Set up the reference site as described in Set up and configure We.Gov and We.Finance reference site.

User Story

• AEM Forms

  • Automated Forms Conversion
  • Authoring
  • Form Data Models/Data Sources

• AEM Forms

  • Data Capture
  • (Optional) Data Integration (MS Dynamics)
  • (Optional) Adobe Sign

• Workflow

• Email Notifications

• (Optional) Customer Communications

  • Print Channel
  • Web Channel

• Adobe Analytics

• Data Source Integrations

Fictitious users and groups

The We.Gov demo package comes with the following built-in fictitious users:

• Aya Tan: Citizen eligible for a Service from a Government agency

• George Lang: We.Gov agency Business Analyst

• Camila Santos: We.Gov Agency CX Lead

The following groups are also included:

• We.Gov Forms Users

  • George Lang (member)
  • Camila Santos (member)

• We.Gov Users

  • George Lang (member)
  • Camila Santos (member)
  • Aya Tan (member)

Demo overview terms legend

1. Impersonate: Defined Users & Groups in AEM demo.

2. Button: Colored rectangle or circled arrow for navigating.

3. Click: To execute an action in the user story.

4. Links: Located at the top of the main menu in We.Gov site.

5. User Instructions: A set of numerical steps to follow when navigating through the user’s story.

6. Forms Portal: https://<aemserver>:<port>/content/we-gov/formsportal.html

7. Mobile View:We.Gov user to replicate a mobile view with a re-sized browser.

8. Desktop View: We.gov user to view demo on a laptop or desktop.

9. Pre-screener Form: Form on the Home page of the We.Gov site.

10. Adaptive Form: Enrollment application form for We.gov demo.

    https://<aemserver>:<port>/content/forms/af/adobe-gov-forms/enrollment-application-for-health-benefits.html

11. Adobe We.Gov Site: https://<aemserver>:<port>/content/we-gov/home.html

12. Adobe Inbox: Located top menu bar Bell icon in AEM backend.

    https://<aemserver>:<port>/aem/start.html

13. Email Client: Preferred way to view your emails (Gmail, Outlook)

14. CTA: Call to action

15. Navigate: To locate a specific reference point on the browser page.

16. AFC: Automated Forms Conversion

Automated Forms Conversion (Camila)

This section: Camila the CX Lead has an existing PDF based form that was used as part of a paper-based process. As part of a modernization effort she wants to use this PDF form to automatically create a new modern Adaptive Forms.

Automated Forms Conversion - We.Gov (Camila)

1. Navigate to https://<aemserver>:<port>/aem/start.html

2. Login with:

   • User: camila.santos
   • Password: password

3. From the main page select Forms > Forms & Documents > AEM Forms We.gov Forms > AFC.

4. Camila uploads the PDF to AEM Forms.

   

5. Camilla then selects the PDF form and clicks Start Automated Conversion to start the conversion process. You may need to click Overwrite conversion if you have converted the form.

   NOTE

   Note that the settings in AFC are preconfigured for the end user which means that they should not be altered.

   • Optional: If you wish to use the Accessible Ultramarine theme, simply click on the Specify an adaptive form theme and select the Accessible-Ultramarine theme that appears in the list of options.

   

   

   The percentage complete status displays during conversion. Once the status displays Converted, click the output folder, select the adaptive form and click Edit to open the converted form.

6. Camilla then reviews the form and makes certain that all fields are present

   

7. Camilla then starts to edit the form. She selects Root Panel > Edit (the wrench) > selects Tabs on Top from the Panel Layout dropdown menu > selects the Check box.

   

8. Camilla then adds all the necessary CSS and field alterations to produce the final product.

   

Form Data Model & Data Sources (Camila)

This section: Once the document has been converted and produced an Adaptive Form, Camila then needs to connect the Adaptive Form to a datasource.

1. Camila opens the Properties on the form that was converted in Automated Forms Conversion - We.Gov.

2. Camila then selects Form Model > Selects Form Data Model from Select From dropdown > Selects We.gov Enrollment FDM from the list of option.

3. Clicks on the Save & Close button.

   

4. Camila clicks the output folder, selects the adaptive form and clicks Edit to open the completed We.Gov form.

5. Camila selects an adaptive form field and clicks . She creates binding with the form data model entities using the Bind Reference field. She repeats this step for all fields in the adaptive form.

Form Accessibility Testing (Camila)

Camila also validates that the created content is built correctly and fully accessible according to corporate standards.

1. Camila clicks the output folder, selects the adaptive form and clicks Preview to open the completed We.Gov form.

2. Opens the Audit tab within the Chrome Developer Tool.

3. Performs an Accessibility check in order to validate the adaptive form.

   

Adaptive Form Mobile View Demo (Aya)

This section must be performed ahead of the demonstration.

User Instructions:

1. Navigate to: https://<aemserver>:<port>/content/we-gov/home.html

2. Login with:

   1. User: aya.tan
   2. Password: password

3. Re-size the browser window or use the browser’s emulator to replicate a mobile device size.

We.Gov Website (Aya)

This section: Aya is a citizen. She hears from a friend that she may be eligible to receive a Service from a government agency. Aya navigates to the We.Gov website from her mobile phone to learn more about services she is eligible for.

We.Gov Pre-Screener (Aya)

Aya answers a few questions to confirm her eligibility by filling out a short adaptive form on her mobile phone.

User Instructions:

1. Make a selection in each dropdown field.

   NOTE

   If the user earns more than $200,000/yr, they aren’t eligible.

2. Click the “Am I Eligible?” button.

3. Click the “Apply Now” button to proceed.

   

We.Gov Adaptive Form (Aya)

Aya finds out she is eligible and begins filling her application to request service on her mobile device.

Aya needs to review some documents at home before she can complete the service request application. She saves and exits the application from her mobile device.

User Instructions:

1. Fill out the Basic information fields, the following are required fields and dropdowns:

   1. Basic Information

      1. First Name
      2. Last Name
      3. DOB
      4. Email

2. Use the following dynamic logic to demonstrate dynamic feature using the Family Status dropdown:

   1. Single: Show next of kin panel

   2. Married: Show marital dependant panel

   3. Divorced: Show next of kin panel

   4. Widowed: Show next of kin panel

   5. Do you have Children?: (Yes/No) radio button to show child dependant panel.

      1. (Add/Remove) button to add/remove multiple child dependant panels.

3. Click the right arrow in the gray menu bar.

4. Click the Save button at the bottom.

   

Desktop demo

This section: Back at home, Aya has found the information she needed and resumes the application from her desktop. Aya navigates to the online forms portal to resume her application. With some simple customization, agencies can also automatically generate and email a link to resume the application.

Continued Adaptive Form (Aya)

User Instructions:

1. Navigate to https://<aemserver>:<port>/content/we-gov/home.html

2. From the navigation bar, select click on “Online Services”.

3. From the “Draft Forms” panel, select the existing “Enrollment Application For Health Benefits”.

   

   The look and feel are the same, and she does not need to re-enter any data.

   User Instructions:

4. Click right Circle CTA to move to the next section.

   

   The form is populated up to the point of Aya’s last entry. Aya has entered all her information and is ready to submit.

   

   NOTE

   When Aya fills out the phone number field she must fill it as a continuous 11 digit number with no dashes, spaces or hyphens.

   After submitting Aya receives a Thank You page. Optionally she will also receive an email that she can open to sign the document of record electronically with Adobe Sign.

Optional: Adobe Sign (Aya)

User Instructions:

1. Navigate to your Email Client and find the Adobe Sign email.

2. Click on the link to Adobe Sign.

   

User Instructions:

1. Check the “I agree” box.

2. Click “Accept”.

3. Scroll to the bottom of the reviewed document.

4. Click on the highlighted yellow tab to sign the document.

   

Government agent (George)

This section: George is a business analyst at the government agency Aya is a requesting a service from. George has a single dashboard where he can see all service request applications that have been assigned to him for review.

AEM Inbox (George)

User Instructions:

1. Navigate to https://<aemserver>:<port>/aem/start.html

2. Click on the user icon (top right-hand corner) and use the “Sign Out”, or the “Impersonate as” menu option if you are currently logged in with an administrative user.

   1. Login with:

      1. User: george.lang
      2. Password: password

   2. Or Impersonate:

      1. Type “George” in the “Impersonate as” field.

      2. Click okay to impersonate.

3. From the top right corner, click the Notification (bell) Icon.

4. Click “View All” to navigate to the Inbox.

5. From the Inbox, open the latest “Health Benefits Application Review” task.

   

Optional: AEM Inbox & MS Dynamics (George)

Thanks to data integrations and automated workflows, Aya’s application appears, along with a CRM record that has automatically been generated when the data was submitted.

User Instructions:

1. Open and inspect the read-only adaptive form.

2. Click on the “Open MS Dynamics” button to open the MS Dynamics record in a new window.

3. In the CRM you can see all information can be updated

   1. Optionally, add some review notes directly in Dynamics.

4. Close and return to AEM Inbox.

   

Back to AEM Inbox (George)

George approves Aya’s application, and thanks to an existing automated workflow a confirmation email is also sent to Aya.

User Instructions:

1. Navigate to the top left corner and click “Approve” to approve the application.

2. In the modal, you can leave a message for the CX lead.

3. Click Done.

4. (Citizen role) Open up your email client to view the email sent to Aya.

   

CX Lead (Camila)

This section: Camila the CX Lead sets up a welcome phone call with Aya to explain how to make use of the government services she has been approved for.

(Optional) AEM Inbox & MS Dynamics

User Instructions:

1. Navigate to https://<aemserver>:<port>/aem/start.html

2. Click on the user icon (top right-hand corner) and use the “Sign Out”, or the “Impersonate as” menu option if you are currently logged in with an administrative user.

   1. Login with:

      1. User: camila.santos
      2. Password: password

   2. Or Impersonate:

      1. Type “Camila” in the “Impersonate as” field.

      2. Click okay to impersonate.

3. From the top right corner, click the Notification (bell) icon.

4. Click “View All” to navigate to the Inbox.

5. From the Inbox, open the latest “New Contact Approval” task.

(Optional) User Instructions:

1. Open and inspect the read-only adaptive form.

2. Click on the “Open MS Dynamics” button to open the MS Dynamics record in a new window.

3. In the CRM you can see all information can be updated

   1. Optionally, add a new call activity directly in Dynamics.
   2. Open the “Activities” section.
   3. Click on the “New Phone Call” option.
   4. Add phone call details.
   5. Save and close the window.

4. Back in AEM, navigate to the top left corner and click “Submit” to submit the application.

5. In the modal, you can leave a message.

6. Click Done.

   

(Optional) Welcome Kit Citizen (Aya)

This section: Aya receives an email contains a link to an interactive communication which summarizes her benefits and also includes form fields to fill. With PDF benefits statement attached and link to interactive communication letter in the mail (with the same theme/branding as the interactive communication).

Email Client Notification (Aya)

User Instructions:

1. Locate and open the Welcome Kit email.

2. Scroll to PDF attachment at the bottom of the page.

3. Click to open the PDF attachment.

4. Scroll back up in your email client and click on “View welcome kit online”.

   1. This will open the web channel version of the same document.

5. For a quick reference to PDF directly:

   https://<aemserver>:<port>/aem/formdetails.html/content/dam/formsanddocuments/adobe-gov-forms/welcome-handbook/we-gov-welcome-handbook

6. For a quick reference to IC directly:

   https://<aemserver>:<port>/content/dam/formsanddocuments/adobe-gov-forms/welcome-handbook/we-gov-welcome-handbook/jcr:content?channel=web&mode=preview&wcmmode=disabled

   

Renewal Reminder citizen (Aya)

This section: Camila also schedules a communication reminder so one year later. (Workflow Step that automates/executes and email).

Email Client Notification (Aya)

User Instructions:

1. Navigate to your email client.

2. Locate and open the Renewal Reminder email.

3. Click on the “Submit a new application” button to open the adaptive form.

   1. This section is intentionally left empty to support data pre-fill in phase 2.

   

(Optional) Form Data Model (Camila)

This section: Camila navigates to AEM Forms Data Integrations where she can run a quick test to see that the information sent to the external data source via Form Data Model integration is indeed present.

Form Data Model (Camila)

This section: Camila navigates to the Data Sources page to validate the data that the server has replicated within the Derby database.

1. Once the user experience is complete and the user submission has been completed Camila navigates to the Data Sources tab within AEM Forms (Forms > Data Integrations)

2. Camila then selects AEM Forms We.gov FDM and then edit the We.gov Enrollment FDM.

3. Camila then selects the Contact > Read Service to be tested.

   

4. Camila then provides the test service with a contact id and then clicks on Test button. For example, 1 or 2, if you submitted the form. If you have not submitted the form, no data is returned.

   

5. Camila can then validate that the data has successfully been inserted into the datasource.

   • The data within the Derby DS resembles the following format:

      [
         {
         "ADDRESS_COUNTRY": "USA",
         "LAST_NAME": "Tan",
         "ADDRESS_CITY": "New York",
         "FIRST_NAME": "Aya",
         "ADDRESS_STATE": "AL",
         "ADDRESS_LINE1": "123 Street crescent",
         "GENDER_CODE": "2",
         "ADDRESS_LINE2": "123 Street crescent",
         "ADDRESS_POSTAL_CODE": "90210",
         "BIRTH_DATE": "1991-12-12",
         "CONTACT_ID": 1,
         "MIDDLE_NAME": "M",
         "HAS_CHILDREN_CODE": "0"
         }
   ]
   

(Optional) Analytics (Camila)

This section: Camila navigates to a dashboard where she can see across the agency KPI’s such as % of citizens who start filling a service request form and abandon, the average length of time from request submission to approval/denial response, and engagement statistics for the benefits handbooks she has sent to citizens.

Adobe Analytics Sites Reporting (Camila)

1. Navigate to https://<aemserver>:<port>/sites.html/content

2. Select the “AEM Forms We.Gov Site” to view the site pages.

3. Select one of the site page (e.g. Home), and choose “Analytics & Recommendations”.

   

4. On this page, you will see fetched information from Adobe Analytics which pertains to the AEM Sites page (NOTE: by design this information is periodically refreshed from Adobe Analytics and is not displayed in real-time).

   

5. Back on the page view page (accessed in step 3.), you can also view the page view information by changing the display setting to view items in the “List View”.

6. Locate the “View” dropdown menu and select “List View”.

   

7. From the same menu, select “View Setting” and select the columns you wish to display from the “Analytics” section.

   

8. Click “Update” to make the new columns available.

   

Adobe Analytics Forms Reporting (Camila)

1. Navigate to

   https://<aemserver>:<port>/aem/forms.html/content/dam/formsanddocuments/adobe-gov-forms

2. Select the “Enrollment Application For Health Benefits” adaptive form and select the “Analytics Report” option.

   

3. Wait for the page to load, and view the Analytics report data.

   

Business.Adobe.com resources

Ecommerce Integrations Content Insights Cms Cloud Version History Content Management Headless Cms