TASK 1 (Exploration)
TASK 1 (Exploration)
10 February 2025 - 23 February 2025 / Week 2 - Week 3
Sadman Kader (0370190)
Bachelor of Computer Science (Honours)
Instructions (MIB)
Process Work
1. Introduction to Elements of Design:
The elements of design are the fundamental building blocks of visual composition, shaping how we perceive and interact with designs. These elements include point, line, shape, form, space, texture and colour, each contributing to structure and visual impact.
- Point- It is the simplest design element, representing a single position in space without length, width, or depth. When arranged or repeated, points can create patterns, textures, and areas of focus.
- Line- It is a continuous mark on a surface or the boundary formed where two shapes intersect. It can be actual or implied and may appear in various orientations such as vertical, horizontal, diagonal, or contour.
- Shape- A shape is a two-dimensional enclosed area formed by connecting lines or through variations in color and value. Shapes can be geometric (precise and mathematical) or organic (irregular and natural).
- Form- It is a three-dimensional structure that has height, width, and depth. In two-dimensional design, form is suggested through shading, perspective, and overlapping to create the illusion of depth.
- Space- Space is the area surrounding, between, and within elements. Positive space represents the subject, while negative space refers to the background. In three-dimensional design, space also encompasses depth and volume.
- Texture- It refers to the surface quality of an object, which can be actual (physically felt) or visual (simulated through design techniques). It enhances depth and visual interest.
- Colour: It is the visual perception of different wavelengths of light, affecting mood and communication.
- Hue – The specific name of a color (e.g., red, blue, yellow).
- Value – The lightness or darkness of a color; adding white creates a tint, gray creates a tone, and black creates a shade.
- Saturation (Chroma) – The intensity or purity of a color.
- Color Schemes – Harmonious color combinations, including complementary, analogous, triadic, and monochromatic schemes.
2. Gestalt Theory
Gestalt Principles are psychological laws of perception that explain how people group similar elements, identify patterns, and simplify complex visuals when interpreting objects. Designers apply these principles to structure content on websites and interfaces, ensuring clarity, visual appeal, and ease of understanding.
Principles of Similarity
 |
| Fig.2.1 Principles of Similarity |
When objects, elements, or items share visual characteristics, we naturally perceive them as part of a group. The similarity principle is commonly applied in branding and design system guidelines to create consistency and cohesion.
Principles of Continuity
The continuity principle of Gestalt suggests that we perceive elements as part of a continuous pattern when they follow a consistent path or direction. The human eye naturally follows lines, curves, and paths in a design, preferring a smooth visual flow over disconnected elements. Even if an obstacle partially obscures the path or its flow is interrupted by intersecting elements, the eye tends to maintain the perceived direction.
Principles of Figure/Ground
Objects are naturally perceived as either part of the foreground or the background. Elements that stand out prominently are seen as the figure, while those that appear to recede are interpreted as the ground.
Principles of Proximity
 |
| Fig.2.4 Principles of Proximity |
Proximity is the principle of placing related design elements close together while keeping unrelated items spaced apart. Elements positioned near each other are perceived as connected, forming a single visual unit. This helps create organization and structure within a layout, improving clarity and visual hierarchy.
Principles of Closure
 |
| Fig.2.5 Principles of Closure |
The human eye naturally seeks to perceive complete shapes. When visual elements are incomplete, the brain fills in the missing details, allowing the viewer to recognize the intended form.
Law of Pragnanz
 |
| Fig.2.6 Law of Pragnanz |
Pragnanz refers to the human tendency to simplify complex visuals. Since our environment constantly presents us with overwhelming stimuli and our cognitive resources are limited, we instinctively organize information into orderly, regular, and easily recognizable patterns. This principle helps us make sense of visual complexity by perceiving structure amidst chaos.
Law of Symmetry and Order
 |
| Fig.2.7 Symmetry and Order |
Humans naturally perceive visual elements as grouped when arranged in symmetry. Since symmetry is prevalent in nature, our brains are naturally drawn to balanced and harmonious forms, making them more visually appealing and easier to process.
Law of Uniform Connectedness
 |
| Fig. 2.8 Uniform Connectedness in UX Design |
The law of uniform connectedness, a key Gestalt principle, states that visually linked elements or those with common characteristics are perceived as part of the same group. Humans naturally associate elements that share visual cues as being more related than those without such connections.
Law of Common Fate
 |
| Fig.2.9 Law of Common Fate |
The Gestalt law of common fate states that humans perceive visual elements moving at the same speed or in the same direction as part of a unified group. A common example is a flock of birds—when multiple birds fly together in one direction, we instinctively see them as belonging to the same group.
3. Design Principles of Contrast
Contrast is the placement of distinctly different elements side by side. Without it, visual compositions would appear dull and unengaging. Contrast enhances visual interest, draws attention to key elements, and helps convey meaning effectively.
 |
| Fig.3.1 Negative Space Contrast |
Negative space (or white space) contrast is a design principle that leverages empty space around elements to create balance, visual hierarchy, and tension. Designs incorporating sufficient negative space enhance clarity and readability, while those lacking it can feel visually cluttered and overwhelming.
 |
