{"id":6251,"date":"2014-01-08T10:46:08","date_gmt":"2014-01-08T15:46:08","guid":{"rendered":"http:\/\/lemasney.com\/consulting\/?p=6251"},"modified":"2020-07-11T16:35:42","modified_gmt":"2020-07-11T20:35:42","slug":"design-principle-area-alignment","status":"publish","type":"post","link":"https:\/\/lemasney.com\/consulting\/2014\/01\/08\/design-principle-area-alignment\/","title":{"rendered":"The design principle of area alignment"},"content":{"rendered":"
\"8<\/a>

Area alignment design principle cc-by lemasney.com<\/p><\/div>\n

The design principle of area alignment says that when you have a series of objects to be aligned that do not have regular shapes, that it is more aesthetically pleasing to centrally align them according to their area and weight than by central alignment of the bounding boxes.<\/p>\n

In the illustration I’ve made here, the birds to the left are centrally aligned according to the centers of the bounding boxes, and the birds to the right are centrally aligned according to their area, form, and weight. The area aligned images are more pleasing as a series of aligned objects. These are two different ways of thinking about layout of related objects in a design plane.<\/p>\n

“Alignment based on the area of elements versus the edges of elements. \u00a0With the advent of professional design and engineering software, elements in a design can be aligned with exacting precision. However, the alignment supported by software is based on the edges of elements \u2014 including center alignment, which calculates a center based on the edges. This method works well when elements are relatively uniform and symmetrical, but less well when the elements are nonuniform and asymmetrical. In these latter cases, it is preferable to align based on the visual weight or area of the elements, a technique that must be performed using the designer\u2019s eye and judgment. Using edge alignment when area alignment is called for is one of the …” found in Area Alignment – Universal Principles of Design, Revised and Updated: 125 Ways to Enhance Usability, Influence Perception, Increase Appeal, Make Better Design Decisions, and Teach through Design [Book] at https:\/\/goo.gl\/exykFB<\/a><\/p>\n

<\/h6>\n
<\/div>\n","protected":false},"excerpt":{"rendered":"

The design principle of area alignment says that when you have a series of objects to be aligned that do not have regular shapes, that it is more aesthetically pleasing to centrally align them according to their area and weight than by central alignment of the bounding boxes.<\/p>\n","protected":false},"author":1,"featured_media":6252,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2}},"categories":[3,7,18,3659,1128,3653,3654,23,29,32,5],"tags":[267,363,3870],"class_list":{"0":"post-6251","1":"post","2":"type-post","3":"status-publish","4":"format-standard","5":"has-post-thumbnail","7":"category-brand","8":"category-consulting","9":"category-cv","10":"category-design-principles","11":"category-illustration","12":"category-insights","13":"category-portfolio","14":"category-professional-experience","15":"category-research-interests","16":"category-teaching-experience","17":"category-technology","18":"tag-education","19":"tag-graphic-design","20":"tag-john-lemasney","21":"czr-hentry"},"jetpack_publicize_connections":[],"jetpack_featured_media_url":"https:\/\/i0.wp.com\/lemasney.com\/consulting\/wp-content\/uploads\/2014\/01\/8-of-365-Area-alignment-design-principle.png?fit=1000%2C667&ssl=1","jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/p3h6y2-1CP","jetpack_likes_enabled":true,"jetpack-related-posts":[{"id":6239,"url":"https:\/\/lemasney.com\/consulting\/2014\/01\/05\/5-365-alignment-design-principle\/","url_meta":{"origin":6251,"position":0},"title":"5 of 365: Alignment #design #principle","author":"lemsy","date":"2014-01-05","format":false,"excerpt":"Alignment is a design method for maintaining order, readability, and sense. Horizontal and vertical alignment in design allows for easier reading, a more aesthetic layout, and more sensible use of the designed object. Unless the designer is specifically trying to create visual chaos for effect, alignment should be implemented well.\u2026","rel":"","context":"In "brand"","block_context":{"text":"brand","link":"https:\/\/lemasney.com\/consulting\/category\/consulting\/brand\/"},"img":{"alt_text":"5 of 365 - alignment design principle by John LeMasney via lemasney.com","src":"https:\/\/i0.wp.com\/lemasney.com\/consulting\/wp-content\/uploads\/2014\/01\/5-of-365-alignment-design-principle.png?fit=667%2C1000&ssl=1&resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/lemasney.com\/consulting\/wp-content\/uploads\/2014\/01\/5-of-365-alignment-design-principle.png?fit=667%2C1000&ssl=1&resize=350%2C200 1x, https:\/\/i0.wp.com\/lemasney.com\/consulting\/wp-content\/uploads\/2014\/01\/5-of-365-alignment-design-principle.png?fit=667%2C1000&ssl=1&resize=525%2C300 1.5x"},"classes":[]},{"id":6718,"url":"https:\/\/lemasney.com\/consulting\/2014\/01\/11\/11-365-biophilia-effect-design-design-principle\/","url_meta":{"origin":6251,"position":1},"title":"11 of 365: Biophilia effect #design #design-principle","author":"lemsy","date":"2014-01-11","format":false,"excerpt":"The biophilia effect is the idea that when we are placed in environments that contain or seem to contain nature, we are more likely to be able to heal physically and emotionally, think more creatively, and generally function better. In environments where these outcomes are intended, it is preferable to\u2026","rel":"","context":"In "brand"","block_context":{"text":"brand","link":"https:\/\/lemasney.com\/consulting\/category\/consulting\/brand\/"},"img":{"alt_text":"11 of 365 - Biophilia effect design principle by John LeMasney via lemasney.com","src":"https:\/\/i0.wp.com\/lemasney.com\/consulting\/wp-content\/uploads\/2014\/01\/11-of-365-Biophilia-effect-design-principle.png?fit=1000%2C667&ssl=1&resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/lemasney.com\/consulting\/wp-content\/uploads\/2014\/01\/11-of-365-Biophilia-effect-design-principle.png?fit=1000%2C667&ssl=1&resize=350%2C200 1x, https:\/\/i0.wp.com\/lemasney.com\/consulting\/wp-content\/uploads\/2014\/01\/11-of-365-Biophilia-effect-design-principle.png?fit=1000%2C667&ssl=1&resize=525%2C300 1.5x, https:\/\/i0.wp.com\/lemasney.com\/consulting\/wp-content\/uploads\/2014\/01\/11-of-365-Biophilia-effect-design-principle.png?fit=1000%2C667&ssl=1&resize=700%2C400 2x"},"classes":[]},{"id":6735,"url":"https:\/\/lemasney.com\/consulting\/2014\/01\/13\/13-365-chunking-design-principle\/","url_meta":{"origin":6251,"position":2},"title":"13 of 365: Chunking #design #principle","author":"lemsy","date":"2014-01-13","format":false,"excerpt":"Chunking is a method by which you take ideas that need to be taught or remembered, and break them down into memorable, consumable chunks. Studies show that we have more difficulty remembering a list of ten words than two lists of five words each. The most effective chunking consists of\u2026","rel":"","context":"In "brand"","block_context":{"text":"brand","link":"https:\/\/lemasney.com\/consulting\/category\/consulting\/brand\/"},"img":{"alt_text":"13 of 365 - Chunking design principle by John LeMasney via lemasney.com","src":"https:\/\/i0.wp.com\/lemasney.com\/consulting\/wp-content\/uploads\/2014\/01\/13-of-365-Chunking-design-principle.png?fit=1000%2C667&ssl=1&resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/lemasney.com\/consulting\/wp-content\/uploads\/2014\/01\/13-of-365-Chunking-design-principle.png?fit=1000%2C667&ssl=1&resize=350%2C200 1x, https:\/\/i0.wp.com\/lemasney.com\/consulting\/wp-content\/uploads\/2014\/01\/13-of-365-Chunking-design-principle.png?fit=1000%2C667&ssl=1&resize=525%2C300 1.5x, https:\/\/i0.wp.com\/lemasney.com\/consulting\/wp-content\/uploads\/2014\/01\/13-of-365-Chunking-design-principle.png?fit=1000%2C667&ssl=1&resize=700%2C400 2x"},"classes":[]},{"id":6942,"url":"https:\/\/lemasney.com\/consulting\/2014\/01\/31\/31-365-design-committee-design-principle\/","url_meta":{"origin":6251,"position":3},"title":"31 of 365: Design by Committee design principle","author":"lemsy","date":"2014-01-31","format":false,"excerpt":"There are times where design is best accomplished by a single, monolithic voice (design by dictator) and other times when it is best done by committee. In cases where stakeholder buy in is not necessary, the design parameters are exceptionally clear, or the scope and timing of the design are\u2026","rel":"","context":"In "brand"","block_context":{"text":"brand","link":"https:\/\/lemasney.com\/consulting\/category\/consulting\/brand\/"},"img":{"alt_text":"31 of 365 - Design by committee design principle by John LeMasney via lemasney.com","src":"https:\/\/i0.wp.com\/lemasney.com\/consulting\/wp-content\/uploads\/2014\/01\/31-of-365-Design-by-committee-design-principle.png?fit=1000%2C600&ssl=1&resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/lemasney.com\/consulting\/wp-content\/uploads\/2014\/01\/31-of-365-Design-by-committee-design-principle.png?fit=1000%2C600&ssl=1&resize=350%2C200 1x, https:\/\/i0.wp.com\/lemasney.com\/consulting\/wp-content\/uploads\/2014\/01\/31-of-365-Design-by-committee-design-principle.png?fit=1000%2C600&ssl=1&resize=525%2C300 1.5x, https:\/\/i0.wp.com\/lemasney.com\/consulting\/wp-content\/uploads\/2014\/01\/31-of-365-Design-by-committee-design-principle.png?fit=1000%2C600&ssl=1&resize=700%2C400 2x"},"classes":[]},{"id":7099,"url":"https:\/\/lemasney.com\/consulting\/2014\/02\/03\/33-365-desire-lines-design-principle\/","url_meta":{"origin":6251,"position":4},"title":"33 of 365: Desire Lines design principle","author":"lemsy","date":"2014-02-03","format":false,"excerpt":"Desire lines are a development tool that a designer can use from the way that people actually interact with an interface, space, or object before finalizing features, paths, or navigation. It is often used in designing walking paths in a new space to help determine the best place to put\u2026","rel":"","context":"In "brand"","block_context":{"text":"brand","link":"https:\/\/lemasney.com\/consulting\/category\/consulting\/brand\/"},"img":{"alt_text":"33 of 365 - Desired line design principle by John LeMasney via lemasney.com","src":"https:\/\/i0.wp.com\/lemasney.com\/consulting\/wp-content\/uploads\/2014\/02\/33-of-365-Desired-line-design-principle.png?fit=1000%2C600&ssl=1&resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/lemasney.com\/consulting\/wp-content\/uploads\/2014\/02\/33-of-365-Desired-line-design-principle.png?fit=1000%2C600&ssl=1&resize=350%2C200 1x, https:\/\/i0.wp.com\/lemasney.com\/consulting\/wp-content\/uploads\/2014\/02\/33-of-365-Desired-line-design-principle.png?fit=1000%2C600&ssl=1&resize=525%2C300 1.5x, https:\/\/i0.wp.com\/lemasney.com\/consulting\/wp-content\/uploads\/2014\/02\/33-of-365-Desired-line-design-principle.png?fit=1000%2C600&ssl=1&resize=700%2C400 2x"},"classes":[]},{"id":6247,"url":"https:\/\/lemasney.com\/consulting\/2014\/01\/07\/7-365-archetypes-design-principle\/","url_meta":{"origin":6251,"position":5},"title":"7 of 365: Archetypes #design #principle","author":"lemsy","date":"2014-01-07","format":false,"excerpt":"Archetypes allow designers to make good design decisions about the alignment of the emotional content of a design and the best use of color, line, fonts and other design elements. Archetypes can be classic ones, such as good and evil, sweet and bitter, happy and sad, but can also be\u2026","rel":"","context":"In "brand"","block_context":{"text":"brand","link":"https:\/\/lemasney.com\/consulting\/category\/consulting\/brand\/"},"img":{"alt_text":"7 of 365 - Archetypes design principle by John LeMasney via lemasney.com","src":"https:\/\/i0.wp.com\/lemasney.com\/consulting\/wp-content\/uploads\/2014\/01\/7-of-365-Archetypes-design-principle.png?fit=1000%2C667&ssl=1&resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/lemasney.com\/consulting\/wp-content\/uploads\/2014\/01\/7-of-365-Archetypes-design-principle.png?fit=1000%2C667&ssl=1&resize=350%2C200 1x, https:\/\/i0.wp.com\/lemasney.com\/consulting\/wp-content\/uploads\/2014\/01\/7-of-365-Archetypes-design-principle.png?fit=1000%2C667&ssl=1&resize=525%2C300 1.5x, https:\/\/i0.wp.com\/lemasney.com\/consulting\/wp-content\/uploads\/2014\/01\/7-of-365-Archetypes-design-principle.png?fit=1000%2C667&ssl=1&resize=700%2C400 2x"},"classes":[]}],"_links":{"self":[{"href":"https:\/\/lemasney.com\/consulting\/wp-json\/wp\/v2\/posts\/6251","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/lemasney.com\/consulting\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/lemasney.com\/consulting\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/lemasney.com\/consulting\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/lemasney.com\/consulting\/wp-json\/wp\/v2\/comments?post=6251"}],"version-history":[{"count":6,"href":"https:\/\/lemasney.com\/consulting\/wp-json\/wp\/v2\/posts\/6251\/revisions"}],"predecessor-version":[{"id":47074,"href":"https:\/\/lemasney.com\/consulting\/wp-json\/wp\/v2\/posts\/6251\/revisions\/47074"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/lemasney.com\/consulting\/wp-json\/wp\/v2\/media\/6252"}],"wp:attachment":[{"href":"https:\/\/lemasney.com\/consulting\/wp-json\/wp\/v2\/media?parent=6251"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/lemasney.com\/consulting\/wp-json\/wp\/v2\/categories?post=6251"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/lemasney.com\/consulting\/wp-json\/wp\/v2\/tags?post=6251"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}