Building Online Forms with Microsoft 365 – From Quick and Easy to More Complex

When it comes to building forms and the associated workflows that go along with them, the options available are endless. One only has to do a quick online search to find dozens of effective solutions – many of them no-code that require minimal technical knowledge. Because our solutions leverage Microsoft technologies, we tend to use the form builders that are part of the Microsoft 365 stack and integrate with other line of business applications – that is, unless a complete custom build is necessary. This article describes some of the forms solutions that we regularly use – both internally by our own business, and as part of solutions that we build for our clients. 

Microsoft Forms 

Microsoft Forms (forms.office.com), part of the Microsoft 365 suite, is a simple application that allows you to easily create surveys, polls and quizzes. Users are invited to respond by web browser or mobile device, and results are available in real time. Microsoft Forms integrates with SharePoint and Power Automate (Flow) and can be shared externally. You can use the built-in analytics or export the results to Excel for further analysis. What we love about Microsoft Forms is its simplicity. Need a quick office poll or a tool to collect customer feedback? Microsoft Forms is a good option.

Dynamics 365 Customer Voice 

Building on Microsoft Forms, Microsoft Forms Pro has evolved into Dynamics 365 Customer Voice (https://dynamics.microsoft.com/en-ca/customer-voice). This is an enterprise-grade survey tool that is powered by Microsoft 365 and Dynamics 365. It works really well for eliciting customer feedback, and customized activity-driven surveys are a good way of gauging satisfaction in real time and driving results.  

Deep integration with Dynamics 365 means that surveys can be personalized and automated for your customer base and sales model. Users can be notified when defined satisfaction metrics are registered, and act quickly to resolve issues before it’s too late. What we like about the platform is that it comes with a number of ready-to-use survey templates with default questions for different scenarios that can be customized and branded quite easily.  Where it really shines is the built-in integration between Dynamics 365, Microsoft Power Apps, Power BI and Power Automate for third-party applications. Results are presented in graphical format displaying trends and can be exported and drilled down to individual responses so that a holistic view can be created for customers. 

Power Apps 

Power Apps (https://powerapps.microsoft.com/en-us/), another component of the core Microsoft 365 suite, is a development tool for creating web and mobile friendly apps that connect to a variety of services, including SharePoint Online, other Microsoft products, and a wide variety of third-party software. Incorporating Power Automate (Flow) allows emails to be sent, approvals to be managed, and complex workflows to be defined as part of the solution.  

Power Apps allows power users or citizen developers to create sophisticated forms. However, it also offers experienced developers so many options for customizing form functionality and appearance and enhancing the end user experience, particularly on mobile devices.  

Envision IT recently developed some custom forms for a client as part of their Finance Help System. P-Card and Petty Cash requests, previously submitted as paper-based forms, were turned into electronic forms with Power Apps and Power Automate. Employees complete the relevant form which pulls their data from the organization’s PeopleSoft and Active Directory using standard connectors. A two-stage approval workflow routes the requests to the employee’s Manager, then to Finance for final approval and back to the employee once complete. Requests are published to a SharePoint list which is visible to the employee, their manager and Finance. A reporting dashboard allows Finance an all-up view of the state of submissions. 

Adaptive Cards with Input Forms 

Adaptive Cards (https://adaptivecards.io/) are an open card exchange format that enables developers to exchange UI content in a common and consistent way. Card Authors describe their content as a simple JSON object, and the content then gets rendered in the format of the host application, taking on the look and feel of that application. Cards can include input controls like buttons for gathering information from the end user, and a single format can be reused in multiple places.  

Adaptive Cards are used extensively with Bot framework integration. With the Bot Framework you can write a single bot that is able to chat with users across multiple channels like Microsoft Teams, Windows Notifications and Timeline, Cortana, Bot Framework’s web chat and Outlook’s actionable messages. When integrated with Power Automate and/or Logic Apps, adaptive cards can either share information or collect data via a form with a connected data source 

In Microsoft Teams, adaptive cards may be used as a Flow bot to direct messages to an individual user or to a channel. Messages are presented in the recipient’s chat or activity feed and may be configured to continue a flow after a response is received. Why use Adaptive Cards? If you’re looking for consistency and professionalism in the way you present messaging to users in Microsoft Teams and elsewhere, this is a good option for triggered messages, polls, collecting feedback and surveys. 

Our President Peter Carson has written a blog on Adaptive Cards with Outlook Actionable Messages – see https://blog.petercarson.ca/posts/adaptive-cards-outlook-actionable-messages-lab-notes  

SPFx React Form 

When we get into the area of custom form development, the SharePoint Framework (SPFx) allows developers to build modern responsive apps and forms that integrate with SharePoint data. It is framework-agnostic, so open source tools such as React, Handlebars, Knockout, Swagger and Angular can all be leveraged, depending on the form requirements on the client side.   These are all industry standard open source frameworks for creating forms and single page application web development. 

This form type is used in the request portion of Envision IT’s open source Teams and Site Provisioning Solution. The solution provides a streamlined way for organizations to create SharePoint sites and Microsoft Teams while maintaining appropriate structure and governance site wide. 

End users are presented with a SPFx web part form so that they can self-serve the request, which tracks to a SharePoint list and the option is there to include an approval workflow.  

When our Envision IT employees request a SharePoint site for a new client, an Azure Logic App workflow kicks off with Azure Automation provisioning PowerShell scripts. Creating a new Microsoft Team for our client also provisions an Office 365 Group, a OneNote Notebook, Stream Group and Planner Plan. We take this a step further by using Channels in Teams for each new client project. Creating a channel in the Team also creates a folder in SharePoint for the project, a new Section in OneNote, a new Channel in Stream and a new Plan in Planner. You can download the Whitepaper that our President Peter Carson has written on the topic at Teams and Site Provisioning.   

HTML Forms 

Business requirements sometimes dictate that a full custom form development is required.  Custom forms however are not net new builds for each form that we create for our clients.  We have standardized on an HTML/JavaScript structure for the form template itself, and a REST API for the back-end components.  We typically leverage open source frameworks such as Handlebars, Knockout, or Angular as referenced above.  We build the REST APIs in Visual Studio as WebAPIs, which allows us to integrate with other back end systems, and to implement more complex business rules such as field level security. This is done by accessing SharePoint through the app pool account, and not requiring the end user to have permissions to the underlying SharePoint list. 

Built properly, this custom approach allows us to build a framework once, and then leverage it for multiple forms.  Designed appropriately, the REST API can support future requirements, and forms can be modified, or new forms created simply by editing the HTML form, without requiring Visual Studio or deploying new server-side code. 

One example of a complex custom HTML form and workflow solution that we developed is a Budget Binder Automation process for a local County. The County was looking for a solution that would allow departments to submit budgetary requests via standard forms, with all information aggregating in one place. The process starts by building a site for the upcoming annual budget using a site provisioning script that creates the necessary structure and applies appropriate permissions to provide management and staff with the access to create, submit and approve budget forms. Standard templates were designed for the budget request forms.  

Once request forms are submitted, approval workflows are initiated, and a status is assigned to each request. A consolidation process generates a single Word document incorporating all requests and supporting documents at various levels. The consolidation process can be run multiple times through the budgetary process, until a final approved draft is generated that incorporates all requests across the County. 

Summary  

We’ve touched on a few of the many options available for developing forms. How do you determine what tools to use when designing a form? We usually recommend that you start with understanding fully what the end goal is – or what information you’re looking to gather from the recipient. You also need to know what you’re going to do with that information afterwards. The complexity of these will impact your decision, but you should consider the options available in Microsoft 365 if you have already invested in the platform.  

Other Resources: 

• Webinar: Employee Self-Service Forms and Workflows Webinar (Part 1 of 2) 
•  Webinar: Forms and Workflows Building and Deploying Technical Deep Dive (Part 2 of 2) 
•  Teams provisioning resources