| Fig.3.2 Contrast |
The image (Fig.3.2 Contrast) shows demonstrates the design principle of contrast as we can see the use of the bright red circular shape sharply contrasts against the dark background. The red circular shape immediately draws our attention. Moreover, the black figure in hat blends into the dark background but stands out due to the interplay of negative space and form.
4. Design Principles of Emphasis
Emphasis is a design principle that occurs when an artist gives a specific element greater importance within a composition. This technique ensures that a particular part of the artwork stands out, naturally directing the viewer’s attention to it first.
Using color, value, and texture effectively enhances emphasis through contrast. Introducing texture in a specific area or placing a light element within a dark setting naturally draws the viewer’s focus. These techniques create visual hierarchy, ensuring that key elements stand out while maintaining overall balance within the composition.
 |
| Fig.4 Emphasis |
The image (Fig.4 Emphasis) demonstrates the design principle of emphasis as we can see the use of colour contrast and focal placement made by the artist. The red kite clearly stands out against the monochromatic background. This immediately draws the viewers' attention.
5. Design Principles of Balance
Balance is the arrangement of visual elements to create a sense of stability and harmony in a composition. It helps establish structure, emphasis, and movement. This makes the design more visually engaging. Designers carefully position elements to achieve a pleasing arrangement that aligns with the intended purpose or aesthetic which ensures a well-organized and effective composition.
Balance appears in two types:
1. Symmetrical balance occurs when visual elements are evenly distributed on both sides of a central point, creating a sense of stability and harmony.
 |
| Fig.5.1 Symmetrical Balance |
The image (Fig.5.1 Symmetrical Balance) demonstrates symmetrical balance through the mirrored arrangement of streetlights on both left and right sides of the composition. The placement of the moon further enhances the balance. The moon also acts as a focal point.
2. Asymmetrical balance occurs when elements are arranged unevenly but still create a sense of equilibrium through thoughtful placement and visual weight distribution. This approach relies on variations in size, color, texture, and positioning to maintain harmony without mirroring elements on either side.
 |
| Fig.5.2 Asymmetrical Balance |
The poster (Fig.5.2 Asymmetrical Balance) has achieved asymmetrical balance by contrasting the characters Batman and Joker. This asymmetrical balance is maintained through the use of colour, contrast and shape.
6. Design Principles of Repetition
The principle of repetition involves reusing similar design elements throughout a composition to create unity and consistency. This can include repeating shapes, colors, or lines to establish a cohesive visual experience. Repetition can be regular or irregular, even or uneven, reinforcing structure while enhancing rhythm and flow within the design.
 |
| Fig.6 Repetition |
The image (Fig. 6 Repetition) shows the design principles of repetition through its repeating geometric pattern. The repeating interlocking shapes, stars and lines create a sense of unity, rhythm and visual harmony. The consistent repetition of elements throughout the composition provides a sense of continuity and movement which guides the viewer's eye seamlessly across the design.
7. Design Principles of Movement
The way a design guides the viewer’s eye throughout a composition, directing its flow and focus.
Motion or movement in an image is created when elements appear to be in action.
Visual movement is influenced by the use of shapes, forms, lines, and curves, which help establish a sense of flow and dynamism within the composition.
 |
| Fig.7 Movement |
This image (Fig.7 Movement) clearly demonstrates the design principle of movement through perspective, motion blur, and leading lines. The converging lines of the tunnel and tracks create a strong sense of depth and direction, drawing the viewer's eye toward the bright focal point in the distance.
8. Design Principles of Unity & Harmony
Unity is the sense of visual harmony and coherence created by intentionally organizing and integrating design elements.
It balances shapes, colors, textures, and typography to form a cohesive and visually pleasing composition.
Unity ensures a smooth visual flow, directing the viewer’s eye, enhancing communication, and evoking a desired emotional response.
 |
| Fig.8 Unity & Harmony |
This artwork (Fig.8 Unity & Harmony) has achieved the design principles of unity and harmony by the use of consistent repetition of tree forms, colour gradients and soft lighting. The purple, yellow and blue colours blend together in this composition which creates a sense of cohesion. The uniform style and balanced composition creates a harmonious and visually soothing scene.
9. Design Principles of Symbol
In design, symbols serve as a means of communication, conveying information that can replace sentences or even entire stories.
There are three types of symbols:
Pictorial Symbols – These are simplified images that visually represent objects. |
| Fig.9.1 Pictorial Symbol |
This image (Fig.9.1 Pictorial Symbol) effectively demonstrates the design principle of pictorial symbols by using simplified illustrations to represent environmental concepts. The recycling bag in the center, featuring the universal recycling symbol, visually conveys waste management and sustainability. Surrounding icons, such as a light bulb for energy, a water droplet for conservation, a plant for growth, and a recycling icon for eco-friendly practices, enhance the message.
 |
