UX Design

What’s Below the Surface: A Look at UX in the Beauty Industry

Published

on

&NewLine;<p class&equals;"has-drop-cap wp-block-paragraph">Good web design has visual weight&comma; is <a rel&equals;"noreferrer noopener" href&equals;"&num;" target&equals;"&lowbar;blank">optimized for various devices<&sol;a>&comma; and has content that is prioritized for the medium&period; The most important elements of a web page should have more visual weight to <strong>&&num;8220&semi;naturally attract&&num;8221&semi;<&sol;strong> a visitor’s attention&period;<&sol;p>&NewLine;&NewLine;&NewLine;&NewLine;<figure class&equals;"wp-block-pullquote"><blockquote><p>Good design is making something intelligible and memorable&period; Great design is making something memorable and meaningful&period;<&sol;p><cite>Dieter Rams<&sol;cite><&sol;blockquote><&sol;figure>&NewLine;&NewLine;&NewLine;&NewLine;<p class&equals;"wp-block-paragraph">Most users search for something interesting<em> <&sol;em>&lpar;or useful&rpar; and clickable&semi; as soon as some promising candidates are found&comma; users click&period;<strong> If the new page doesn’t meet users’ expectations&comma;<&sol;strong> the back button is clicked and the search process is continued&period;<&sol;p>&NewLine;&NewLine;&NewLine;&NewLine;<h2 class&equals;"wp-block-heading">Implementing the Principles of Design<&sol;h2>&NewLine;&NewLine;&NewLine;&NewLine;<p class&equals;"wp-block-paragraph">Not all websites are made equal&period; Some websites are simple&comma; logical&comma; and easy to use&period; Others are a messy hodgepodge of pages and links&period;<&sol;p>&NewLine;&NewLine;&NewLine;&NewLine;<figure class&equals;"wp-block-image size-large"><img src&equals;"https&colon;&sol;&sol;thedailypage&period;ng&sol;wp-content&sol;uploads&sol;2022&sol;07&sol;Sg1-1024x679&period;jpg" alt&equals;"" class&equals;"wp-image-2518"&sol;><figcaption>What Is Teamwork and Why Does It Matter&quest;<&sol;figcaption><&sol;figure>&NewLine;&NewLine;&NewLine;&NewLine;<p class&equals;"wp-block-paragraph">Without website navigation&comma; your visitors can’t figure out how to find your blog&comma; your email signup page&comma; your product listings&comma; pricing&comma; contact information&comma; or help docs&period;<&sol;p>&NewLine;&NewLine;&NewLine;<p>&lbrack;ruby&lowbar;related heading&equals;&&num;8221&semi;More Read&&num;8221&semi; total&equals;5 layout&equals;1 offset&equals;5&rsqb;<&sol;p>&NewLine;&NewLine;&NewLine;&NewLine;<p class&equals;"wp-block-paragraph"><strong>Quick and easy access to the content they’re after is more important for your website users than a… visually-stunning design&period;<&sol;strong><&sol;p>&NewLine;&NewLine;&NewLine;&NewLine;<p class&equals;"wp-block-paragraph">Website navigation allows visitors to flow from one page to another without frustration&period; If you’ve done your job well&comma; visitors leave your site with the <a href&equals;"&num;" target&equals;"&lowbar;blank" rel&equals;"noreferrer noopener">intention to return<&sol;a> and might even buy something from you or sign up for your email list&period;<&sol;p>&NewLine;&NewLine;&NewLine;&NewLine;<p class&equals;"wp-block-paragraph"><em>Bad navigation is an especially common problem&period; We’ve all struggled to find things on disorganized websites without any logical structure&period; It feels hopeless&period;<&sol;em><&sol;p>&NewLine;&NewLine;&NewLine;&NewLine;<h2 class&equals;"wp-block-heading">A Guide to Visual Hierarchy<&sol;h2>&NewLine;&NewLine;&NewLine;&NewLine;<p class&equals;"wp-block-paragraph">In design&comma; rhythm is created by simply repeating elements in predictable patterns&period; This repetition is a natural thing that occurs everywhere in our world&period; As people&comma; we are driven everyday by predictable&comma; timed events&period;<&sol;p>&NewLine;&NewLine;&NewLine;&NewLine;<figure class&equals;"wp-block-image size-large"><img src&equals;"https&colon;&sol;&sol;thedailypage&period;ng&sol;wp-content&sol;uploads&sol;2022&sol;07&sol;sg2-1024x603&period;jpg" alt&equals;"" class&equals;"wp-image-2517"&sol;><figcaption>Breaking Down the Principles of Design<&sol;figcaption><&sol;figure>&NewLine;&NewLine;&NewLine;&NewLine;<p class&equals;"wp-block-paragraph">One of the best ways to use <a rel&equals;"noreferrer noopener" href&equals;"&num;" target&equals;"&lowbar;blank">repetition and rhythm in web design<&sol;a> is in the site&&num;8217&semi;s navigation menu&period; A consistent&comma; easy-to-follow pattern—in color&period;<&sol;p>&NewLine;&NewLine;&NewLine;&NewLine;<h2 class&equals;"wp-block-heading">Breaking Down the Principles of Design<&sol;h2>&NewLine;&NewLine;&NewLine;&NewLine;<p class&equals;"wp-block-paragraph">Nobody enjoys looking at an ugly web page&period; Garish colors&comma; can all turn customers <strong>&&num;8220&semi;off&&num;8221&semi;<&sol;strong> and send them shopping<strong> &&num;8220&semi;somewhere else&&num;8221&semi;<&sol;strong>&period; Basic composition rules to create more effective&colon;<&sol;p>&NewLine;&NewLine;&NewLine;&NewLine;<ul class&equals;"rb-list wp-block-list"><li>Direct the Eye With<strong> <&sol;strong><a rel&equals;"noreferrer noopener" href&equals;"&num;" target&equals;"&lowbar;blank">Leading Lines<&sol;a><&sol;li><li>Balance Out Your Elements<&sol;li><li>Use Elements That<strong> Complement Each Other<&sol;strong><&sol;li><li>Be clear about your <strong>&&num;8220&semi;focal points&&num;8221&semi;<&sol;strong> and where you place them<&sol;li><&sol;ul>&NewLine;&NewLine;&NewLine;&NewLine;<h2 class&equals;"wp-block-heading">The Metaverse shines brightly<&sol;h2>&NewLine;&NewLine;&NewLine;&NewLine;<p class&equals;"wp-block-paragraph"><strong>UX and UI&colon; <&sol;strong>Two terms that are often used interchangeably&comma; but actually mean very different things&period; <em>So what exactly is the difference&quest;<&sol;em><&sol;p>&NewLine;&NewLine;&NewLine;&NewLine;<figure class&equals;"wp-block-pullquote alignright is-style-default"><blockquote><p>Styles come and go&period; Good design is a language&comma; not a style&period;<&sol;p><cite>Massimo Vignelli<&sol;cite><&sol;blockquote><&sol;figure>&NewLine;&NewLine;&NewLine;&NewLine;<p class&equals;"wp-block-paragraph">UX design refers to the term <em>&OpenCurlyDoubleQuote;user experience design”<&sol;em>&comma; while UI stands for <em>&OpenCurlyDoubleQuote;user interface design<&sol;em><strong>”<&sol;strong>&period; Both elements are crucial to a product and work closely together&period; <&sol;p>&NewLine;&NewLine;&NewLine;&NewLine;<h2 class&equals;"wp-block-heading">Why Visual Hierarchy Is Important<&sol;h2>&NewLine;&NewLine;&NewLine;&NewLine;<p class&equals;"wp-block-paragraph">Good design guides the user by communicating purpose and priority&period; For that reason&comma; every part of the design should be based on an <strong>&&num;8220&semi;<strong>informed decision<&sol;strong><&sol;strong>&&num;8221&semi; rather than an arbitrary result of personal taste or the current trend&period;<&sol;p>&NewLine;&NewLine;&NewLine;&NewLine;<figure class&equals;"wp-block-image size-full"><img src&equals;"https&colon;&sol;&sol;thedailypage&period;ng&sol;wp-content&sol;uploads&sol;2022&sol;07&sol;sg3&period;jpg" alt&equals;"" class&equals;"wp-image-2516"&sol;><figcaption>Don’t be quick to dismiss an initial idea as impossible&comma;<&sol;figcaption><&sol;figure>&NewLine;&NewLine;&NewLine;&NewLine;<p class&equals;"wp-block-paragraph">Provide distinct styles for interactive elements&comma; such as <em>links and buttons<&sol;em>&comma; to make them easy to identify&period; For example&comma; <strong>&&num;8220&semi;change the appearance of links&&num;8221&semi;<&sol;strong> on mouse hover&comma; &&num;8220&semi;keyboard focus&&num;8221&semi;&comma; and &&num;8220&semi;touch-screen activation&&num;8221&semi;&period;<&sol;p>&NewLine;&NewLine;&NewLine;&NewLine;<h2 class&equals;"wp-block-heading">Final thoughts<&sol;h2>&NewLine;&NewLine;&NewLine;&NewLine;<p class&equals;"wp-block-paragraph"><strong>Design is not the end-all solution to all of the worlds problems<&sol;strong> — but with the right thinking and application&comma; it can definitely be a good beginning to start tackling them&period;<&sol;p>&NewLine;

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Trending

Exit mobile version