Before we Begin ... Let's SAY "Hello!"

• Where are you from?
• Have you used the Webform module?
• What do you want to learn about today?
• Review the slides before the presentation

Post your questions in the Q&A channel

​

Hello!

Hi, my name is Jacob Rockowitz.

• I am known as jrockowitz on the web.
• I am a Drupal developer and software architect.
• I built and maintain the Webform module for Drupal.

Creating a Webform project plan

my Goal is to �help you ask the right questions...

...and to answer any of your questions

Good plans Start with a kick-off

I want to�ensure the successful implementation of an organization's webforms by providing a thought-out and flexible project plan

As with most websites, this is a work-in-progress

As with most �project plans & �Open source, this is a �collaborative effort

Why do we want to have a Webform project plan?

• Drupal is becoming the foundation for Digital Experience Platforms (DXP).
• Forms and surveys are a key part of a DXP.
• Forms and surveys engage users and �collect data.

​

​

To create a successful DXP, you want to...

• Know your user requirements
• Understand your platform's capabilities
• Plan for the future

​

​

What is the �Webform module's �out of the box capabilities?

THE USE CASE for the WEbform module

BUILD

COLLECT

DISTRIBUTE

<demo>

Gathering requirements

Gathering �requirements �is about �Asking the �right questions

Form users & usage

• Who are the end users?
• Are anonymous or authenticated users completing the forms?
• What is the expected number of forms and inputs per form?
• What is the expected number of submissions per hour or day?

Access management

• Who has access to what?
• What are the key roles related to webforms?
• Are there dedicated form builders, submission administrators, reviewer roles?

Form building

• Who is building webforms?
• What is the experience level of the �form builders?
• Do the form builders know HTML, CSS, JS, Twig, YAML, and even Drupal's Form API?

Data management

• How should submission data be stored?
• Should submissions data be stored inside or outside Drupal?
• Should the submission data be encrypted?
• How long should submission data be stored?
• What is the submission data flow diagram?

Submission administration

• How are submission going to be managed?
• Can users view and even update their �previous submissions?
• What are submission administrators going to be doing with the collected data?
• Do submissions need to be annotated and flagged?

Design and UX

• How are the forms going look-n-feel?
• What is the theme or design system?
• What is the ideal user experience for someone completing a form?
• Does the look-n-feel of forms vary from use case to use case? (i.e. Long forms vs short forms)

Accessibility

• What level of accessibility is required for forms?
• How is accessibility going to be reviewed �and monitored?

What are

we going �to build?

How about �an application �Evaluation System?

<demo>

Writing �User Stories

"a user story is an �informal, natural language description of features �of a software system"�https://en.wikipedia.org/wiki/User_story

​

Site Visitor

• As a site visitor, I want to be able to easily understand and complete a webform in a few minutes.
• As a site visitor, I want to be able to manage my submissions.

Form builder

• As a form builder, I want the appropriate notified user, via email, when a form is submitted.
• As a form builder, I want to assign users different permissions and roles.
• As a form builder, I want to be able to archive old webforms and submissions.

Submission reviewer

• As a submission reviewer, I want to sort and filter submissions.
• As a submission reviewer, I want to flag, annotate, and add notes to submissions.
• As a submission reviewer, I want to download submissions as a CSV and PDF.

Documenting�project specifications

Project specifications defineS the system's features, functionality, & expectations

User roles & access controls

• Roles & Permissions
• Form & Submission Access
• Element & Container Access

DefininG�WebFORM Permissions

Setting�FORM & submission�level Access Controls

Allowing�element level Access Controls

Form types

• Multi-step (wizard and cards)
• Behaviors (prepopulation, autofill, preview)
• Shared (Embedded via an iframe)
• Templates

Breaking down long forms into Multiple-steps

Improve a form's�USEr Experience �by ADjusting�form�Behaviors

Forms can be shared �with external websites

WEbform Templates�provide a starting point & can also be used as examples

Form placement

Node

Webforms can be attached to a node with the node's form submissions collected in a dedicated 'Results' tabs.

​

Block

Webforms can be placed on your site as a block. The URL and source entity for each submission is automatically tracked.

Custom

Webforms can be added to a render array, which can be easily altered using custom hooks and/or plugins.

​

placing webform blocks

Creating webform Nodes

Form Elements

• Basic inputs
• Advanced inputs
• Composites
• Validation
• Condition logic

There is a style-guide �which shows�every available webform element

CompoSite elements�Are multiple inputs grouped together

Perform calculations using Computed elements

Respond �to user interaction�By leveraging�conditional�logic

COnfirmations, notifications, & Distribution

• Display confirmation messages
• Send email notifications and confirmations
• Remote post data to external applications

DIsplaying a

confirmation

message

send & route emails�using an �Email Handler

send submission data out �of drupal using a Remote post handler

form Design

• Building a theme
• Adding custom CSS & JavaScript
• Injecting inline class name, styles, �and attributes

Use the style-guide �to review �your theme

define�Custom �classes,�Styles,�& Attributes

Adding�Custom �CSS & Javascript

Submission manageMent

• Set submission limits
• Flag submission
• Automatically purge submission
• Defining a workflow

Managing submissions

submission behaviors

​

building a submission workflow

​

Form & Submission archiving

• Generate PDFs
• Download submissions as a CSV
• Export webform configuration

​

Generating PDFS

download �(or upload) submissions

Exporting webform configuration

Tracking & Testing

• Analytics
• Automated testing
• Performance testing

​

​

webform analytics

Tests confirm�expectations

The webform module has a lot of tests which you can leverage in your custom projects

Moving �Forward

Common mistakes

• Making assumptions
• Building over-complicated forms
• Not asking the right questions
• Not writing automated tests
• Not performing load testing

​

​

Getting help

• Documentation, Cookbook, & Screencasts�https://www.drupal.org/docs/8/modules/webform

​

• Drupal Answers �http://drupal.stackexchange.com

​

• Webform Issue Queue�https://www.drupal.org/project/issues/webform?version=8.x

​

Get

involved

​

Fund development

​

hire me for professional support

opencollective.com/webform

to drupal �or not to drupal...

jrockowitz.com