| Fig.9.2 Abstract Symbol |
This STOP sign (Fig.9.2 Abstract Symbol) is an abstract symbol because it simplifies communication using shape, color, and text rather than a literal representation. The red octagon universally signals danger or caution, while the bold text enhances clarity, making it instantly recognizable and understood.
Arbitrary Symbols – These have no visual connection to their meaning and are created with assigned significance. Often based on geometric shapes and colors, they require learning to understand their meaning.
 |
| Fig.9.3 Arbitrary Symbol |
This PlayStation logo (Fig.9.3 Arbitrary Symbol) is an arbitrary symbol because it does not visually represent gaming but is designed with abstract shapes and letters. Its meaning is learned and associated with the brand through recognition and usage.
10. Design Principles of Word & Image
Imagery plays a crucial role in both print and digital design, helping audiences connect with a brand or concept when the right visuals are used. Selecting relevant and appropriate images is essential for effective communication.
Pairing well-chosen words with imagery enhances the meaning and impact of the design. The use of a suitable typeface and strategic text placement establishes visual hierarchy and balance.
Typography refers to the art of designing and arranging text to effectively convey a message or concept within a composition.
 |
| Fig.10 Word and Image |
This design (Fig.10 Word and Image) effectively applies the "word and image" principle by seamlessly integrating text and visuals. The word "Footshop" is shaped to resemble a sneaker, reinforcing the brand’s identity. This combination enhances visual communication, making the message clear, engaging, and instantly recognizable without needing additional explanation.
11. Art/Design
 |
Title: Composition with Red, Blue and Yellow Artist: Piet Mondrian Year: 1930 Size: 86 x 66 cm Media: oil, canvas Source: wikiart (labelled public domain) |
Reason for choosing this composition
Piet Mondrian's Composition with Red, Blue, and Yellow is a great illustration of how basic design principles can produce a composition that is both visually appealing and well balanced, which is why I chose it. One of Mondrian's best-known works, this 1930 painting demonstrates his distinctive Neoplasticism, which is based on geometric abstraction, primary colors, and compositional harmony.
Mondrian's careful balance and organization make his work highly significant. By dividing the canvas into discrete areas of red, blue, yellow, and white using straight black lines, he reduces visual aspects to their most basic forms. The artwork is a great example for examining important design ideas because of the accuracy of these components, which produces a sense of order and clarity.
Furthermore, Composition with Red, Blue, and Yellow shows how much aesthetic impact can be achieved with simple elements. Mondrian creates a piece of art that feels both dynamic and structured through the use of contrast, balance, and unity. His work is a pertinent and perceptive option for this study since it has had a significant impact on modern graphic design, architecture, and visual arts.
Design Principles Observed
- Gestalt Theory: This design makes use of the Gestalt principles of closure and simplicity. Despite the distinct rectangular shapes, the viewer sees a single composition.
- Contrast: By contrasting the primary colors—yellow, blue, and red—with the neutral hues of black and white, Mondrian creates an eye-catching contrast.
- Emphasis: Because of its size and striking hue, the big red rectangle in the top left corner attracts the most attention.
- Balance: The composition is well-balanced in spite of its asymmetry.
- Repetition: Mondrian uses black lines, both vertical and horizontal, repeatedly to give the composition structure and coherence. Rectangular shapes are repeated, which adds to the artwork's rhythm and stability.
- Movement: The viewer's eye is guided across the design in a structured yet dynamic manner by the placement of the lines and colors. Movement is guided by the black lines, and the viewer is kept interested by the color contrast.
- Harmony and Unity: Harmony is established by using only primary colors and basic geometric shapes. A sense of coherence is produced by the regular application of straight lines and a grid-like layout.
- Symbol: Mondrian's artwork embodies universal harmony and pure abstraction.
- Word and Image: Although there are no written components in this work, the visual language is strong enough to convey modernity, balance, and abstraction without the use of words.
Feedback
The lecturer told me that my work is good overall. However, the art I chose might be a bit challenging for task 2 and 3 since it doesn't have any much to work-on due to its simplicity. He left the decision, whether to change my chosen design or take accept this challenge, completely up-to me.
Reflection
My comprehension of basic design principles and how they are applied in visual compositions has deepened as a result of finishing Task 1. Through my analysis of Piet Mondrian's Composition with Red, Blue, and Yellow, I was able to recognize the importance of structure, balance, and minimalist design. I discovered how Mondrian skillfully combined Gestalt concepts, contrast, emphasis, repetition, and harmony to produce a composition that is visually captivating and has a sense of structure and movement.
Understanding how the design principles influence how an individual perceives and interacts with a design was one of the most important lessons learned from this work. For example, balance ensures stability, repetition creates rhythm, and contrast draws attention. My capacity to evaluate artwork and design items objectively, focusing on their practical as well as communicative qualities, has improved as a result of this knowledge.
This knowledge will assist me in producing more deliberate and organized designs in the future. Visual hierarchy, clarity, and engagement will all be enhanced by using these concepts whether working on digital interfaces, branding, or graphic design. The study of Gestalt theory has also improved my ability to arrange components logically, which guarantees that designs are clear and functional. Now, my design path has a solid basis thanks to this work, which has also given me the necessary abilities for my future creative pursuits.
Comments
Post a Comment