what are the characteristic of good and usable designs. Here they are:<\/strong><\/p>\n So how to achieve above mentioned characteristics? There are four focal points:<\/strong><\/p>\n These four focal points are not independent. Users experience<\/a> unites them in an organised\u00a0scheme to make their assessment and discussion easier. Below diagram shall clarify how user pursue a design.<\/p>\n In this part we shall deep dive into Navigation and Presentation. Let’s start…<\/p>\n Navigation<\/strong> Users face usability issues 80% times if navigations are not properly designed. They might feel:<\/p>\n How to solve this to make good navigation?<\/p>\n 1. Tell user where they are? 2. Effective navigation clearly displays full range of navigation available on current page. It\u00a0also indicates how to get back (using Breadcrumb) from the point of navigation invoke.<\/p>\n 3. Effective navigations provides alternative options to the users. For example: Quick Links Lets discuss the type of navigations with some examples.<\/p>\n Types of Navigation<\/strong><\/p>\n Hierarchical\u00a0Drill Down –<\/strong> Example: Mail list and mail detail view<\/p>\n Persistent –<\/strong> Example: Tab Bar, Single level list menu, Accordians, Tree Structure etc.<\/p>\n Sequential Navigation –<\/strong> Example: Payment Process, Checkout Process<\/p>\n Search –<\/strong> Example: Google Search There are few supplementary\u00a0navigation system. Below images will help to quickly identify them. These also help users to decide, act and complete their journey on a product or service. Presentation<\/strong> The very first factor is \u201cVisual Processing\u201d<\/strong>. For example:<\/p>\n Second factor is \u201cUser\u2019s attention\u201d<\/strong>. Research shows we need to attend few key visual elements to design for visual impact: Shape<\/em> Contrast<\/em> Intensity<\/em> Faces<\/em> Third factor is \u201cLayout\u201d<\/strong>. Design with Grid<\/strong> Screen size and resolution<\/strong> Clutter V\/S Density<\/strong> We have structred our design but what about aesthetic aspect. Designers rely on color wheel to make the fundamental choices of colors. There are some existing branding guidelines as well when we start designing something. Good use of negative space also helps to define the attention points\/heat area.<\/p>\n There are couple of more suggestion to improve the design are:<\/p>\n We have discussed 2 pillars of design (Navigation and Presentation)<\/strong> so far. You can learn more about the other 2 pillars of design namely, \u201cContent\u201d and \u201cInteraction\u201d<\/strong>\u00a0in “4 Pillars of Design – part II<\/a>”<\/p>\n Image\/Screenshot source:<\/em> Let\u2019s discuss about Visual Design today. However before proceeding to Visual Design, let us analyze what is design and how people from different arena\/profession see it. In today\u2019s life everything is design be it a car, house, pen, computer or whatever you name. So how we ensure the design is usable ? Same applies for […]<\/p>\n","protected":false},"author":717,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"iawp_total_views":55},"categories":[3887,3429],"tags":[4004,3598,3994,4003,4858,3600,3110],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/posts\/40305"}],"collection":[{"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/users\/717"}],"replies":[{"embeddable":true,"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/comments?post=40305"}],"version-history":[{"count":0,"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/posts\/40305\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/media?parent=40305"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/categories?post=40305"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.tothenew.com\/blog\/wp-json\/wp\/v2\/tags?post=40305"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}![\"1\"](\"\/blog\/wp-ttn-blog\/uploads\/2016\/09\/1-300x87.jpg\")
<\/p>\n![\"2\"](\"\/blog\/wp-ttn-blog\/uploads\/2016\/09\/2-300x103.jpg\")
<\/p>\n![\"3\"](\"\/blog\/wp-ttn-blog\/uploads\/2016\/09\/3-300x237.jpg\")
<\/p>\n
\nWhy good navigation design is required?<\/p>\n\n
\n![\"4\"](\"\/blog\/wp-ttn-blog\/uploads\/2016\/09\/4-300x144.jpg\")
\nHighlighted area also known as breadcrum reveals a user\u2019s location on a system. In this case on AETNA’s website<\/p>\n![\"5\"](\"\/blog\/wp-ttn-blog\/uploads\/2016\/09\/5-300x148.jpg\")
<\/p>\n
\n![\"6\"](\"\/blog\/wp-ttn-blog\/uploads\/2016\/09\/6-300x147.jpg\")
<\/p>\n![\"7\"](\"\/blog\/wp-ttn-blog\/uploads\/2016\/09\/7-300x170.jpg\")
<\/p>\n![\"8\"](\"\/blog\/wp-ttn-blog\/uploads\/2016\/09\/8-300x136.jpg\")
<\/p>\n![\"9\"](\"\/blog\/wp-ttn-blog\/uploads\/2016\/09\/9-300x157.jpg\")
<\/p>\n
\n![\"10\"](\"\/blog\/wp-ttn-blog\/uploads\/2016\/09\/10-300x121.jpg\")
<\/p>\n
\n![\"11\"](\"\/blog\/wp-ttn-blog\/uploads\/2016\/09\/11-300x204.jpg\")
<\/p>\n
\nWhat are the factors which contribute in design to make it effective?<\/p>\n![\"12\"](\"\/blog\/wp-ttn-blog\/uploads\/2016\/09\/12-300x300.jpg\")
\nWhat is above mentioned drawing? One will quickly say a \u201ccircle\u201d and no one will say \u201cA curved line with every point in equal distance from center and each other\u201d<\/em> not even a designer. This is how normal user see a design. It\u2019s the metaphor or real world connection which help them to relate with the system.<\/p>\n
\nGuiding user\u2019s attention can result in a more successful design. So how to design for user attention?<\/p>\n
\nSize<\/em>
\n![\"13\"](\"\/blog\/wp-ttn-blog\/uploads\/2016\/09\/13-300x43.jpg\")
<\/p>\n
\n![\"14\"](\"\/blog\/wp-ttn-blog\/uploads\/2016\/09\/14-300x22.jpg\")
<\/p>\n
\n![\"15\"](\"\/blog\/wp-ttn-blog\/uploads\/2016\/09\/15-300x39.jpg\")
<\/p>\n
\n![\"16\"](\"\/blog\/wp-ttn-blog\/uploads\/2016\/09\/16-300x31.jpg\")
<\/p>\n
\n![\"17\"](\"\/blog\/wp-ttn-blog\/uploads\/2016\/09\/17-300x139.jpg\")
<\/p>\n
\nGood design consist not only good content but it also have to be well structured. The information should be hierarchical. Design structure should also maintain consistency.<\/p>\n
\nGrid layouts helps you to organize the design templates and make consistency.<\/p>\n![\"18\"](\"\/blog\/wp-ttn-blog\/uploads\/2016\/09\/18-300x121.jpg\")
<\/p>\n
\nYou must determine:<\/p>\n\n
\n![\"19\"](\"\/blog\/wp-ttn-blog\/uploads\/2016\/09\/19-300x173.jpg\")
<\/p>\n![\"20\"](\"\/blog\/wp-ttn-blog\/uploads\/2016\/09\/20-300x127.jpg\")
<\/p>\n\n
\nwww.google.com, www.aetna.com, www.flipkart.com, www.jabong.com, www.yoast.com<\/p>\n","protected":false},"excerpt":{"rendered":"