{"id":20890,"date":"2020-12-21T18:03:02","date_gmt":"2020-12-21T18:03:02","guid":{"rendered":"https:\/\/marvelapp.com\/blog\/?p=20890"},"modified":"2021-01-22T11:45:14","modified_gmt":"2021-01-22T11:45:14","slug":"ux-principles-back-to-basics","status":"publish","type":"post","link":"https:\/\/marvelapp.com\/blog\/ux-principles-back-to-basics\/","title":{"rendered":"UX Principles: Back to Basics"},"content":{"rendered":"<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\">\"UX design is the process of developing and improving the quality of interaction between a user and all aspects of a company. It's about products that are useful, easy to use, and engaging. UX design focuses on the overall feel of the experience and is not about visuals alone.\"<\/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\"style=\"text-align: center;\">Jason Kalathas, Head of Design at Moosend<\/p>\n<\/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\">According to the above definition, UX design is not only implemented to create a product that will make sense and satisfy a user's intent. It is also the basis for a product's usability and the brand's visual strategy, overall branding, and, of course, the <a class=\"link link--blue fontWeight-4\"href=\"https:\/\/moosend.com\/blog\/content-marketing\/\" target=\"_blank\" rel=\"noopener noreferrer\">content strategy<\/a>, as design that focuses on the prospect and the content they find valuable, consistent and meaningful, is essential to have.<\/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\">Essentially, through UX design, users can enjoy the full experience of a product or even a website as a whole.<\/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\">But as with all things that are simple, UX design is not easy to nail on the first try. This is why you need to familiarize yourself with the basics of UX principles. Which is what this post is all about. So, shall we?<\/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;\">The 4 quintessential UX design principles<\/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\">Yes, I know what you're thinking: UX is a field that is as ever-changing as the users themselves - which makes sense, as it's meant to enhance the user's experience.<\/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\">And while there are plenty of online and website trends a designer can get sucked into, such as implementing an emotional design, there are some <a class=\"link link--blue fontWeight-4\"href=\"https:\/\/www.euruni.edu\/blog\/website-online-marketing-trends-2020\/\" target=\"_blank\" rel=\"noopener noreferrer\">fundamental principles for UX design that engages users.<\/a><\/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;\">1. Always put the user first<\/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\">The user is at the center of all UX design principles, which is to be expected, since the core of UX is the user.<\/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\">Creating a website, a product, or even an email design meant to amaze is one of the biggest traps for designers. <a class=\"link link--blue fontWeight-4\"href=\"https:\/\/blog.codegiant.io\/what-is-the-difference-between-ui-and-ux-75ecab61ba8e\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">UX design is all about creating an unparalleled user experience<\/a>, and this can only stem from the user's intent.<\/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, studying your users' needs is essential, as this is the element that will allow you to make educated decisions.<\/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\">Allow the user to control the product and the end-result by figuring out what they need and why they would use your web page or product and not that of a competitor in your niche.<\/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\">Make sure to study your data, implement heat maps to see the points of your website your users are most or least interested in and create a questionnaire to ask for more feedback on the changes your website may or may not need.<\/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;\">2. Consistency is key to good user experience<\/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\">Imagine opening a book and not understanding how the writer goes from point A to point B. Would you keep reading that book, or would you just drop it for something more enjoyable?<\/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 you're leaning towards the latter, you should ask the same question every time you complicate your UX design. Consistency is one of the most critical components, especially when building a website.<\/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\">Consistency may mean &quot;similarity&quot; in some cases, to wit similar design on different web pages or even similarities between competitors' websites or products. But mainly, consistency means creating an experience that will flow and come naturally to the user.<\/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\"><img loading=\"lazy\" decoding=\"async\" class=\"size-medium wp-image-20928 aligncenter\" src=\"https:\/\/marvelapp.com\/wp-content\/uploads\/2020\/12\/consistency-600x427.png\" alt=\"consistently designed block of flats\" width=\"600\" height=\"427\" srcset=\"https:\/\/marvelapp.com\/wp-content\/uploads\/2020\/12\/consistency-600x427.png 600w, https:\/\/marvelapp.com\/wp-content\/uploads\/2020\/12\/consistency-768x546.png 768w, https:\/\/marvelapp.com\/wp-content\/uploads\/2020\/12\/consistency.png 1440w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \/><\/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\">Consistency is, of course, challenging, and creating something that functions a little too much like what your competitors already have designed may seem counterintuitive.<\/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 reason behind researching competitors to <a class=\"link link--blue fontWeight-4\"href=\"https:\/\/marvelapp.com\/blog\/design-principles-help-shape-best-user-experience\/\" target=\"_blank\" rel=\"noopener noreferrer\">create a great UX design<\/a> that will make sense to your users is the fact that your users will try to give your product or website a shot based on a vague idea of how it should work.<\/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\">Keep in mind that the better the UX, the shorter the learning curve, and the less the people who will bounce or opt-out. Try to be innovative while being consistent through your UX design efforts.<\/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;\">3. Language and typography in UX<\/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\">Simple language is always best, which is evident when writing good product content means writing so a child can understand.<\/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\">Great UX has everything to do with simple language. When a user visits a website, they don't expect to bother with technical terms. Simple, relatable language will stick with them and pop back to their heads when needed, as this is the language they use in their everyday lives.<\/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, you will need to sit down and think of a thing or two:<\/p>\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>What is your brand's tone, and how can you use that language to create consistency?<\/li>\n<li>What is your audience's background, and how simple a language is \"too\" simple?<\/li>\n<li>What is the typography that works best for your audience?<\/li>\n<\/ul>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">Which brings us to the second element of this step: Typography.<\/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\">Typography is just as important to user experience as language, as the &quot;looks&quot; of that language can change the way users perceive it.<\/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\"><img loading=\"lazy\" decoding=\"async\" class=\"size-medium wp-image-20929 aligncenter\" src=\"https:\/\/marvelapp.com\/wp-content\/uploads\/2020\/12\/typography-ux-400x600.png\" alt=\"Typography in UX\" width=\"400\" height=\"600\" srcset=\"https:\/\/marvelapp.com\/wp-content\/uploads\/2020\/12\/typography-ux-400x600.png 400w, https:\/\/marvelapp.com\/wp-content\/uploads\/2020\/12\/typography-ux-1000x1500.png 1000w, https:\/\/marvelapp.com\/wp-content\/uploads\/2020\/12\/typography-ux-768x1152.png 768w, https:\/\/marvelapp.com\/wp-content\/uploads\/2020\/12\/typography-ux-1024x1536.png 1024w, https:\/\/marvelapp.com\/wp-content\/uploads\/2020\/12\/typography-ux.png 1365w\" sizes=\"auto, (max-width: 400px) 100vw, 400px\" \/><\/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, make sure to consider the following when choosing your typography's style:<\/p>\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>What is it that your website is trying to say? Is it a bold statement or a fun suggestion?<\/li>\n<li>Who is going to read it?<\/li>\n<li>How can it be easier for your users to read said statement, and how will it stick with them visually, as well as verbally?<\/li>\n<\/ul>\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;\">4. Accessibility and hierarchy<\/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\">Accessibility and hierarchy are two different things, sure, but bear with me.<\/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\">Let's start with the latter. A hierarchical structure will allow you to create a tree-like map of your website and see how one action stems from the one before it and makes sense.<\/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\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-20926 size-medium\" src=\"https:\/\/marvelapp.com\/wp-content\/uploads\/2020\/12\/ux_hierarchy-600x373.png\" alt=\"UX Components Hierarchy\" width=\"600\" height=\"373\" srcset=\"https:\/\/marvelapp.com\/wp-content\/uploads\/2020\/12\/ux_hierarchy-600x373.png 600w, https:\/\/marvelapp.com\/wp-content\/uploads\/2020\/12\/ux_hierarchy-768x477.png 768w, https:\/\/marvelapp.com\/wp-content\/uploads\/2020\/12\/ux_hierarchy.png 1358w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \/><\/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 class=\"link link--blue fontWeight-4\"href=\"https:\/\/econsultancy.com\/the-hierarchy-of-user-experience-components\/\" target=\"_blank\" rel=\"noopener noreferrer\">Image Source<\/a>)<\/p>\n<h3 class=\"pageWrap pageWrap--s marginTop-l marginBottom-m c-black lineHeight-xl fontSize-xl fontWeight-5\">The Hierarchy Of UX Components<\/h3>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">This type of structure will give your web pages a natural flow, which will make the experience all the more interactive and realistic for the user.<\/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 whole point of the hierarchy is for the structure to be so clear and intuitive that the user will just know what step comes next, the way we all know where to look for a page's &quot;X&quot; button.<\/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\">There are many benefits to a hierarchical approach. The biggest one is the designer's opportunity to figure out how the product is supposed to work and, eventually, think like the end-user.<\/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\">For this to happen, two teams must communicate: the design team and the data team. Your data will show you exactly how the end-user thinks and how your design might be a little too complicated for their liking.<\/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\">Make sure to utilize that data to create a page that makes sense and is accessible.<\/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\">What does accessibility in UX mean, though?<\/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\">Essentially, it's all about creating a design that everyone will be able to use, power users, and disabled people alike.<\/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 website or your end product needs to make sense to everyone. After all, accessibility is one core aspect of UX - not to mention how beneficial it can be for your design, as it will help you keep it simple.<\/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\">Be sure to consult <a class=\"link link--blue fontWeight-4\"href=\"https:\/\/adata.org\" target=\"_blank\" rel=\"noopener noreferrer\">ADA<\/a> to make sure you understand how to make your website accessible to all audiences, from creating graphs to making sure your email marketing is just as convenient for people with disabilities as your website.<\/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;\">The Takeaway<\/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\">The above are, of course, the main components of great UX designs that will allow designers to go back to the basics and create designs that can be simple and, at the same time, beautiful and engaging.<\/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 designer, you need to remember that your users are the ones that need to benefit from your design; therefore, you don't need to over-complicate things.<\/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\">In the end, what makes for great UX design is the fact that it's simple and continuously updated according to the users' intent and feedback.<\/p>\n<h3 class=\"pageWrap pageWrap--s marginTop-l marginBottom-m c-black lineHeight-xl fontSize-xl fontWeight-5\">\nFurther reading:<br \/>\n<\/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><a class=\"link link--blue fontWeight-4\"href=\"https:\/\/marvelapp.com\/blog\/remote-usability-testing-tools\/\">What To Look for in Remote Usability Testing Tools<\/a><\/li>\n<li><a class=\"link link--blue fontWeight-4\"href=\"https:\/\/marvelapp.com\/blog\/ux-principles-back-to-basics\/\">UX Principles: Back to Basics<\/a><\/li>\n<li><a class=\"link link--blue fontWeight-4\"href=\"https:\/\/marvelapp.com\/blog\/3-practical-cheat-sheets-for-designing-attention-grabbing-uis\/\">3 Practical Cheat Sheets for Designing Attention-Grabbing UIs<\/a><\/li>\n<li><a class=\"link link--blue fontWeight-4\"href=\"https:\/\/marvelapp.com\/blog\/dear-developers-the-universe-is-telling-me-to-code\/\">Dear Developers, I feel like the universe is telling me to code<\/a><\/li>\n<li><a class=\"link link--blue fontWeight-4\"href=\"https:\/\/marvelapp.com\/blog\/what-is-design-strategy\/\">What is Design Strategy?<\/a><\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>&#8220;UX design is the process of developing and improving the quality of interaction between a user and all aspects of a company. It&#8217;s about products that are useful, easy to use, and engaging. UX design focuses on the overall feel of the experience and is not about visuals alone.&#8221; Jason Kalathas, Head of Design at Moosend According to the above&#8230; <a class=\"link link--blue fontWeight-4\" href=\"https:\/\/marvelapp.com\/blog\/ux-principles-back-to-basics\/\">Read More &#65515;<\/a><\/p>\n","protected":false},"author":353,"featured_media":14014,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[499],"tags":[],"class_list":["post-20890","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-ux"],"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=\"Read the fundamental principles for creating great UX design that will engage your users.\" \/>\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\/ux-principles-back-to-basics\/\" \/>\n<meta property=\"og:locale\" content=\"en_GB\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"UX Design - the Key Principles of Good User Experience (UX)\" \/>\n<meta property=\"og:description\" content=\"Read the fundamental principles for creating great UX design that will engage your users.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/marvelapp.com\/blog\/ux-principles-back-to-basics\/\" \/>\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=\"2020-12-21T18:03:02+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2021-01-22T11:45:14+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/marvelapp.com\/wp-content\/uploads\/2017\/12\/ux.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1292\" \/>\n\t<meta property=\"og:image:height\" content=\"668\" \/>\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\/ux-principles-back-to-basics\/#primaryimage\",\"inLanguage\":\"en-GB\",\"url\":\"https:\/\/marvelapp.com\/wp-content\/uploads\/2017\/12\/ux.png\",\"width\":1292,\"height\":668},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/marvelapp.com\/blog\/ux-principles-back-to-basics\/#webpage\",\"url\":\"https:\/\/marvelapp.com\/blog\/ux-principles-back-to-basics\/\",\"name\":\"UX Design - the Key Principles of Good User Experience (UX)\",\"isPartOf\":{\"@id\":\"https:\/\/marvelapp.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/marvelapp.com\/blog\/ux-principles-back-to-basics\/#primaryimage\"},\"datePublished\":\"2020-12-21T18:03:02+00:00\",\"dateModified\":\"2021-01-22T11:45:14+00:00\",\"description\":\"Read the fundamental principles for creating great UX design that will engage your users.\",\"inLanguage\":\"en-GB\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/marvelapp.com\/blog\/ux-principles-back-to-basics\/\"]}]},{\"@type\":\"Article\",\"@id\":\"https:\/\/marvelapp.com\/blog\/ux-principles-back-to-basics\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/marvelapp.com\/blog\/ux-principles-back-to-basics\/#webpage\"},\"author\":{\"@id\":\"https:\/\/marvelapp.com\/blog\/#\/schema\/person\/c9cb067898023b6ae2d7f47b9adf6932\"},\"headline\":\"UX Principles: Back to Basics\",\"datePublished\":\"2020-12-21T18:03:02+00:00\",\"dateModified\":\"2021-01-22T11:45:14+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/marvelapp.com\/blog\/ux-principles-back-to-basics\/#webpage\"},\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/marvelapp.com\/blog\/#organization\"},\"image\":{\"@id\":\"https:\/\/marvelapp.com\/blog\/ux-principles-back-to-basics\/#primaryimage\"},\"articleSection\":\"User Experience\",\"inLanguage\":\"en-GB\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/marvelapp.com\/blog\/ux-principles-back-to-basics\/#respond\"]}]},{\"@type\":\"Person\",\"@id\":\"https:\/\/marvelapp.com\/blog\/#\/schema\/person\/c9cb067898023b6ae2d7f47b9adf6932\",\"name\":\"T\\u00e9a Liarokapi\",\"image\":{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/marvelapp.com\/blog\/#personlogo\",\"inLanguage\":\"en-GB\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/541849dcf9a26cdb417e1efa8f441a3a965002787305d175a0b0b4b4ba8ab3cc?s=96&d=mm&r=g\",\"caption\":\"T\\u00e9a Liarokapi\"},\"description\":\"T\\u00e9a Liarokapi is a content writer working for email marketing software company Moosend and an obsessive writer in general. In her free time, she tries to find new ways to stuff more books in her bookcase and foster cats-to play with.\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","_links":{"self":[{"href":"https:\/\/marvelapp.com\/blog\/wp-json\/wp\/v2\/posts\/20890","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\/353"}],"replies":[{"embeddable":true,"href":"https:\/\/marvelapp.com\/blog\/wp-json\/wp\/v2\/comments?post=20890"}],"version-history":[{"count":0,"href":"https:\/\/marvelapp.com\/blog\/wp-json\/wp\/v2\/posts\/20890\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/marvelapp.com\/blog\/wp-json\/wp\/v2\/media\/14014"}],"wp:attachment":[{"href":"https:\/\/marvelapp.com\/blog\/wp-json\/wp\/v2\/media?parent=20890"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/marvelapp.com\/blog\/wp-json\/wp\/v2\/categories?post=20890"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/marvelapp.com\/blog\/wp-json\/wp\/v2\/tags?post=20890"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}