Related sites:
Newsletter: Perspectives on Power Platform
Company: Niiranen Advisory Oy
Canvas Apps for the Model-driven Mind
My presentation from Power Platform Saturday Oslo, 2019-08-24
Presentation
Canvas-Apps-for-the-Model-driven-MindOutline extract from PowerPoint
Agenda
The PowerApps plan for world domination
Current reality: Canvas vs. Model-driven apps
Demo: what can a citizen developer build?
Tips for building Canvas apps on CDS
A platform for Makers or for Developers?
Quick intro
From Helsinki, Finland
Microsoft MVP since 2013
Blogging at survivingcrm.com
No-code XRM guy since 2005
Started building Canvas apps 1 year ago
The PowerApps plan for world domination
The story so far
In the beginning there was MS CRM (2003)
Which grew into XRM with custom entities (2005)
And went into the cloud (2008)
It learned to deliver Solutions (2011)
Was branded as Dynamics 365 (2016)
Started migrating to Azure (2017)
Merged with PowerApps (2018)
PowerApps today = aPaaS*
…Or ”LCAP”
(*Low-code Application Platform)
“Gartner names Microsoft a Leader in Enterprise Low-Code Application Platforms 2019 Magic Quadrant”
Yes, this is all just PowerApps. Trust us…
The REAL Unified Client?
“Artificial limitations in app features will be removed, so that choosing [File – New App] will give you model or canvas experiences and everything will work across both.”
1 + 1 + Portals = …1?
With Dynamics Portals reimagined as PowerApps Portals, we have one more app type in our LCAP
Critical for the external app audience story, yet nothing like a public version of Canvas or Model-driven apps – today
In the fullness of time, also Portals need to adopt common technology like PowerApps Component Framework
Future form factors?
Current State:
Canvas
vs.
Model
Design and build a business app from a canvas in Microsoft PowerApps without writing code in a traditional programming language such as C#.
Design the app by dragging and dropping elements onto a canvas, just as you would design a slide in PowerPoint. Create Excel-like expressions for specifying logic and working with data.
Build apps that integrate business data from a wide variety of Microsoft and third-party sources.
Share your app so that users can run it in a browser or on a mobile device, and embed your app so that users can run it in SharePoint, Power BI, or Teams.
If you don’t need a custom design and your data is in Common Data Service, you can automatically generate a model-driven app from your business data and processes.
Model-driven app design is a component-focused approach to app development. Model-driven app design doesn’t require code and the apps you make can be simple or very complex.
Unlike canvas app development where the designer has complete control over app layout, with model-driven apps much of the layout is determined for you and largely designated by the components you add to the app.
The Real shift in thinking
App Designer: Model-driven world
App Designer: Canvas world
Canvas app determines all of the client-side logic
Multiple data sources connected to the app can all introduce their own server-side logic
Screens contain controls
Controls bind to data sources
Control properties drive UI behavior
…via functions supported by PowerApps Canvas apps
Why Excel rules
Excel is the original Canvas for information workers to paint their data on
Structure without enforcement, logic without programming
Immediate recalculation of the whole app (workbook) to show the effect of your tweaks
Both Excel and PowerApps Canvas apps are “terrible”, but they support the problem solving thought process of most humans
Demo time!
Now it’s…
Tips for building Canvas
apps on CDS data
Don’t start from blank
When learning how to use CDS data in a Canvas app, first always generate the app from data
You get core plumbing that will feel a lot more approachable thank a blank canvas
You can add & delete anything you want
Whenever possible, avoid using Dynamics 365 connector and go for CDS
App starting point: Model-driven vs. Canvas
”Generate from data” gives you a nice single entity experience with basic CRUD capability
Anything you don’t see is for you to build:
Navigation
Filters
Actions (buttons)
Summaries (count)
EVERYTHING you see can be customized
Galleries instead of views
Gallery is the most important control to master in Canvas apps
(There is also a control called Data Table, but you shouldn’t really ever use it)
Shows the contents of a single data source (CDS entity), just like a view would, but it’s not just a database view with columns
Presentation of data in the gallery item template is extremely flexible
Conditional display of fields, icons, strings, label styles, pictures
Append data from other sources, also other systems
Filtering: the hard way & the easy way
Data sources will by default bring in the whole table
The lack of built-in view selector component means two things:
You’re free to design beautiful preset filter options for the user
You have to implement every condition, search term, sorting in your formula
”Items” may well be the most scary looking formula in your whole Canvas app
Support for CDS views as the source for Gallery Items is now in preview!
No context = everything is universally referenceable
The biggest conceptual difference to Model-driven apps is that you’re never “in” any entity or any record
Whichever control or variable you point to in your formula is the source of record context
AccountGallery.Selected, CurrentUser, First(LeadsCollection)
The whole app on every screen is recalculated after any change made by the user
Current CDS user: you’ve got email
Subgrids for related records: just ”dot” it!
Earlier you had to build cumbersome Filter formulas to match 1:N record with primary & foreign key fields (GUIDs)
Now that relational data support feature has graduated from Experimental stage, you can directly reference ”parent.children”
Form vs. Form
Model-driven
(Command Bar)
Header
“Main form”
Tabs
Sections
Fields
Controls
Footer
Navigation (related)
Canvas
Form
Data Card
Control
Conditional formatting
Compared to the static format of data inside Model-driven apps, the rich expressions of Canvas apps were born to highlight important data
Example: change background color based on status field
TemplateFill: If(Text(ThisItem.Status) <> “Open”, RGBA(241, 244, 249, 1), RGBA(0, 0, 0, 0))
Use switch case for showing different icons for different record values to make UI even more intuitive
Downside: you’ll also need to manually handle formats like DateTime and numbers (since Canvas app doesn’t follow any CDS user preferences)
Search is great! (except…)
Instant filtering of gallery results once the user starts typing into the text input field
Can match the search string with multiple fields concurrently
Combine text search with filters set in other controls
Except: you can’t search from complex lookups like ”Customer”
Dirty hack: copy lookup values to shadow text fields on CDS side
XRM pain points that can be addressed in Canvas apps
Unaware of user’s context: every entity & command is shown all the time
Flat navigation structure: everything app area is seemingly of equal importance
Pain of reducing choices: hiding actions from the user is laborious
Lack of guidance: hard to take users through a predetermined path (RIP Dialogs)
Price of pixel perfection
In Model-driven apps you could always blame the platform for not displaying things in the most usable way
With Canvas apps, every pixel imperfection and UX gap is now squarely YOUR fault👈
Logical navigation experience is the first priority you need to deliver in your app
The more complex you make the UI, the more time it will take to polish
Remember to play around with your apps
Use temporary labels, galleries to see your data change as your formulas evolve
Store stuff in variables, collections to reach your final composition
Use a tablet layout for more side-by-side screen estate, even if you’re targeting phone screens in final app
Keep a proper text editor like Notepad++ available at all times to copy & paste the pieces together
Have the PowerApps Formula Reference documentation page on a browser tab
A platform for Makers
or for Developers?
No-code or Low-code? Forrester’s take:
”The vendors in this evaluation target professional developers as their primary customers and address other participants as secondary audiences.”
No-code or Low-code? Gartner’s take:
”A low-code application platform (LCAP) is an application platform that supports rapid application development, one-step deployment, execution and management using declarative, high-level programming abstractions, such as model-driven and metadata-based programming languages.”
“Gartner views “no-code” application platforms as part of the LCAP market. “No-code” is a marketing and positioning statement, implying that the platform requires text entry only for formulas or simple expressions, all other aspects of application development being enabled by visual modeling or configuration.”
Low-code = more accessible way to write code
Developers can go further with Canvas apps than functional consultants ever would try
…But first you have to get them to try, too
“Canvas apps are easy but not necessarily simple”
PCF = making UI extensions scalable
Every new control in PowerApps (Canvas or Model-driven) is already a component from MS
PowerApps Component Framework (PCF) components is what every developer should be creating
So that every maker with access to that component could put it into their application
For every user to interact with
DevOps = shipping enterprise scale PowerApps
We are all
App Makers.
Thanks for listening!