{"id":8954,"date":"2020-04-01T07:00:00","date_gmt":"2020-04-01T14:00:00","guid":{"rendered":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/ux-enhancements-to-model-driven-power-apps-on-mobile\/"},"modified":"2020-04-01T07:00:00","modified_gmt":"2020-04-01T14:00:00","slug":"ux-enhancements-to-model-driven-power-apps-on-mobile","status":"publish","type":"power-apps","link":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/ux-enhancements-to-model-driven-power-apps-on-mobile\/","title":{"rendered":"UX enhancements to model-driven Power apps on mobile"},"content":{"rendered":"<p><a href=\"https:\/\/powerapps.microsoft.com\/en-us\/blog\/announcing-the-public-preview-of-new-power-apps-mobile-app-that-runs-both-canvas-and-model-driven-apps\/\" rel=\"noopener\" target=\"_blank\"><span style=\"color: #000000\">The new\u00a0Power Apps app plays your canvas and model apps in one single mobile app<\/span><\/a>. In conjunction, we\u2019re thrilled to introduce a brand new, responsive UX designed specifically with mobile scenarios at heart.<\/p>\n<p>Model-driven apps&#8217; UX supports the need for taking quick actions on your information, in a familiar and recognizable way on mobile. \u00a0Usability enhancements to some of the core components of unified interface brings your model apps to life on mobile with a <strong>native look and feel,<\/strong> <strong>gesture support<\/strong>, updated animations, and <strong>interaction patterns that are intrinsic to mobile<\/strong>. With tailored differences in UX for iOS and Android phones, model-driven Power Apps look and feel like any other mobile app on that platform.<\/p>\n<h2>Prominent header<\/h2>\n<ul>\n<li>The hamburger menu on the top left corner houses the sitemap, with Search and Quick Create options on the top right \u2013 <strong>discoverable on all pages<\/strong>.<\/li>\n<li>Sitemap is a slide out panel, a common mobile interaction pattern, that is a window into the different navigation options for the model app. It has a <strong style=\"font-size: 1rem\">cleaner layout<\/strong><span style=\"font-size: 1rem\">, with emphasis on your content.<\/span><\/li>\n<li>Quick Create enables you to create a record in context, with <strong>optimizations to Save<\/strong> and related options.<\/li>\n<\/ul>\n<p><img loading=\"lazy\" decoding=\"async\" alt=\"\" class=\"alignnone size-full wp-image-9022\" height=\"953\" src=\"https:\/\/powerappsblogmedia.azureedge.net\/powerappsblog\/2020\/03\/UCI-Mobile-UX-1.png\" width=\"1525\" srcset=\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-content\/uploads\/2020\/03\/UCI-Mobile-UX-1.webp 1525w, https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-content\/uploads\/2020\/03\/UCI-Mobile-UX-1-300x187.webp 300w, https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-content\/uploads\/2020\/03\/UCI-Mobile-UX-1-1024x640.webp 1024w, https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-content\/uploads\/2020\/03\/UCI-Mobile-UX-1-768x480.webp 768w\" sizes=\"auto, (max-width: 1525px) 100vw, 1525px\" \/><\/p>\n<h2>Navigation<\/h2>\n<ul>\n<li>You can tap on the view name on a list page to switch views easily using the updated view switcher.<\/li>\n<li>Updated page transition animation enables you to navigate back by swiping across the screen. On Android phones, you can use the device\u2019s soft back button to go back to the previous page.<\/li>\n<\/ul>\n<p><img loading=\"lazy\" decoding=\"async\" alt=\"\" class=\"alignnone size-full wp-image-9023\" height=\"953\" src=\"https:\/\/powerappsblogmedia.azureedge.net\/powerappsblog\/2020\/03\/UCI-Mobile-UX-2.png\" width=\"1549\" srcset=\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-content\/uploads\/2020\/03\/UCI-Mobile-UX-2.webp 1549w, https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-content\/uploads\/2020\/03\/UCI-Mobile-UX-2-300x185.webp 300w, https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-content\/uploads\/2020\/03\/UCI-Mobile-UX-2-1024x630.webp 1024w, https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-content\/uploads\/2020\/03\/UCI-Mobile-UX-2-768x473.webp 768w, https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-content\/uploads\/2020\/03\/UCI-Mobile-UX-2-1536x945.webp 1536w\" sizes=\"auto, (max-width: 1549px) 100vw, 1549px\" \/><\/p>\n<h2>Commanding<\/h2>\n<ul>\n<li>You can find <strong>page-level commands on any page at the bottom of the screen<\/strong>. On iOS, they are circled icons with stacked text. On Android phones, they are under the floating button at the bottom.<\/li>\n<li>Global commands are in the overflow drawer on iOS as a horizontally scrollable list and in the vertical ellipsis in the header on Android phones.<\/li>\n<\/ul>\n<p><img loading=\"lazy\" decoding=\"async\" alt=\"\" class=\"alignnone size-full wp-image-9024\" height=\"967\" src=\"https:\/\/powerappsblogmedia.azureedge.net\/powerappsblog\/2020\/03\/UCI-Mobile-UX-3.png\" width=\"1506\" srcset=\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-content\/uploads\/2020\/03\/UCI-Mobile-UX-3.webp 1506w, https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-content\/uploads\/2020\/03\/UCI-Mobile-UX-3-300x193.webp 300w, https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-content\/uploads\/2020\/03\/UCI-Mobile-UX-3-1024x658.webp 1024w, https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-content\/uploads\/2020\/03\/UCI-Mobile-UX-3-768x493.webp 768w\" sizes=\"auto, (max-width: 1506px) 100vw, 1506px\" \/><\/p>\n<p>Please review the <a href=\"https:\/\/docs.microsoft.com\/en-us\/powerapps\/user\/use-custom-model-driven-app-on-mobile\" rel=\"noopener\" target=\"_blank\">documentation<\/a> for more details and share your feedback on <a href=\"https:\/\/powerusers.microsoft.com\/t5\/Power-Apps-Community\/ct-p\/PowerApps1\" rel=\"noopener\" target=\"_blank\">PowerApps community forum<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Model-driven apps have a new, responsive UX with Power Apps app, designed specifically with mobile scenarios at heart. Usability enhancements to some of the core components of unified interface brings your model apps to life on mobile with a native look and feel, gesture support, updated animations, and interaction patterns that are intrinsic to mobile. <\/p>\n","protected":false},"author":173,"featured_media":0,"comment_status":"open","ping_status":"open","template":"","power-apps-category":[1664],"power-apps-tag":[],"coauthors":[2079],"class_list":["post-8954","power-apps","type-power-apps","status-publish","hentry","power-apps-category-uncategorized"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v24.4 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>UX enhancements to model-driven Power apps on mobile - Microsoft Power Platform Blog<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/ux-enhancements-to-model-driven-power-apps-on-mobile\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"UX enhancements to model-driven Power apps on mobile - Microsoft Power Platform Blog\" \/>\n<meta property=\"og:description\" content=\"Model-driven apps have a new, responsive UX with Power Apps app, designed specifically with mobile scenarios at heart. Usability enhancements to some of the core components of unified interface brings your model apps to life on mobile with a native look and feel, gesture support, updated animations, and interaction patterns that are intrinsic to mobile.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/ux-enhancements-to-model-driven-power-apps-on-mobile\/\" \/>\n<meta property=\"og:site_name\" content=\"Microsoft Power Platform Blog\" \/>\n<meta property=\"og:image\" content=\"https:\/\/powerappsblogmedia.azureedge.net\/powerappsblog\/2020\/03\/UCI-Mobile-UX-1.png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"1 min read\" \/>\n\t<meta name=\"twitter:label2\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data2\" content=\"Srihari Srinivasa\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/ux-enhancements-to-model-driven-power-apps-on-mobile\/\",\"url\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/ux-enhancements-to-model-driven-power-apps-on-mobile\/\",\"name\":\"UX enhancements to model-driven Power apps on mobile - Microsoft Power Platform Blog\",\"isPartOf\":{\"@id\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/ux-enhancements-to-model-driven-power-apps-on-mobile\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/ux-enhancements-to-model-driven-power-apps-on-mobile\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/powerappsblogmedia.azureedge.net\/powerappsblog\/2020\/03\/UCI-Mobile-UX-1.png\",\"datePublished\":\"2020-04-01T14:00:00+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/ux-enhancements-to-model-driven-power-apps-on-mobile\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/ux-enhancements-to-model-driven-power-apps-on-mobile\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/ux-enhancements-to-model-driven-power-apps-on-mobile\/#primaryimage\",\"url\":\"https:\/\/powerappsblogmedia.azureedge.net\/powerappsblog\/2020\/03\/UCI-Mobile-UX-1.png\",\"contentUrl\":\"https:\/\/powerappsblogmedia.azureedge.net\/powerappsblog\/2020\/03\/UCI-Mobile-UX-1.png\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/ux-enhancements-to-model-driven-power-apps-on-mobile\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Power Apps\",\"item\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"UX enhancements to model-driven Power apps on mobile\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/#website\",\"url\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/\",\"name\":\"Microsoft Power Platform Blog\",\"description\":\"Innovate with Business Apps\",\"publisher\":{\"@id\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/#organization\",\"name\":\"Microsoft Power Platform Blog\",\"url\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-content\/uploads\/2020\/03\/Microsoft-Logo-e1685482038800.png\",\"contentUrl\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-content\/uploads\/2020\/03\/Microsoft-Logo-e1685482038800.png\",\"width\":194,\"height\":145,\"caption\":\"Microsoft Power Platform Blog\"},\"image\":{\"@id\":\"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/#\/schema\/logo\/image\/\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"UX enhancements to model-driven Power apps on mobile - Microsoft Power Platform Blog","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/ux-enhancements-to-model-driven-power-apps-on-mobile\/","og_locale":"en_US","og_type":"article","og_title":"UX enhancements to model-driven Power apps on mobile - Microsoft Power Platform Blog","og_description":"Model-driven apps have a new, responsive UX with Power Apps app, designed specifically with mobile scenarios at heart. Usability enhancements to some of the core components of unified interface brings your model apps to life on mobile with a native look and feel, gesture support, updated animations, and interaction patterns that are intrinsic to mobile.","og_url":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/ux-enhancements-to-model-driven-power-apps-on-mobile\/","og_site_name":"Microsoft Power Platform Blog","og_image":[{"url":"https:\/\/powerappsblogmedia.azureedge.net\/powerappsblog\/2020\/03\/UCI-Mobile-UX-1.png","type":"","width":"","height":""}],"twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"1 min read","Written by":"Srihari Srinivasa"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/ux-enhancements-to-model-driven-power-apps-on-mobile\/","url":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/ux-enhancements-to-model-driven-power-apps-on-mobile\/","name":"UX enhancements to model-driven Power apps on mobile - Microsoft Power Platform Blog","isPartOf":{"@id":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/ux-enhancements-to-model-driven-power-apps-on-mobile\/#primaryimage"},"image":{"@id":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/ux-enhancements-to-model-driven-power-apps-on-mobile\/#primaryimage"},"thumbnailUrl":"https:\/\/powerappsblogmedia.azureedge.net\/powerappsblog\/2020\/03\/UCI-Mobile-UX-1.png","datePublished":"2020-04-01T14:00:00+00:00","breadcrumb":{"@id":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/ux-enhancements-to-model-driven-power-apps-on-mobile\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/ux-enhancements-to-model-driven-power-apps-on-mobile\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/ux-enhancements-to-model-driven-power-apps-on-mobile\/#primaryimage","url":"https:\/\/powerappsblogmedia.azureedge.net\/powerappsblog\/2020\/03\/UCI-Mobile-UX-1.png","contentUrl":"https:\/\/powerappsblogmedia.azureedge.net\/powerappsblog\/2020\/03\/UCI-Mobile-UX-1.png"},{"@type":"BreadcrumbList","@id":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/ux-enhancements-to-model-driven-power-apps-on-mobile\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/"},{"@type":"ListItem","position":2,"name":"Power Apps","item":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/power-apps\/"},{"@type":"ListItem","position":3,"name":"UX enhancements to model-driven Power apps on mobile"}]},{"@type":"WebSite","@id":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/#website","url":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/","name":"Microsoft Power Platform Blog","description":"Innovate with Business Apps","publisher":{"@id":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/#organization","name":"Microsoft Power Platform Blog","url":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-content\/uploads\/2020\/03\/Microsoft-Logo-e1685482038800.png","contentUrl":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-content\/uploads\/2020\/03\/Microsoft-Logo-e1685482038800.png","width":194,"height":145,"caption":"Microsoft Power Platform Blog"},"image":{"@id":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/#\/schema\/logo\/image\/"}}]}},"distributor_meta":false,"distributor_terms":false,"distributor_media":false,"distributor_original_site_name":"Microsoft Power Platform Blog","distributor_original_site_url":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog","push-errors":false,"_links":{"self":[{"href":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-json\/wp\/v2\/power-apps\/8954","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-json\/wp\/v2\/power-apps"}],"about":[{"href":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-json\/wp\/v2\/types\/power-apps"}],"author":[{"embeddable":true,"href":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-json\/wp\/v2\/users\/173"}],"replies":[{"embeddable":true,"href":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-json\/wp\/v2\/comments?post=8954"}],"version-history":[{"count":0,"href":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-json\/wp\/v2\/power-apps\/8954\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-json\/wp\/v2\/media?parent=8954"}],"wp:term":[{"taxonomy":"power-apps-category","embeddable":true,"href":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-json\/wp\/v2\/power-apps-category?post=8954"},{"taxonomy":"power-apps-tag","embeddable":true,"href":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-json\/wp\/v2\/power-apps-tag?post=8954"},{"taxonomy":"author","embeddable":true,"href":"https:\/\/www.microsoft.com\/en-us\/power-platform\/blog\/wp-json\/wp\/v2\/coauthors?post=8954"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}