So we're still wondering, what exactly is beauty? During Part 1 and Part 2 of our series, we discussed the contributions of geometric simplicity, specifically as it applies to symmetry and the golden rectangle. We've discovered that patterns which are easily recognizable throughout the natural world - and thus easily deciphered - tend to be more aesthetically pleasing. We've explored the implications of instinctual motives to survive and to prolong the existence of our species through reproduction, discovering that environmental factors have strongly influenced the qualities that we associate with beauty. We've ultimately explored the aspects of human attraction by questioning the essence of beauty and, in doing so have discovered multiple reasons why similar objects often score far apart from one another on a scale of relative beauty.
This week we're wrapping all of these concepts up. Not only are we about to explore the concepts of perspective and motion as they relate to beauty, we are going to apply each and every one of the concepts previously discussed throughout the course of this three part series to the process of creating beautiful Web design and graphics. Finally something applicable after a load of theory.
Let's begin our discussion on the topic of perspective. Perspective is defined from a design standpoint as a variety of techniques used to create the illusion of three-dimensional space on a flat surface by mimicking the effects of distance on human perception. Perspective reveals depth and also makes objects appear to be three-dimensional although they are being represented on a two-dimensional surface. In order to create the illusion of depth, you must attempt to imitate the way that the human eye perceives its environment. Objects that are farther away from the viewing party appear in less detail, edges loose their sharpness, and colors become muffled in the distance. This phenomenon is named atmospheric perspective; the atmosphere hanging between the viewing party and the object of interest causes the object to be perceived inaccurately.1 The greater this distance, the greater consideration one must pay to atmospheric distortion.
Linear perspective is a second factor to consider when viewing any object. "Linear perspective uses a system of converging lines to represent the height of objects as they get further away."1 For example, a line along the top of a building gradually grows closer to the line running along the bottom of that same building as it expands farther into the distance. When both lines are extended to the vanishing point, the point in the far distance at which the world vanishes from sight, they intersect. The sizes of buildings and trees decrease along these lines, getting progressively smaller the further away they become.
It is extremely important to take perspective into consideration when designing for two reasons. The first reason, simple as it may seem, is that everything that any person perceives in the real world is placed into perspective. To represent anything accurately you absolutely must take perspective into account. This may seem to apply only if the beauty of your work is dependent upon its being an accurate representation of something in the real world. The truth of the matter is that representing objects, fictional or existent, as they truly would appear presents the human mind with an image that it is able to deal with in a familiar manner, in the same manner that it deals with every tangible object. By ignoring perspective, you are presenting the human mind with an image that is very complex for it to organize. As seen in Part 1, among comparable images, the one that is most simply analyzed will be considered the most beautiful.
The second reason that you should consider the perspective involved within your artwork is less obvious. Due to the almond-like shape of our eyes, people are much better at viewing objects horizontally. Thus, we often notice perspective while looking horizontally down a road, but not when looking vertically at trees or buildings. The implications of this are not nearly as clear cut, however, it is certainly true that if we are better at perceiving objects horizontally than vertically, it must be easier for our minds to process horizontal images and the use of horizontal perspective than to process vertical images and the use of vertical perspective. Not to sound like a broken record, amongst comparable images, the one that is most simply analyzed will be considered the most beautiful. In other words, horizontal banners are easier to assimilate than vertical ones.
So, if simplicity encourages beauty, what can be said for adding complexity through movement? Contradictory as this may sound, movement often enhances the amount of beauty perceived within an object. Motion attracts attention and, when used correctly, can be manipulated to draw attention to a certain aspect of an object. Thus, the addition of movement can effectively emphasize qualities that are found to be beautiful. For example, the flowing grace that many beautiful objects encompass could not be portrayed very effectively were it not for movement. Consider the beauty exhibited by a beaver in motion, hehe. Add movement to water or light and you will most likely enhance its beauty by demonstrating a quality that could not otherwise be captured. Beauty's purpose is to attract that which desires it and movement makes obvious the location of desired objects, making them more accessible and more beautiful.
This is not to say that motion always enhances beauty, or even that it does so on a regular basis. Consider the fluidity exhibited by dancers, martial artists, and skaters. When looking at a static image of a talented athlete, it is difficult to experience the beauty associated with their talents at all. Thus motion is an extremely appropriate addition when attempting to portray the beauty of athletes. Appropriate motion inspires and captivates, however, inappropriate or excessive motion can be an annoying turn-off. It is crucial when using movement, regardless of its benefits or lack thereof, to be smooth. In the words of Jun Alday, "What lives has change and movement; what has change and movement has beauty."2 True as this statement may be, we are talking about beauty strictly in a visual sense and, take my word, everything that has change and movement does not necessarily have beauty. Think, for example, about the badly planned pop up add that changes every quarter second. Badly organized change and movement detract from the beauty of any display. Changes that aren't too sudden, smooth transitions and graceful movements are a great place to begin when animating any display.
So how does this all apply to Website design you ask? The truth is that when you genuinely understand the notions around which the concept of beauty has been built, you can use them to your advantage when attempting to make anything optimally attractive. There are innumerable ways that the concepts we've discussed during this series of articles can be manipulated to assist in Website design. Let's take a trip back to the beginning. We discovered that simplicity is critical. When laying out a site design, creating graphics, or even choosing models to display throughout your content, make efforts to adhere to a color scheme and to make the images on your site as close to symmetrical as is possible. This doesn't necessarily mean that you should mirror your content on either half of your site. Simply choose designs that are easily analyzed and don't go out of your way to incorporate crazy designs that really make your users think. It is important to make objects on a Webpage proportionate to one another as well; be sure that the contents on your page effectively shrink and grow to accommodate a variety of screen resolutions. By presenting users with material that is easily broken down into geometric shapes and patterns in their minds, you are ultimately pleasing their eyes. Certainly don't forget to use the golden rectangle. It utilizes a commonly occurring ratio and is subconsciously preferred to other rectangles.3 Try making the "viewing area" on your Website a golden rectangle and placing text links underneath it. People are inherently attracted to these things because once upon a time they served a purpose as a means to survival.
Take advantage of the aspects of beauty we've discussed that stem from environmental factors. If you're running an adult site, you probably already do this in one way or another by recognizing that one function of beauty is to attract for the purposes of reproduction. Harness the power of instinctual motives by incorporating beautiful objects that are found in nature, such as flowers or waterfalls. People are inherently attracted to these things because once upon a time they served a purpose as a means to survival. Similarly, it is possible to enhance beauty by mimicking these objects and, thus, mimicking their power to attract. In today's world, a world where images of beauty can be found in virtually every sphere of modern life, the biological purpose of beauty is often lost. Instead of considering societal trends when deciding upon a beautiful display, concentrate on making your display a genuine source of attraction. Make your work attractive to users in the most primitive sense and it will continue to appeal to their senses for as long as the seemingly endless cycle of beauty trends continues to spin.
Take perspective into account when designing a Web page, displaying accurate representations of objects. You will effectively cut back on the amount of processing it takes for a person to mentally compile them, thus making them more beautiful.4 Also consider that horizontal images may be easier for your users to process. This may mean that you'll want important banners or sections of text to be stretched horizontally as opposed to vertically, in order to be easily processed. On the other hand, you may decide to use less naturally processed vertical banners, causing visiting eyes to stumble over the image and attracting attention by requiring a deeper level of processing. The choice is up to you.
Take care to ensure that any movement your Webpage exhibits happens smoothly and gracefully. Perhaps the best advice is to cut unnecessary movements, those that don't emphasize a beauty-enhancing quality, from your Webpage in order to advance its simplicity and make it less confusing. Any movement that remains on the page should be carefully edited to remove any sort of skip or jerk. Animated GIFs and movies with too many missing frames are a great example of unattractive motion, as is a logo or banner that appears hyperactive. When exercising compression techniques in any way, shape, or form, double check your work in a variety of environments to be sure the result is exactly what you intended.
Throughout the course of this three part series simplicity has been emphasized time and again. This is not to say that a deviation from Realism - art that represents nature accurately - is not capable of producing remarkable beauty. Unique and imaginative artwork is often considered to be amongst the most beautiful due to the striking ideas and emotions that mind-expanding artwork commonly inspires. Often the most beautiful inspirations are those that confuse and intrigue, breaking free from the confines of structured processing. By clearly understanding the implications of the manner in which beauty originated, it is possible to gain valuable insight into the aspects of your work that people find to be beautiful and those that are less than beautiful. More importantly, you'll begin to recognize patterns throughout your work and either embrace or erase them in order to enhance its quality.
Amanda Grimm has worked in the adult industry for three years. She specializes in international Web design and usability testing. Amanda holds a BS in Business Information Systems, and can be reached at Amanda@AdultWebmasterConsultants.com and https://www.adultwebmasterconsultants.com/
1 https://www.artsconnected.org/artsnetmn/environ/canal.html/
2 https://facultt.wm.edu/jmchar/Kin493/kinst07b.html/
3 https://mathworld.wolfram.com/GoldenRatio.html/
4 https://https://personal.centric.net/natasha/locoface/
