{"id":15541,"date":"2018-07-04T15:13:35","date_gmt":"2018-07-04T14:13:35","guid":{"rendered":"https:\/\/marvel7077.wpengine.com\/?p=15541"},"modified":"2023-07-25T23:06:34","modified_gmt":"2023-07-25T22:06:34","slug":"design-principles-help-shape-best-user-experience","status":"publish","type":"post","link":"https:\/\/marvelapp.com\/blog\/design-principles-help-shape-best-user-experience\/","title":{"rendered":"UX Design Principles That Help You Shape The Best User Experience"},"content":{"rendered":"<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\"><em>Every product has an ultimate goal \u2014 to help people solve certain problems. When designing a product, you need to keep user experience in mind, you don\u2019t want to create a product that is more complicated than the actual problem the users have. There are some User experience principles to follow when designing a product. It could be an app, a website or a physical product. These UX design principles would help you shape better user experience.<\/em><\/p>\n<h2 class=\"pageWrap pageWrap--s marginTop-xl marginBottom-l c-black lineHeight-xl fontSize-xl fontWeight-5 breakPointM-lineHeight-xxl breakPointM-fontSize-xxl\" style=\"margin-left: auto; margin-right: auto;\">User Experience Principle 1: Don\u2019t Make The Users Think<\/h2>\n<blockquote class=\"pageWrap pageWrap--s position-relative marginTopBottom-l breakPointM-marginTopBottom-xl\"><div class=\"blog-quote-before position-absolute bg-marvel\"><\/div><div class=\"tweet-quote blog-quote-after position-absolute bg-marvel cursor-pointer transitionDuration-l transitionProperty-all transitionTimingFunction-cv-easeOutCircular scaleUp--hover zi-weak\"><svg class=\"fill-white opacity-0 pointerEvents-none position-absolute pinCenter transitionProperty-all transitionTimingFunction-easeInOut\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"24\" height=\"20\" viewBox=\"0 0 24 20\"><path d=\"M24,2.37a9.64,9.64,0,0,1-2.83.79A5,5,0,0,0,23.34.37a9.72,9.72,0,0,1-3.13,1.23A4.86,4.86,0,0,0,16.62,0a5,5,0,0,0-4.8,6.2A13.87,13.87,0,0,1,1.67.92,5.13,5.13,0,0,0,3.19,7.67,4.81,4.81,0,0,1,1,7a5,5,0,0,0,3.95,5,4.82,4.82,0,0,1-2.22.09,4.94,4.94,0,0,0,4.6,3.51A9.72,9.72,0,0,1,0,17.73,13.69,13.69,0,0,0,7.55,20c9.14,0,14.31-7.92,14-15A10.17,10.17,0,0,0,24,2.37Z\"\/><\/svg><\/div><p class=\"blog-quote position-relative textAlign-center c-marvel\"><span class=\"blog-quote-text transitionDuration-l transitionProperty-all transitionTimingFunction-easeInOut\">\"Any product that needs a manual to work is broken.\" \u2014 Elon Musk<\/p><\/span><\/blockquote>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\"><iframe loading=\"lazy\" class=\"display-block marginTopBottom-l centered\" class=\"giphy-embed\" src=\"https:\/\/giphy.com\/embed\/TPl5N4Ci49ZQY\" width=\"480\" height=\"360\" frameborder=\"0\" allowfullscreen=\"allowfullscreen\"><\/iframe><\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\"><\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">People find your product and they hope that your product would be the solution to their problem. They have spent some time to read the product description and finally sign up for a trial. When they start using your product, they realise that there is a steep learning curve, despite with the aid of your customer service team and knowledge base.<\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">If your customers are leaving because your product is too difficult to use, you may want to check the design of your product to see if you can simplify some steps or rearrange some functionalities to make it easier to use. Often times, when users complain that the product is too difficult to use, the company usually would think about improving the knowledge base, adding more tutorials and so on but the company doesn\u2019t realise that the cause actually lies within the product.<\/p>\n<h2 class=\"pageWrap pageWrap--s marginTop-xl marginBottom-l c-black lineHeight-xl fontSize-xl fontWeight-5 breakPointM-lineHeight-xxl breakPointM-fontSize-xxl\" style=\"margin-left: auto; margin-right: auto;\">User Experience Principle 2: Think Beyond Visual Presentation<\/h2>\n<blockquote class=\"pageWrap pageWrap--s position-relative marginTopBottom-l breakPointM-marginTopBottom-xl\"><div class=\"blog-quote-before position-absolute bg-marvel\"><\/div><div class=\"tweet-quote blog-quote-after position-absolute bg-marvel cursor-pointer transitionDuration-l transitionProperty-all transitionTimingFunction-cv-easeOutCircular scaleUp--hover zi-weak\"><svg class=\"fill-white opacity-0 pointerEvents-none position-absolute pinCenter transitionProperty-all transitionTimingFunction-easeInOut\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"24\" height=\"20\" viewBox=\"0 0 24 20\"><path d=\"M24,2.37a9.64,9.64,0,0,1-2.83.79A5,5,0,0,0,23.34.37a9.72,9.72,0,0,1-3.13,1.23A4.86,4.86,0,0,0,16.62,0a5,5,0,0,0-4.8,6.2A13.87,13.87,0,0,1,1.67.92,5.13,5.13,0,0,0,3.19,7.67,4.81,4.81,0,0,1,1,7a5,5,0,0,0,3.95,5,4.82,4.82,0,0,1-2.22.09,4.94,4.94,0,0,0,4.6,3.51A9.72,9.72,0,0,1,0,17.73,13.69,13.69,0,0,0,7.55,20c9.14,0,14.31-7.92,14-15A10.17,10.17,0,0,0,24,2.37Z\"\/><\/svg><\/div><p class=\"blog-quote position-relative textAlign-center c-marvel\"><span class=\"blog-quote-text transitionDuration-l transitionProperty-all transitionTimingFunction-easeInOut\">\"Design is not just what it looks like and feels like. Design is how it works.\" \u2014 Steve Jobs<\/p><\/span><\/blockquote>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">When designing a product, for instance, a website, appearance usually comes first. People usually start with the layout, the colour palette, the typography and so on but pay little to zero attention to the usability and <a class=\"link link--blue fontWeight-4\"href=\"https:\/\/marvelapp.com\/blog\/designing-for-experience\/\">user experience<\/a>. Undeniably, the appearance creates the very first impression but if your product just has a pretty outlook but does not provide a great experience when using it, your product is not a complete product.<\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">A good example (from my personal experience) is Instagram. Instagram has a good user interface, I see lots of great images and posts every day and the users can add a filter and a caption, etc. to their images. However, it is not possible to add a clickable link to an image. Instagram becomes a popular and effective marketing tool in recent years but this missing feature does drive some marketers away.<\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">As a user, when I saw a delicious food image from a home chef, I want to read the recipe. To do that, I have to go to the home chef\u2019s Instagram profile, click on the link to her blog and then look for the recipe on her blog \u2014 don\u2019t you think it would be much easier if a clickable link could be included in the Instagram post? This is a very good example of having a pretty interface but the product is lack of a great user experience.<\/p>\n<h2 class=\"pageWrap pageWrap--s marginTop-xl marginBottom-l c-black lineHeight-xl fontSize-xl fontWeight-5 breakPointM-lineHeight-xxl breakPointM-fontSize-xxl\" style=\"margin-left: auto; margin-right: auto;\">UX Design Principle 3: Let Your Users Get Involved in the Product Design Process<\/h2>\n<blockquote class=\"pageWrap pageWrap--s position-relative marginTopBottom-l breakPointM-marginTopBottom-xl\"><div class=\"blog-quote-before position-absolute bg-marvel\"><\/div><div class=\"tweet-quote blog-quote-after position-absolute bg-marvel cursor-pointer transitionDuration-l transitionProperty-all transitionTimingFunction-cv-easeOutCircular scaleUp--hover zi-weak\"><svg class=\"fill-white opacity-0 pointerEvents-none position-absolute pinCenter transitionProperty-all transitionTimingFunction-easeInOut\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"24\" height=\"20\" viewBox=\"0 0 24 20\"><path d=\"M24,2.37a9.64,9.64,0,0,1-2.83.79A5,5,0,0,0,23.34.37a9.72,9.72,0,0,1-3.13,1.23A4.86,4.86,0,0,0,16.62,0a5,5,0,0,0-4.8,6.2A13.87,13.87,0,0,1,1.67.92,5.13,5.13,0,0,0,3.19,7.67,4.81,4.81,0,0,1,1,7a5,5,0,0,0,3.95,5,4.82,4.82,0,0,1-2.22.09,4.94,4.94,0,0,0,4.6,3.51A9.72,9.72,0,0,1,0,17.73,13.69,13.69,0,0,0,7.55,20c9.14,0,14.31-7.92,14-15A10.17,10.17,0,0,0,24,2.37Z\"\/><\/svg><\/div><p class=\"blog-quote position-relative textAlign-center c-marvel\"><span class=\"blog-quote-text transitionDuration-l transitionProperty-all transitionTimingFunction-easeInOut\">\"To be a great designer, you need to look a little deeper into how people think and act.\" \u2014 Paul Boag<\/p><\/span><\/blockquote>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\"><iframe loading=\"lazy\" class=\"display-block marginTopBottom-l centered\" class=\"giphy-embed\" src=\"https:\/\/giphy.com\/embed\/3orieK1afzsaHU4IfK\" width=\"480\" height=\"364\" frameborder=\"0\" allowfullscreen=\"allowfullscreen\"><\/iframe><\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\"><\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">You may have a world class UI and <a class=\"link link--blue fontWeight-4\"href=\"https:\/\/marvelapp.com\/blog\/introduction-user-experience-design\/\">UX design<\/a> team but the people who know your product the best are your users. They use your product so often that they may find a bug before your developers. This is the same for your product design. Your users would be able to point out the design issues before your designers suggest some improvements.<\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">So how to get your users involved? The easiest way is to get feedback through surveys but surveys usually can only give you some quantitative insights, for instance, how many people like the UI instead of why they like the UI. If you add the \u201cWhy\u201d questions in your surveys, the response rate would be low as your surveys would become too long and boring.<\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">To solve this problem, you can have both surveys and focus groups. Surveys can serve as the first line of getting some quick feedback and focus groups provide you with more qualitative insights. During a focus group session, you can ask your users some more in-depth questions so you could get to the bottom of the design issues.<\/p>\n<h2 class=\"pageWrap pageWrap--s marginTop-xl marginBottom-l c-black lineHeight-xl fontSize-xl fontWeight-5 breakPointM-lineHeight-xxl breakPointM-fontSize-xxl\" style=\"margin-left: auto; margin-right: auto;\">UX Design Principle 4: Keep Your Product Design Consistent<\/h2>\n<blockquote class=\"pageWrap pageWrap--s position-relative marginTopBottom-l breakPointM-marginTopBottom-xl\"><div class=\"blog-quote-before position-absolute bg-marvel\"><\/div><div class=\"tweet-quote blog-quote-after position-absolute bg-marvel cursor-pointer transitionDuration-l transitionProperty-all transitionTimingFunction-cv-easeOutCircular scaleUp--hover zi-weak\"><svg class=\"fill-white opacity-0 pointerEvents-none position-absolute pinCenter transitionProperty-all transitionTimingFunction-easeInOut\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"24\" height=\"20\" viewBox=\"0 0 24 20\"><path d=\"M24,2.37a9.64,9.64,0,0,1-2.83.79A5,5,0,0,0,23.34.37a9.72,9.72,0,0,1-3.13,1.23A4.86,4.86,0,0,0,16.62,0a5,5,0,0,0-4.8,6.2A13.87,13.87,0,0,1,1.67.92,5.13,5.13,0,0,0,3.19,7.67,4.81,4.81,0,0,1,1,7a5,5,0,0,0,3.95,5,4.82,4.82,0,0,1-2.22.09,4.94,4.94,0,0,0,4.6,3.51A9.72,9.72,0,0,1,0,17.73,13.69,13.69,0,0,0,7.55,20c9.14,0,14.31-7.92,14-15A10.17,10.17,0,0,0,24,2.37Z\"\/><\/svg><\/div><p class=\"blog-quote position-relative textAlign-center c-marvel\"><span class=\"blog-quote-text transitionDuration-l transitionProperty-all transitionTimingFunction-easeInOut\">\"As far as the customer is concerned, the interface is the product.\" \u2014 Jef Raskin<\/p><\/span><\/blockquote>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\"><a class=\"link link--blue fontWeight-4\"href=\"https:\/\/marvel7077.wpengine.com\/wp-content\/uploads\/2018\/07\/1ItmYVF231gAB5_R_I8P1vQ.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-6580 size-full\" src=\"https:\/\/marvel7077.wpengine.com\/wp-content\/uploads\/2018\/07\/1ItmYVF231gAB5_R_I8P1vQ.png\" alt=\"Keep Your Product Design Consistent\" width=\"1432\" height=\"806\" \/><\/a><br \/>\nMost users do not like surprises (in a bad way) when using your product. Let\u2019s take Microsoft Office as an example. The way to save a Word document, an Excel spreadsheet and a <a class=\"link link--blue fontWeight-4\"href=\"https:\/\/slidemodel.com\/how-to-make-a-presentation\/\">Powerpoint presentation<\/a> are all the same. Once you know how to use Microsoft Word, you more or less know how to use the basics of Microsoft Powerpoint.<\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">By keeping the basic features and interface the same across the entire product series, your users would save the time to learn when using them and thus better user experience. Apart from the features, it is equally important to keep the branding design consistent.<\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">We go back to the Microsoft Office example, their user interfaces use the same typography, the same line height, the same letter spacing, the only difference is the theme colours \u2014 Word is blue, Excel is green and Powerpoint is orange. By having the consistent interface design, users feel more comfortable and confident when using your products.<\/p>\n<h2 class=\"pageWrap pageWrap--s marginTop-xl marginBottom-l c-black lineHeight-xl fontSize-xl fontWeight-5 breakPointM-lineHeight-xxl breakPointM-fontSize-xxl\" style=\"margin-left: auto; margin-right: auto;\">Principle 5: Make Your Design Work for\u00a0Everyone<\/h2>\n<blockquote class=\"twitter-tweet\" data-lang=\"en\">\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\"dir=\"ltr\" lang=\"en\">When UX doesn't consider ALL users, shouldn't it be known as \"SOME User Experience\" or... SUX? <a class=\"link link--blue fontWeight-4\"href=\"https:\/\/twitter.com\/hashtag\/a11y?src=hash&amp;ref_src=twsrc%5Etfw\">#a11y<\/a><\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">\u2014 Billy Gregory (@thebillygregory) <a class=\"link link--blue fontWeight-4\"href=\"https:\/\/twitter.com\/thebillygregory\/status\/552466012713783297?ref_src=twsrc%5Etfw\">January 6, 2015<\/a><\/p><\/span><\/blockquote>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\"><script async src=\"https:\/\/platform.twitter.com\/widgets.js\" charset=\"utf-8\"><\/script><\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">I noticed some websites and apps are using a black background and the text is in darker shade of grey, for me, I have no problem with reading the text but for colour blind people, they would have a really hard time to interact with such websites and apps because the background colour and the text do not have enough contrast.<\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">When designing your product, keep the people with disability in mind. Colour blindness affects 1 in 12 men and 1 in 200 women in the world. This is not a rare disability and lots of designers don\u2019t consider how accessible the product is for this group of users.<\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">Another example is, if your website or app\u2019s target users involve elderly, you may want to add a function to enlarge the text so they would be able to read the text more easily.<\/p>\n<h2 class=\"pageWrap pageWrap--s marginTop-xl marginBottom-l c-black lineHeight-xl fontSize-xl fontWeight-5 breakPointM-lineHeight-xxl breakPointM-fontSize-xxl\" style=\"margin-left: auto; margin-right: auto;\">Conclusion<\/h2>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\"><span class=\"long-quote\">\"It is not enough that we build products that function, that are understandable and usable, we also need to build products that bring joy and excitement, pleasure and fun, and, yes, beauty to people\u2019s lives.\" \u2014 Don Norman<\/span><\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">The quote above is so true and every designer should keep that in mind. Design a stylish, good-looking product is easy but design a product that can bring joy and a great user experience requires more time, effort and empathy but these won\u2019t become a waste, your users would appreciate everything.<\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\"><em>This article was originally published by <a class=\"link link--blue fontWeight-4\"href=\"https:\/\/uxplanet.org\/design-principles-that-help-you-shape-the-best-user-experience-260ad3a1bb83\">UX Planet<\/a>.<\/em><\/p>\n<h3 class=\"pageWrap pageWrap--s marginTop-l marginBottom-m c-black lineHeight-xl fontSize-xl fontWeight-5\">Further reading:<\/h3>\n<ul class=\"pageWrap pageWrap--s list list--unordered marginBottom-l lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">\n<li class=\"LinkSuggestion__LinkSuggestionWrapper-sc-1mdih4x-0 bRwwZe\"><a class=\"link link--blue fontWeight-4\"class=\"LinkSuggestion__Link-sc-1mdih4x-2 dcwLhi\" href=\"https:\/\/marvelapp.com\/blog\/designing-cause-find-really-like-first\/\" target=\"_blank\" rel=\"noopener noreferrer\">Designing for a Cause? Find out What It\u2019s Really like First<\/a><\/li>\n<li class=\"LinkSuggestion__LinkSuggestionWrapper-sc-1mdih4x-0 bRwwZe\"><a class=\"link link--blue fontWeight-4\"class=\"LinkSuggestion__Link-sc-1mdih4x-2 dcwLhi\" href=\"https:\/\/marvelapp.com\/blog\/designing-styleguide-elements-building-compelling-products\/\" target=\"_blank\" rel=\"noopener noreferrer\">Designing a Styleguide: Elements That Go Into Building Compelling Products<\/a><\/li>\n<li class=\"LinkSuggestion__LinkSuggestionWrapper-sc-1mdih4x-0 bRwwZe\"><a class=\"link link--blue fontWeight-4\"class=\"LinkSuggestion__Link-sc-1mdih4x-2 dcwLhi\" href=\"https:\/\/marvelapp.com\/blog\/style-guides-better-design-development\/\" target=\"_blank\" rel=\"noopener noreferrer\">Style Guides for Better Design and Development<\/a><\/li>\n<li class=\"LinkSuggestion__LinkSuggestionWrapper-sc-1mdih4x-0 bRwwZe\"><a class=\"link link--blue fontWeight-4\"class=\"LinkSuggestion__Link-sc-1mdih4x-2 dcwLhi\" href=\"https:\/\/marvelapp.com\/blog\/need-ui-guidelines\/\" target=\"_blank\" rel=\"noopener noreferrer\">Why You Need UI Guidelines?<\/a><\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>Every product has an ultimate goal \u2014 to help people solve certain problems. When designing a product, you need to keep user experience in mind, you don\u2019t want to create a product that is more complicated than the actual problem the users have. There are some User experience principles to follow when designing a product. It could be an app,&#8230; <a class=\"link link--blue fontWeight-4\" href=\"https:\/\/marvelapp.com\/blog\/design-principles-help-shape-best-user-experience\/\">Read More &#65515;<\/a><\/p>\n","protected":false},"author":241,"featured_media":15556,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[11],"tags":[],"class_list":["post-15541","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-viewpoint"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v15.5 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<meta name=\"description\" content=\"There are some User experience principles to follow when designing a product. These UX design principles will help you shape better user experience.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/marvelapp.com\/blog\/design-principles-help-shape-best-user-experience\/\" \/>\n<meta property=\"og:locale\" content=\"en_GB\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"UX Design Principles That Help You Shape The Best User Experience | Marvel Blog\" \/>\n<meta property=\"og:description\" content=\"There are some User experience principles to follow when designing a product. These UX design principles will help you shape better user experience.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/marvelapp.com\/blog\/design-principles-help-shape-best-user-experience\/\" \/>\n<meta property=\"og:site_name\" content=\"Marvel Blog\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/marvelapp\" \/>\n<meta property=\"article:published_time\" content=\"2018-07-04T14:13:35+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-07-25T22:06:34+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/marvelapp.com\/wp-content\/uploads\/2018\/07\/ijbon.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1600\" \/>\n\t<meta property=\"og:image:height\" content=\"800\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@marvelapp\" \/>\n<meta name=\"twitter:site\" content=\"@marvelapp\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\">\n\t<meta name=\"twitter:data1\" content=\"5 minutes\">\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Organization\",\"@id\":\"https:\/\/marvelapp.com\/blog\/#organization\",\"name\":\"Marvel\",\"url\":\"https:\/\/marvelapp.com\/blog\/\",\"sameAs\":[\"https:\/\/www.facebook.com\/marvelapp\",\"https:\/\/www.instagram.com\/marvelapp\/\",\"https:\/\/www.linkedin.com\/company\/marvel-app\/\",\"https:\/\/twitter.com\/marvelapp\"],\"logo\":{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/marvelapp.com\/blog\/#logo\",\"inLanguage\":\"en-GB\",\"url\":\"https:\/\/marvelapp.com\/wp-content\/uploads\/2018\/06\/Logo-Light.png\",\"width\":1605,\"height\":1130,\"caption\":\"Marvel\"},\"image\":{\"@id\":\"https:\/\/marvelapp.com\/blog\/#logo\"}},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/marvelapp.com\/blog\/#website\",\"url\":\"https:\/\/marvelapp.com\/blog\/\",\"name\":\"Marvel Blog\",\"description\":\"Ideas and words on user experience, design, collaboration and more\",\"publisher\":{\"@id\":\"https:\/\/marvelapp.com\/blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":\"https:\/\/marvelapp.com\/blog\/?s={search_term_string}\",\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-GB\"},{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/marvelapp.com\/blog\/design-principles-help-shape-best-user-experience\/#primaryimage\",\"inLanguage\":\"en-GB\",\"url\":\"https:\/\/marvelapp.com\/wp-content\/uploads\/2018\/07\/ijbon.png\",\"width\":\"1600\",\"height\":\"800\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/marvelapp.com\/blog\/design-principles-help-shape-best-user-experience\/#webpage\",\"url\":\"https:\/\/marvelapp.com\/blog\/design-principles-help-shape-best-user-experience\/\",\"name\":\"UX Design Principles That Help You Shape The Best User Experience | Marvel Blog\",\"isPartOf\":{\"@id\":\"https:\/\/marvelapp.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/marvelapp.com\/blog\/design-principles-help-shape-best-user-experience\/#primaryimage\"},\"datePublished\":\"2018-07-04T14:13:35+00:00\",\"dateModified\":\"2023-07-25T22:06:34+00:00\",\"description\":\"There are some User experience principles to follow when designing a product. These UX design principles will help you shape better user experience.\",\"inLanguage\":\"en-GB\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/marvelapp.com\/blog\/design-principles-help-shape-best-user-experience\/\"]}]},{\"@type\":\"Article\",\"@id\":\"https:\/\/marvelapp.com\/blog\/design-principles-help-shape-best-user-experience\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/marvelapp.com\/blog\/design-principles-help-shape-best-user-experience\/#webpage\"},\"author\":{\"@id\":\"https:\/\/marvelapp.com\/blog\/#\/schema\/person\/8e6e5ca288f86427928da68c7501ecaf\"},\"headline\":\"UX Design Principles That Help You Shape The Best User Experience\",\"datePublished\":\"2018-07-04T14:13:35+00:00\",\"dateModified\":\"2023-07-25T22:06:34+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/marvelapp.com\/blog\/design-principles-help-shape-best-user-experience\/#webpage\"},\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/marvelapp.com\/blog\/#organization\"},\"image\":{\"@id\":\"https:\/\/marvelapp.com\/blog\/design-principles-help-shape-best-user-experience\/#primaryimage\"},\"articleSection\":\"Viewpoint\",\"inLanguage\":\"en-GB\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/marvelapp.com\/blog\/design-principles-help-shape-best-user-experience\/#respond\"]}]},{\"@type\":\"Person\",\"@id\":\"https:\/\/marvelapp.com\/blog\/#\/schema\/person\/8e6e5ca288f86427928da68c7501ecaf\",\"name\":\"Ainsley Yeung\",\"image\":{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/marvelapp.com\/blog\/#personlogo\",\"inLanguage\":\"en-GB\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/b084c4437dc9da6fedbf6430b920abaa05db814be855c34f2f8286f062edb174?s=96&d=mm&r=g\",\"caption\":\"Ainsley Yeung\"},\"description\":\"Marketing &amp; customer service professional in Sweden Contributor: UX Planet | The Startup. Twitter: @YeungAinsley\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","_links":{"self":[{"href":"https:\/\/marvelapp.com\/blog\/wp-json\/wp\/v2\/posts\/15541","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/marvelapp.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/marvelapp.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/marvelapp.com\/blog\/wp-json\/wp\/v2\/users\/241"}],"replies":[{"embeddable":true,"href":"https:\/\/marvelapp.com\/blog\/wp-json\/wp\/v2\/comments?post=15541"}],"version-history":[{"count":0,"href":"https:\/\/marvelapp.com\/blog\/wp-json\/wp\/v2\/posts\/15541\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/marvelapp.com\/blog\/wp-json\/wp\/v2\/media\/15556"}],"wp:attachment":[{"href":"https:\/\/marvelapp.com\/blog\/wp-json\/wp\/v2\/media?parent=15541"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/marvelapp.com\/blog\/wp-json\/wp\/v2\/categories?post=15541"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/marvelapp.com\/blog\/wp-json\/wp\/v2\/tags?post=15541"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}