{"id":31270,"date":"2021-08-10T07:36:31","date_gmt":"2021-08-10T14:36:31","guid":{"rendered":"https:\/\/www.uxpin.com\/studio\/?p=31270"},"modified":"2025-10-07T16:22:42","modified_gmt":"2025-10-07T23:22:42","slug":"principles-mobile-app-design","status":"publish","type":"post","link":"https:\/\/www.uxpin.com\/studio\/blog\/principles-mobile-app-design\/","title":{"rendered":"9 Principles of Mobile App Design"},"content":{"rendered":"\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh5.googleusercontent.com\/KkoeRDGXUY4F2Gz4ifvXM2a_Tljwu8E89LBhqbDZc6mIP9cbzMYP8WqdXvXr2Lu-nH0PIuUZJwjsc5JlrfQ9rNKe3PEfRd8dQNMTg2EsqrIObwQxr9cJP_A9on9v5q5zqcH91jjZ\" alt=\"\"\/><\/figure>\n\n\n\n<div style=\"height:20px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p>App design is a combination of UI and UX design to build out a usable piece of software. Modern users don\u2019t have patience for apps that are confusing to use. Ideal mobile app design is good-looking, functional, and straightforward all at the same time.&nbsp;<\/p>\n\n\n\n<p>So, how do you measure <a href=\"https:\/\/www.uxpin.com\/studio\/blog\/good-app-design\/\" target=\"_blank\" rel=\"noreferrer noopener\">good app design<\/a>? A good app is measured by good UX.<\/p>\n\n\n\n<p>Users should be able to navigate your application without needing to think. If they can instinctively figure out the design, they\u2019ll continue to use your application again and again.&nbsp;<\/p>\n\n\n\n<p>In this article, we\u2019re going to look at the 9 principles of mobile app design and how you can incorporate them into your design work.<\/p>\n\n\n\n<p>Here at <a href=\"https:\/\/www.uxpin.com\/\" target=\"_blank\" rel=\"noreferrer noopener\">UXPin<\/a>, we use these principles on a regular basis. If you\u2019re looking to boost your design skills, get on to the <a href=\"https:\/\/www.uxpin.com\/sign-up\" target=\"_blank\" rel=\"noreferrer noopener\">UXPin free trial<\/a> and start prototyping now.<\/p>\n\n\n\n<section class=\"try-uxpin-banner\">\n    <div class=\"try-uxpin__container\">\n        <div class=\"try-uxpin__left\">\n            <p class=\"try-uxpin__heading\">Build advanced prototypes<\/p>\n            <p class=\"try-uxpin__text\">Design better products with States, Variables, Auto Layout and more.<\/p>\n            <a href=\"https:\/\/www.uxpin.com\/sign-up\" target=\"_blank\" rel=\"noopener\">\n                <button class=\"try-uxpin__button\">Try UXPin<\/button>\n            <\/a>\n        <\/div>\n        <div>\n            <img decoding=\"async\" src=\"https:\/\/uxpin.com\/studio\/wp-content\/themes\/uxpin-juggernaut\/img\/cta-banner-signup.png\" class=\"try-uxpin__image\" alt=\"Try UXPin\">\n        <\/div>\n    <\/div>\n<\/section>\n\n<style>\n.try-uxpin-banner {\n    margin: 40px 0px;\n}\n\n.try-uxpin__container {\n    display: flex;\n    max-width: 689px;\n    height: 210px;\n    padding: 20px;\n    padding-left: 24px;\n    border: 2px solid black;\n    border-radius: 4px;\n    align-items: center;\n    justify-content: space-between;\n    background-color: white;\n    box-shadow: 10px 10px black;\n}\n\n.try-uxpin__left {\n    width: 54%;\n}\n\n\n.try-uxpin__heading {\n    font-size: 28px !important;\n    font-weight: bold;\n}\n\n.try-uxpin__left p {\n    margin: 10px 0px !important;\n    color: black !important;\n}\n\n.try-uxpin__text {\n    margin: 0 !important;\n    font-size: 18px !important;\n    line-height: 22px !important;\n}\n\n.try-uxpin__button {\n    width: 135px;\n    height: 44px;\n    background: black;\n    margin: 10px 0px;\n    padding: 10px 20px;\n    border: none;\n    border-radius: 2px;\n    color: white;\n    font-size: 16px;\n    text-align: center;\n}\n\n.try-uxpin__button:hover {\n    cursor: pointer;\n}\n\n.try-uxpin__image {\n    max-width: 320px !important;\n    height: 200px;\n    margin-right: -21px;\n    margin-bottom: -6px;\n}\n\n@media (max-width: 760px) {\n    .try-uxpin__container {\n        height: auto;\n        margin: 10px;\n        align-items: left;\n    }\n}\n\n@media (max-width: 500px) {\n    .try-uxpin__container {\n        flex-direction: column;\n    }\n\n    .try-uxpin__left {\n        width: 100%;\n        align-items: normal;\n    }\n}\n\n<\/style>\n\n\n\n<div style=\"height:20px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-principle-1-make-it-easy\">Principle 1: Make it Easy<\/h2>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh4.googleusercontent.com\/k8ZWTljiAyoU-6C0qZ-xNgiiBWHqAb8Q65vko-bdk8jzbxDvolQTlrILN8RAFB0aawsl9NBlZN4rbz12vP5_4VIp6MJlPwLQ2gy4ph9n0yqHF3tukfkUayooDVD9eqZtrhG4aynF\" alt=\"\"\/><\/figure>\n\n\n\n<p>Prove your app\u2019s value by giving users what they want right away.<\/p>\n\n\n\n<p>Normally, when someone downloads an app, he or she wants to use it for performing a specific task. Try to make a great first impression once they open your app. Don&#8217;t interrupt them while they&#8217;re using your app &#8211; or at least don\u2019t interrupt them immediately.<\/p>\n\n\n\n<p>Let users do what they want to do. Users are there to find specific information, perform an action or consume some kind of content. If they can\u2019t do what they want easily, they might close your app and never come back.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-break-down-big-tasks-into-really-easy-steps\">Break down big tasks into really easy steps<\/h3>\n\n\n\n<p>Cognitive load measures the mental effort needed to complete a task. Minimize the cognitive load of using your app so that users can navigate step-by-step. They shouldn\u2019t view it as a chore that needs to be done.&nbsp;<\/p>\n\n\n\n<p>Let\u2019s take a checkout process as an example: you could ask users for information all at once, but they&#8217;ll find it easier to fill in information over multiple steps: their shipping address, billing information, credit card information, etc.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-tell-the-user-exactly-what-they-need-to-do\">Tell the user exactly what they need to do<\/h3>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh4.googleusercontent.com\/ZgCGniMFqVw2UlezcgC22eqMSsMOZC7piFJp3ZLbZOgFHTQYU0IyC1AOVSKQncpUqMqt9Ytm0Tseg9BYdN-Q71Vcg4Px9n969nLfBCJ-PYvyTgwZkfFNsoUZpqWwoyyyL-1P2juE\" alt=\"\"\/><\/figure>\n\n\n\n<p>Your design should make it clear what the user needs to do. If you suspect that an integral part of your layout may confuse your users, use visual aids to explain what needs to be done. For instance, you can use a tooltip or a caption to provide instructions.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-don-t-hide-important-information\">Don\u2019t hide important information<\/h3>\n\n\n\n<p>If you want the user to use your application effectively, turn their attention to the most important elements of your app. You can do so by increasing the font size, adding whitespace, and making sure that the element&#8217;s color contrasts well with the background color.<\/p>\n\n\n\n<p>Navigation elements should always be visible and they should facilitate the completion of high-value tasks.&nbsp;<\/p>\n\n\n\n<div style=\"height:20px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-principle-2-make-the-navigation-of-your-app-predictable\">Principle 2: Make the navigation of your app predictable<\/h2>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh4.googleusercontent.com\/h4ceGbzeUsPBhGEKA8ssCjwbpDQ5IdrQ4RvMgjFaS04a-UaMing2-juWa2g2yk2tukVEaYAuXSC-mQylpNzWj2mWboGALL6yLlSnF6AP59cK_KJlYM85tnmix-pp39HF_LbcdWl5\" alt=\"\"\/><\/figure>\n\n\n\n<p>People get used to the design patterns they encounter every day. For instance, they will expect to be able to swipe through pictures. Make sure you adhere to the typical navigation methods of the Internet.&nbsp;<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-your-users-have-an-expectation-of-how-to-navigate-the-app\">Your users have an expectation of how to navigate the app<\/h3>\n\n\n\n<p>Your users&#8217; past experiences of using other apps will inform their expectations for using all applications, including yours. Incorporate these common patterns into your design to allow them to easily navigate your app.<\/p>\n\n\n\n<p>Take inspiration from <a href=\"https:\/\/www.uxpin.com\/studio\/blog\/ui-ux-design-trends\/\" target=\"_blank\" rel=\"noreferrer noopener\">UX design trends<\/a> and most common patterns used today, but don\u2019t blindly implement them without considering their fit with your application. If necessary, slightly modify these patterns to fit the overall context of your design.<\/p>\n\n\n\n<p>Make sure to follow the commonly accepted <a href=\"https:\/\/www.uxpin.com\/studio\/blog\/what-is-mobile-navigation\/\" target=\"_blank\" rel=\"noreferrer noopener\">navigational principles for the structure of your app<\/a>. Sometimes users will instantly understand the purpose of a certain feature or a page. For instance, people will recognize the purpose of the \u201cwhat\u2019s new\u201d page, or \u201csearch\u201d field. Use these universally recognized concepts to simplify your app\u2019s design.<\/p>\n\n\n\n<p>Make sure to check out the design guidelines published by <a href=\"https:\/\/developer.apple.com\/design\/human-interface-guidelines\/\" target=\"_blank\" rel=\"noreferrer noopener\">developers of iOS<\/a> and <a href=\"https:\/\/developer.android.com\/design\" target=\"_blank\" rel=\"noreferrer noopener\">Android<\/a> operating systems. These documents describe proven design patterns used in excellent layouts today.&nbsp;<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-follow-the-3-click-rule\">Follow the 3-click rule<\/h3>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh6.googleusercontent.com\/EkQq-ddRXyonWLJ7OVSU8rFExFs8fGiBJRGn8AwoyyNLQvW5AHmevUBPYX5ayQAZ4phrCNf_mv8HLHRZwHEaD4nBdLh_cllamaPis7GgcMS69TJ7CYpCFoUF6ksToW-QW7M5io4U\" alt=\"\"\/><\/figure>\n\n\n\n<p>Users should be able to access any part of your app in less than three clicks. Keep the hierarchy of your navigation bar simple.<\/p>\n\n\n\n<p>Doing so will make sure it\u2019s easy for your users to keep a mental map of what\u2019s going on in your app. Also, make sure your app shows the name of the page.&nbsp;<\/p>\n\n\n\n<p>Whenever there\u2019s an <a href=\"https:\/\/www.uxpin.com\/studio\/blog\/user-error\/\" target=\"_blank\" rel=\"noreferrer noopener\">error<\/a>, let people return to the <a href=\"https:\/\/www.uxpin.com\/studio\/blog\/10-things-make-homepage-success\/\" target=\"_blank\" rel=\"noreferrer noopener\">homepage<\/a> or try to <a href=\"https:\/\/www.uxpin.com\/studio\/blog\/404-page-best-practices\/\" target=\"_blank\" rel=\"noreferrer noopener\">redirect them to other pages<\/a> that might interest them.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-save-users-progress\">Save users\u2019 progress<\/h3>\n\n\n\n<p>Users today are busy and easily distracted. They might close your app to respond to an email or watch a new episode of their favorite TV show. Save their <a href=\"https:\/\/www.uxpin.com\/studio\/blog\/what-is-progressive-disclosure\/\" target=\"_blank\" rel=\"noreferrer noopener\">progress<\/a> so that they can come back and finish their task without having to start over.&nbsp;<\/p>\n\n\n\n<p>If you want to learn what your users do on your website or app, perform task analysis. Here&#8217;s a guide for that: <a href=\"https:\/\/www.uxpin.com\/studio\/blog\/how-to-do-task-analysis\/\"><em>Task Analysis \u2013 How to Find UX Flaws<\/em><\/a>.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-make-it-accessible-across-multiple-devices\">Make it accessible across multiple devices<img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/lh3.googleusercontent.com\/0BmGEEI-5a4newdfhabQZperug_aOhaTt4tk2DySp-KVgLwgXgyjvoBBvI_9XFNa407vMOZg3Oqbc6Hk5tVo2dEuX_j17d-fy1BTZkZGx-6LDo4_SCmRPDJtcuQSyiC0kNXWYiaR\" width=\"624\" height=\"249\"><\/h3>\n\n\n\n<p>If you have a desktop website and a smartphone app, both channels should automatically save the activities and progress of logged-in users. People should be able to use the app and the website interchangeably. For instance, online shoppers might browse products on their phones, but place an order on a desktop computer.&nbsp;<\/p>\n\n\n\n<div style=\"height:20px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-principle-3-follow-the-basic-laws-of-app-navigation\">Principle 3: Follow the basic laws of app navigation<\/h2>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-don-t-make-up-your-own-language\">Don\u2019t make up your own language<\/h3>\n\n\n\n<p>In some cases, it\u2019s better to rely on basic principles of app design. People easily understand the design frameworks they encounter every day. Your <a href=\"https:\/\/www.uxpin.com\/studio\/blog\/web-layout-best-practices-12-timeless-ui-patterns-explained\/\" target=\"_blank\" rel=\"noreferrer noopener\">layout<\/a> should fall in line with those expectations.&nbsp;<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-x-in-the-top-right-hand-corner\">X in the top right-hand corner<img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/lh4.googleusercontent.com\/4a1oA9oG-6IVERtYbPfJqWaFJcwHOuT2V1En29IqpakU1Rg-SdB1_c-rEON_u8wyBm1qxJmiACKCMLs6MP1JjV0vVlHgOv2y_0nz5bstd0QaxLlAcGHyVudf3E_rHINO0gdoqYqF\" width=\"624\" height=\"249\"><\/h3>\n\n\n\n<p>A lot of applications feature X in the top right corner. Users instinctively know that clicking it will close the application.<\/p>\n\n\n\n<p>Avoid dramatically changing the function of common symbols. For instance, the user expects X to close the window. Don\u2019t use X as a symbol for any other action.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-save-button\">Save Button<\/h3>\n\n\n\n<p>Your app should also have a &#8220;Save&#8221; button at the bottom of a page.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-light-coloured-text-field-for-inputs\">Light coloured text field for inputs<\/h3>\n\n\n\n<p>Normally, input field lines are light-colored. Ideally, they should match the color that the users associate with your brand. It is rare to see input fields with black borders.&nbsp;<\/p>\n\n\n\n<div style=\"height:20px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-principle-4-have-a-great-clear-and-prioritized-page-design\">Principle 4: Have a great, clear, and prioritized page design<\/h2>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh4.googleusercontent.com\/rcYcR9kkEr3juWQoljzJNnVObgE6aSsF4BlY65HD8R2OfSw9tnVDseIweC3kXFx7P8P92cNdQZbbKl1v9Y8xv7MUW31zeKwKDgqh19_cmY9N-WLYcM_Awxb0k7zKUlNRgnQAqkYZ\" alt=\"\"\/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-label-products-descriptively\">Label products descriptively<\/h3>\n\n\n\n<p>Make sure the names you choose for products are descriptive and appealing. For instance, a customer might find it hard to see the difference between \u201cstandard shipping\u201d and \u201cregular shipping\u201d. Pick labels that showcase the differences between the two options.&nbsp;<\/p>\n\n\n\n<p>You can use techniques like <a href=\"https:\/\/www.uxpin.com\/studio\/blog\/the-practical-beginners-guide-to-user-research\/\" target=\"_blank\" rel=\"noreferrer noopener\">Card Sorting<\/a> to get the feel of customers&#8217; mental models.&nbsp;<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-showcase-the-most-important-menu-items\">Showcase the most important menu items<\/h3>\n\n\n\n<p>Your navigation should facilitate the completion of the most important and high-value tasks. Show the most important features in the primary menu and leave everything else for the secondary menu. Use <a href=\"https:\/\/www.uxpin.com\/studio\/blog\/a-perfect-ui-pairing-minimalism-and-bold-typography\/\" target=\"_blank\" rel=\"noreferrer noopener\">Visual Weight<\/a> techniques to divert users&#8217; attention to where it matters.<\/p>\n\n\n\n<p>Changing font size, <a href=\"https:\/\/www.uxpin.com\/studio\/blog\/contrast-in-web-design\/\" target=\"_blank\" rel=\"noreferrer noopener\">background contrast<\/a>, and surrounding <a href=\"https:\/\/www.uxpin.com\/studio\/blog\/what-is-negative-space-in-design\/\" target=\"_blank\" rel=\"noreferrer noopener\">whitespace<\/a> can help you divert users\u2019 attention to the most important features of your application.&nbsp;<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-f-pattern-vs-z-pattern\">F pattern vs. Z pattern<\/h3>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh4.googleusercontent.com\/5wZCVgTv67IgAFQ54S4xr1U3ZFw0A3gvnPaEAdHfENSg4xsM5vqOxZEczjGha6ffqGThUYmNBLFsGKfgCnb6E_jjQ6hEGcKTrWcog9UCi80Yro9JPZ5j8_WGcJBw_WVUB_cJx9uN\" alt=\"\"\/><\/figure>\n\n\n\n<p>Most users aren\u2019t going to read text from start to finish. They are <a href=\"https:\/\/www.uxpin.com\/studio\/blog\/website-design-for-scannability\/\" target=\"_blank\" rel=\"noreferrer noopener\">more likely to scan<\/a> multiple paragraphs of text. The first few words of the opening paragraphs get the most attention. That&#8217;s where you should place your most important messages to ensure that users don&#8217;t miss them. This scanning behavior is described as an F pattern.&nbsp;<\/p>\n\n\n\n<p>Users scan visual content in a Z-shaped pattern. Place your most important visuals in the areas where they are most likely to be seen by the users, following the Z-shape pattern on your webpages.&nbsp;<\/p>\n\n\n\n<div style=\"height:20px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-principle-5-have-brand-image-consistency\">Principle 5: Have brand image consistency<\/h2>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh6.googleusercontent.com\/_Wu-9d34DHxaYEfIADxksdCBbDdx-ixy_JcNYylo1729vvm5yI0Sw_qQxU5bKXDoyNMBkx0liLJdsKwU6V0flP3P2TZ1tElK8UlrvC0aiZcgCc70R8Su5roDufda7MNFWknaesU9\" alt=\"\"\/><\/figure>\n\n\n\n<p>The buttons, input fields, and other elements of your application should be based on your brand image, so you need to <a href=\"https:\/\/www.uxpin.com\/studio\/blog\/brand-consistency\/\" target=\"_blank\" rel=\"noreferrer noopener\">have it consistent<\/a>.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-have-navigation-consistency\">Have navigation consistency<\/h3>\n\n\n\n<p>If your application is based on an existing website, make sure its navigation works similarly to that of a website. Don\u2019t change the <a href=\"https:\/\/www.uxpin.com\/studio\/blog\/choose-color-pallete\/\" target=\"_blank\" rel=\"noreferrer noopener\">color palette<\/a> or other basic functionality to avoid confusion.&nbsp;<\/p>\n\n\n\n<p>Make sure your users can predict most of the time how your app will work and look.<\/p>\n\n\n\n<p>Mobile users don\u2019t have the advantage of hovering and having a cursor to help them guess the outcome of their actions. Carefully design the <a href=\"https:\/\/www.uxpin.com\/studio\/blog\/user-interface-elements-every-designer-should-know\/\" target=\"_blank\" rel=\"noreferrer noopener\">elements<\/a> to help users recognize their purpose.<\/p>\n\n\n\n<div style=\"height:19px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-principle-6-minimize-input-and-commitment-from-the-user\">Principle 6: Minimize input and commitment from the user<\/h2>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/lh3.googleusercontent.com\/xJm1Si25Q2VVu6CNA379jIu8Uc2XcW7dmWR0MlHGMPX33etWJdB0SQWTiWsj7eWLDUdS_vRqk9uhWp9feSX38C8jiAMPTuC_SmiyuCSqOQUj28zyYN1sKzkOf7GBJ84dM9RfBItf\" width=\"624\" height=\"249\"><\/h3>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-don-t-ask-for-set-up-information-up-front\">Don\u2019t ask for set-up information up front<\/h3>\n\n\n\n<p>Users see your app as a solution. Most people are focused on solving their problems. Don\u2019t bother them with questions, account registrations, or signup forms right away.&nbsp;<\/p>\n\n\n\n<p>Let users use your app freely until it\u2019s absolutely critical to login, give a credit card, or whatever the action may be.<\/p>\n\n\n\n<p>For example, <a href=\"https:\/\/medium.com\/\">Medium<\/a> allows its users to enjoy a limited number of high-quality articles before asking them to create an account and subscribe.&nbsp;<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-minimize-the-need-for-typing\">Minimize the need for typing<\/h3>\n\n\n\n<p>Users find it hard to precisely type on their smartphones. Try to get the desired information without asking them for text input.&nbsp;<\/p>\n\n\n\n<p>If you can\u2019t think of an alternative, provide <a href=\"https:\/\/www.uxpin.com\/studio\/blog\/form-input-design-best-practices\/\" target=\"_blank\" rel=\"noreferrer noopener\">input masks as a formatting guideline<\/a>.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-prefill-as-much-data-as-possible\">Prefill as much data as possible<\/h3>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh6.googleusercontent.com\/oxUJo6CBNDtvx5zTZpyEW6F_oYD08whn8k9715UpFMqplytv86JbBAFQFqwWkz4S-43oLT6qY9sYcSO5OUhGCudkoIpQDZwZPLHIyeUMWb3OcWtMLvZLDS4bB5nKDKS8b2Yf610y\" alt=\"\"\/><\/figure>\n\n\n\n<p>Instead of asking users to write down their location, ask them to share their location and use a smart tool to fill in their address based on GPS data.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-provide-optional-inputs\">Provide optional inputs<\/h3>\n\n\n\n<p>Don&#8217;t ask users for unnecessary information. If you&#8217;d like to collect the data, give users the option to fill out the form or leave it empty if they wish.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-autofill-wherever-possible\">Autofill wherever possible<\/h3>\n\n\n\n<p>In some cases, you can use the phone\u2019s features to automatically fill in the fields. For instance, some apps allow their users to provide payment information by holding their credit cards in front of the camera.&nbsp;<\/p>\n\n\n\n<div style=\"height:20px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-principle-7-loading-should-be-fast-and-well-communicated\">Principle 7: Loading should be fast and well communicated<\/h2>\n\n\n\n<p>Users are impatient when it comes to waiting for the app to load. Make sure your app loads fast to minimize any friction.&nbsp;<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-show-something\">Show something<\/h3>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh3.googleusercontent.com\/U_6GuDiKt45RD-F6lgPRLdha4_y-GBOxSUVUGAh5BpTpNeNtVF300vpDX2L5Zf1xmMwQKZ1bOe49JRKNpx5S0H84XQz_5eaMNa8zO1Yn_NPITsVXu-M54tpUKepBo-DmEMAucAGk\" alt=\"\"\/><\/figure>\n\n\n\n<p>If you\u2019re loading, make sure your user knows it\u2019s loading and not broken.<\/p>\n\n\n\n<p>Seeing a blank loading screen might lead your users to think that your app doesn\u2019t work. People are used to seeing some sort of loading indicator \u2013 a progress bar or a loading spinner.&nbsp;<\/p>\n\n\n\n<p>Load parts of the content gradually to display something as soon as possible. This way, users can start using the app right away, even if their Internet connection is unstable.&nbsp;<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-offer-a-visual-distraction-during-loading\">Offer a visual distraction during loading<\/h3>\n\n\n\n<p>You can use simple loops or progress bars to display loading progress, but users are more likely to keep waiting if you create a simple, but entertaining loading animation.&nbsp;<\/p>\n\n\n\n<div style=\"height:20px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-principle-8-optimize-your-app-for-mobile-and-diverse-mobile-users\">Principle 8: Optimize your app for mobile, and diverse mobile users<\/h2>\n\n\n\n<p>If your app is going to include a lot of text, make sure that it scales well on all types of screens. Text is much easier to read when each line contains no more than 40 characters. You should also adjust the line spacing.&nbsp;<\/p>\n\n\n\n<p>If your app involves visual content like images and videos, make sure your app can be viewed in both &#8211; portrait and landscape modes.&nbsp;<\/p>\n\n\n\n<p>For apps that focus on education or learning features, special attention must be given to interface design and user experience. To implement a high-quality <a href=\"https:\/\/binary-studio.com\/elearning-app-development\">elearning mobile app<\/a> that incorporates all principles of adaptability, accessibility, and minimal user effort, Binary Studio offers comprehensive development solutions.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-make-sure-your-pages-are-built-for-mobile\">Make sure your pages are built for mobile<img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/lh6.googleusercontent.com\/M8sZq35oA1oga3D08li8YiA1Af_NzxJA39SH93vAqoh6PQvYPwDS0EHCQjb4IQ4Bo7i5YL6qfss-9b94i5Lt8r5w9nCMgBP3-0xrpgc25MctpKSKYpkjAHOygvyMetkEtVI5sPGY\" width=\"624\" height=\"249\"><\/h3>\n\n\n\n<p>When building a layout for your app, design easily clickable and properly spaced-out buttons. Users shouldn\u2019t accidentally click something they\u2019re not supposed to. For instance, put enough space between the Back and Next buttons to avoid accidental clicks.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-make-sure-your-pages-are-built-for-different-kinds-of-devices\">Make sure your pages are built for different kinds of devices<\/h3>\n\n\n\n<p>Your app will be viewed on smartphones with 4-inch screens as well as 12+ inch tablets. Make sure your content properly scales to fill available space on larger screens. Make sure pages don&#8217;t look crowded on small screens.&nbsp;<\/p>\n\n\n\n<div style=\"height:20px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-principle-9-do-app-design-for-humans\">Principle 9: Do app design for humans<\/h2>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-font-size\">Font Size<\/h3>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh6.googleusercontent.com\/Pxq0-uT-aSi1Dcy3yvexu0RBhltRT_eK2M5XjyoZNof21YWrxR3gAs7L_c7r2nuaf0QNtJdlHuk2ZiZ1CH0AIK9X-Kr2I2XDVRsEaVir8duZDF8ZAFrQlRNMplxYEVFmDFD9N8FD\" alt=\"\"\/><\/figure>\n\n\n\n<p>A sizable portion of Internet users today have impaired vision. Use a font size of at least 16px so that your text is legible to everyone.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-color-blindness\">Color blindness<\/h3>\n\n\n\n<p>You shouldn\u2019t rely solely on colors to communicate with your users. You should also use symbols so that color-blind people can understand the message.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-deafness\">Deafness<\/h3>\n\n\n\n<p>Your app should be adapted for the deaf and hard of hearing, especially if it contains sound components. Video and audio content should be captioned and subtitled.&nbsp;&nbsp;<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-disabilities\">Disabilities<img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/lh6.googleusercontent.com\/DztOJEKNYoNzeb8pQU3enEPMeLMo8QbPZ3ibIBfGGKzGe0dCLnc6BPeErt8Vn5dBZhTYXTgtSmgECL3fdMmtaA55dw1QGlL8MQx-zTWkvWveQoitxrAVOqTVlGtwYqn8DGySLvwb\" width=\"624\" height=\"249\"><\/h3>\n\n\n\n<p><a href=\"https:\/\/www.uxpin.com\/studio\/blog\/react-vs-html\/\" target=\"_blank\" rel=\"noreferrer noopener\">HTML<\/a> has built-in features to communicate the meaning of the content. For instance, you can use alt attributes to describe the visual images for people who can\u2019t see.&nbsp;Read more about <a href=\"https:\/\/www.uxpin.com\/studio\/blog\/8-website-accessibility-best-practices-to-improve-ux\/\" target=\"_blank\" rel=\"noreferrer noopener\">accessibility standards in UX<\/a>.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-gender-selections\">Gender selections<\/h3>\n\n\n\n<p>Unless the core functionality of your app revolves around the user\u2019s gender, don&#8217;t ask them to specify their gender. If you run a simple business like a car rental service, there\u2019s no need to know the customer\u2019s gender.&nbsp;It also pertains having <a href=\"https:\/\/www.uxpin.com\/studio\/blog\/inclusive-web-design\/\" target=\"_blank\" rel=\"noreferrer noopener\">inclusivity by default<\/a> in your visual and <a href=\"https:\/\/www.uxpin.com\/studio\/blog\/what-is-content-design\/\" target=\"_blank\" rel=\"noreferrer noopener\">content design<\/a>.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-design-interfaces-in-uxpin\">Design interfaces in UXPin<\/h2>\n\n\n\n<p>Designing an app from scratch is a lot of work. Thankfully, you can use <a href=\"https:\/\/www.uxpin.com\/\" target=\"_blank\" rel=\"noreferrer noopener\">UXPin<\/a> and its built-in accessibility features to design an app that is accessible to everyone. You can start creating beautiful code-based designs right away by signing up for a <a href=\"https:\/\/www.uxpin.com\/sign-up\" target=\"_blank\" rel=\"noreferrer noopener\">14-day free trial<\/a>.&nbsp;<\/p>\n\n\n\n<div class=\"wp-block-button is-style-fill\"><center><a class=\"btn btn-flat btn-large btn-content-width\" href=\"https:\/\/www.uxpin.com\/sign-up\" target=\"_blank\" rel=\"noopener\">Try UXPin for free<\/a><\/center><\/div>\n","protected":false},"excerpt":{"rendered":"<p>App design is a combination of UI and UX design to build out a usable piece of software. Modern users don\u2019t have patience for apps that are confusing to use. Ideal mobile app design is good-looking, functional, and straightforward all at the same time.&nbsp; So, how do you measure good app design? A good app<\/p>\n","protected":false},"author":3,"featured_media":31271,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[3],"tags":[],"class_list":["post-31270","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-blog"],"yoast_title":"","yoast_metadesc":"Discover these 9 principles of mobile app design and see how you can incorporate them into your design work.","acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v27.4 (Yoast SEO v27.4) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>9 Principles of Mobile App Design | UXPin<\/title>\n<meta name=\"description\" content=\"Discover these 9 principles of mobile app design and see how you can incorporate them into your design work.\" \/>\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.uxpin.com\/studio\/blog\/principles-mobile-app-design\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"9 Principles of Mobile App Design\" \/>\n<meta property=\"og:description\" content=\"Discover these 9 principles of mobile app design and see how you can incorporate them into your design work.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.uxpin.com\/studio\/blog\/principles-mobile-app-design\/\" \/>\n<meta property=\"og:site_name\" content=\"Studio by UXPin\" \/>\n<meta property=\"article:published_time\" content=\"2021-08-10T14:36:31+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-10-07T23:22:42+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/08\/The-9-Principles-of-Mobile-App-Design.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1200\" \/>\n\t<meta property=\"og:image:height\" content=\"600\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"UXPin\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@uxpin\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"UXPin\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"14 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/principles-mobile-app-design\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/principles-mobile-app-design\\\/\"},\"author\":{\"name\":\"UXPin\",\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/#\\\/schema\\\/person\\\/e0326509b38ce2a3ce62e40ddde9cf8e\"},\"headline\":\"9 Principles of Mobile App Design\",\"datePublished\":\"2021-08-10T14:36:31+00:00\",\"dateModified\":\"2025-10-07T23:22:42+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/principles-mobile-app-design\\\/\"},\"wordCount\":2280,\"image\":{\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/principles-mobile-app-design\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/wp-content\\\/uploads\\\/2021\\\/08\\\/The-9-Principles-of-Mobile-App-Design.png\",\"articleSection\":[\"Blog\"],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/principles-mobile-app-design\\\/\",\"url\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/principles-mobile-app-design\\\/\",\"name\":\"9 Principles of Mobile App Design | UXPin\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/principles-mobile-app-design\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/principles-mobile-app-design\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/wp-content\\\/uploads\\\/2021\\\/08\\\/The-9-Principles-of-Mobile-App-Design.png\",\"datePublished\":\"2021-08-10T14:36:31+00:00\",\"dateModified\":\"2025-10-07T23:22:42+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/#\\\/schema\\\/person\\\/e0326509b38ce2a3ce62e40ddde9cf8e\"},\"description\":\"Discover these 9 principles of mobile app design and see how you can incorporate them into your design work.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/principles-mobile-app-design\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/principles-mobile-app-design\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/principles-mobile-app-design\\\/#primaryimage\",\"url\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/wp-content\\\/uploads\\\/2021\\\/08\\\/The-9-Principles-of-Mobile-App-Design.png\",\"contentUrl\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/wp-content\\\/uploads\\\/2021\\\/08\\\/The-9-Principles-of-Mobile-App-Design.png\",\"width\":1200,\"height\":600,\"caption\":\"The 9 Principles of Mobile App Design\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/principles-mobile-app-design\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"9 Principles of Mobile App Design\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/#website\",\"url\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/\",\"name\":\"Studio by UXPin\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/#\\\/schema\\\/person\\\/e0326509b38ce2a3ce62e40ddde9cf8e\",\"name\":\"UXPin\",\"description\":\"UXPin is a web-based design collaboration tool. We\u2019re pleased to share our knowledge here.\",\"sameAs\":[\"http:\\\/\\\/www.uxpin.com\",\"https:\\\/\\\/x.com\\\/@uxpin\"],\"url\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/author\\\/hello\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"9 Principles of Mobile App Design | UXPin","description":"Discover these 9 principles of mobile app design and see how you can incorporate them into your design work.","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.uxpin.com\/studio\/blog\/principles-mobile-app-design\/","og_locale":"en_US","og_type":"article","og_title":"9 Principles of Mobile App Design","og_description":"Discover these 9 principles of mobile app design and see how you can incorporate them into your design work.","og_url":"https:\/\/www.uxpin.com\/studio\/blog\/principles-mobile-app-design\/","og_site_name":"Studio by UXPin","article_published_time":"2021-08-10T14:36:31+00:00","article_modified_time":"2025-10-07T23:22:42+00:00","og_image":[{"width":1200,"height":600,"url":"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/08\/The-9-Principles-of-Mobile-App-Design.png","type":"image\/png"}],"author":"UXPin","twitter_card":"summary_large_image","twitter_creator":"@uxpin","twitter_misc":{"Written by":"UXPin","Est. reading time":"14 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.uxpin.com\/studio\/blog\/principles-mobile-app-design\/#article","isPartOf":{"@id":"https:\/\/www.uxpin.com\/studio\/blog\/principles-mobile-app-design\/"},"author":{"name":"UXPin","@id":"https:\/\/www.uxpin.com\/studio\/#\/schema\/person\/e0326509b38ce2a3ce62e40ddde9cf8e"},"headline":"9 Principles of Mobile App Design","datePublished":"2021-08-10T14:36:31+00:00","dateModified":"2025-10-07T23:22:42+00:00","mainEntityOfPage":{"@id":"https:\/\/www.uxpin.com\/studio\/blog\/principles-mobile-app-design\/"},"wordCount":2280,"image":{"@id":"https:\/\/www.uxpin.com\/studio\/blog\/principles-mobile-app-design\/#primaryimage"},"thumbnailUrl":"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/08\/The-9-Principles-of-Mobile-App-Design.png","articleSection":["Blog"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/www.uxpin.com\/studio\/blog\/principles-mobile-app-design\/","url":"https:\/\/www.uxpin.com\/studio\/blog\/principles-mobile-app-design\/","name":"9 Principles of Mobile App Design | UXPin","isPartOf":{"@id":"https:\/\/www.uxpin.com\/studio\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.uxpin.com\/studio\/blog\/principles-mobile-app-design\/#primaryimage"},"image":{"@id":"https:\/\/www.uxpin.com\/studio\/blog\/principles-mobile-app-design\/#primaryimage"},"thumbnailUrl":"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/08\/The-9-Principles-of-Mobile-App-Design.png","datePublished":"2021-08-10T14:36:31+00:00","dateModified":"2025-10-07T23:22:42+00:00","author":{"@id":"https:\/\/www.uxpin.com\/studio\/#\/schema\/person\/e0326509b38ce2a3ce62e40ddde9cf8e"},"description":"Discover these 9 principles of mobile app design and see how you can incorporate them into your design work.","breadcrumb":{"@id":"https:\/\/www.uxpin.com\/studio\/blog\/principles-mobile-app-design\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.uxpin.com\/studio\/blog\/principles-mobile-app-design\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.uxpin.com\/studio\/blog\/principles-mobile-app-design\/#primaryimage","url":"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/08\/The-9-Principles-of-Mobile-App-Design.png","contentUrl":"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2021\/08\/The-9-Principles-of-Mobile-App-Design.png","width":1200,"height":600,"caption":"The 9 Principles of Mobile App Design"},{"@type":"BreadcrumbList","@id":"https:\/\/www.uxpin.com\/studio\/blog\/principles-mobile-app-design\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.uxpin.com\/studio\/"},{"@type":"ListItem","position":2,"name":"9 Principles of Mobile App Design"}]},{"@type":"WebSite","@id":"https:\/\/www.uxpin.com\/studio\/#website","url":"https:\/\/www.uxpin.com\/studio\/","name":"Studio by UXPin","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.uxpin.com\/studio\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/www.uxpin.com\/studio\/#\/schema\/person\/e0326509b38ce2a3ce62e40ddde9cf8e","name":"UXPin","description":"UXPin is a web-based design collaboration tool. We\u2019re pleased to share our knowledge here.","sameAs":["http:\/\/www.uxpin.com","https:\/\/x.com\/@uxpin"],"url":"https:\/\/www.uxpin.com\/studio\/author\/hello\/"}]}},"_links":{"self":[{"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/posts\/31270","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/comments?post=31270"}],"version-history":[{"count":8,"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/posts\/31270\/revisions"}],"predecessor-version":[{"id":57202,"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/posts\/31270\/revisions\/57202"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/media\/31271"}],"wp:attachment":[{"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/media?parent=31270"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/categories?post=31270"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/tags?post=31270"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}