Click Coordinates — Capturing User Interaction with Code Components

Jul 14, 20233 mins read

Author: Sandeep Angara, Cloud Solution Associate

Link to Argano Click Coordinates in GitHub

A complete low-code tool to build enterprise applications and more, Power Apps has many out-of-the-box components that are ready to use—from a simple text input component to a bar code reader, or to more complex deliverables, such as an Object Detector.

But in our experience, it’s when we go beyond “out-of-the-box” that Power Apps really flexes its muscle. It’s when we lean into the unique requirements of a product or service — where custom coding must also be done in addition to what’s built into Power Apps — that the platform’s capabilities truly shine. In Power Apps, there are tools both for the “citizen developer” as well as the experienced, code-first developers.

Following is a real-world example of how all Power Apps has to offer came into play in creating custom application to capture user behavior within an application.

The Problem

Argano’s Power Platform team received a request from a client to capture user interaction within a Power Apps Canvas application. The requirement seemed very simple: capture the locations in an app where a user clicks on the screen.  However, there is no out-of-box component or feature in Power Apps that solves this problem. Argano’s experts had to step up.

The Solution

As stated, Power Apps doesn’t limit its users to out-of-box components, many of which were used to create the Power Apps Canvas application in question. The Power Apps Component Framework (PCF) empowers more experienced developers to design custom code components attached to Power Apps applications using JavaScript.

With this capability, developers can design and develop most any component to satisfy a business’s needs. In this case, Argano’s Power Platform team developed a reusable PCF component that fulfills the requirements: capturing the location where a user clicks or touches, storing the values in two of the component’s attributes X-Axis and Y-Axis. We call this component “Click Coordinates.”

This component can be used anywhere in a Canvas app where a user’s location — their click coordinates — need to be captured.

Additional use-cases

The possibilities of Click Coordinates are as varied as the needs of every business. In a Canvas app, it’s easy to collect transaction data, but interaction data and surrounding analytics are a tougher row to hoe. Not with Click Coordinates. We can now track exactly how a user navigates in an app and which components they interact with as well.

Click Coordinates can also be used to get real-time feedback from users as they’re using an app by enabling you to spot where they may be struggling with app usability or the user interface. (Gaming applications provide an ideal scenario for this kind of data collection).

Essentially, Click Coordinates empowers you to track behavior and measure usability. And it was all made possible by Power Apps out-of-the-box components augmented by Argano expertise.