Task 1 / Exploration

03/02/25 - 21/02/25 ( Week 1- Week 3)
Alicia Lo Yann Wei / 0357917
Design Principles / Bachelor of Mass Communications in Digital Media Production (Hons)
Task 1:  Exploration

1. This is the Module Information Booklet for this module.


<iframe src="https://drive.google.com/file/d/17vDAjAP-4itDql9mvgKgYDGbI72K-lA5/preview" width="640" height="480" allow="autoplay"></iframe>


2. These are the design principles that are taught in this module.

Gestalt Theory

  • "Gestalt" refers to "shape" or "form" in German. 
  • Gestalt principles explain how we perceive complex visuals as unified wholes rather than separate parts.

Key Gestalt Principles:
  • Principle of  Figure/Ground – We instinctively separate elements into foreground (figure) and background (ground).
Fig 1.1.1 Film "M" Poster by Fritz Langs

The buildings in red form the background (ground), but their negative space creates the shape of a large letter "M", which can be perceived as the figure. At the bottom, the black silhouette of a running man stands out as the clear figure against the lighter background.
  • Principle of Similarity – Our brain groups similar elements together, making them appear as part of the same whole.
Fig 1.1.2 Water Lilies by Claude Monet (1916, 200 cm × 201 cm, oil on canvas, Musée Marmottan Monet, Paris)

Monet’s repetition of similar lily pads and their reflections in the water creates a sense of unity and grouping, demonstrating similarity in color and shape.
  • Principle of  Proximity – Elements placed close together are seen as related, while those spaced apart appear separate.
Fig 1.1.3 Spotify Playlist Layout
spotify.com

Songs in a playlist are grouped together in a list format, with track information (artist, album, duration) close to the song title
  • Principle of Closure – Even if a shape is incomplete, our brain fills in the gaps to perceive it as a whole.
Fig 1.1.4 Nike "Just Do It" Poster

The basketball player’s body disrupts the flow of the letters, yet the brain perceives the whole phrase without needing every part of each letter visible.
  • Principle of Continuation – The eye naturally follows lines, curves, or paths to see a continuous flow rather than disconnected shapes.
Fig 1.1.5 The Creation of Adam by Michelangelo (1511–1512, fresco, Sistine Chapel, Vatican City)

The outstretched arms of God and Adam create an implied line that leads the viewer’s eye from one figure to the other.
  • Principle of  Symmetry & Order – Symmetrical elements are perceived as belonging together, creating a sense of harmony.
Fig 1.1.6 The School of Athens by Raphael (1509–1511, 500 cm × 770 cm, oil on canvas, Vatican Museums, Vatican City)

The central placement of Plato and Aristotle creates perfect symmetry.

Contrast 

  • Contrast is the use of strongly different elements to create visual interest.
  • Without contrast, designs can feel dull and monotonous.
  • It helps emphasize key points and enhance communication.


Fig 1.2.1 The Starry Night by Vincent van Gogh (1889, 73.7 cm × 92.1 cm, oil on canvas, Museum of Modern Art, New York)

Van Gogh’s use of contrasting colors (blue and yellow) and dynamic brushstrokes creates a striking visual tension, drawing the viewer’s eye to the swirling sky. The vibrant yellows against deep blues create a dramatic effect.


Emphasis 

  • Used to create focus and dominance in a design.
  • Achieved through contrast in color, shape, or value to draw attention to key elements.
Fig 1.3.1 Napoleon Crossing the Alps by Jacques-Louis David (1801, oil on canvas, Château de Malmaison, France)

Napoleon is the clear focal point, the background’s diagonal lines direct attention toward him.

Balance

  • Balance is the distribution of visual weight in a design to create equilibrium.
  • It can be symmetrical (equal weight on both sides) or asymmetrical (unequal weight but still visually balanced).

Types of Balance:
  • Symmetrical Balance – Equal elements on either side of a central axis; can also be radial (arranged around a central point).

Fig 1.4.1 The Last Supper by Leonardo da Vinci (1495–1498, 460 cm × 880 cm, tempera on gesso, Convent of Santa Maria delle Grazie, Milan)


Da Vinci achieves perfect symmetry and balance in the composition, with Christ at the center and the disciples evenly distributed on either side. The composition is mirrored on both sides. The perspective lines converge at Christ, creating a focal point.

  • Asymmetrical Balance – Different elements on each side but still balanced; creates a more dynamic and modern feel.

Fig 1.4.2 The Great Wave off Kanagawa by Katsushika Hokusai (1830–1833, 25.7 cm × 37.8 cm, woodblock print, Metropolitan Museum of Art, New York)

In the composition, the large, towering wave dominates the left side, while the much smaller Mount Fuji is positioned on the right. Despite this size difference, the elements are arranged in a way that feels visually balanced. The movement of the wave and the placement of the boats help distribute visual weight, keeping the composition dynamic yet stable.

Golden Ratio 
  • A mathematical ratio (1.618) found in nature, art, and architecture.
  • Used to create harmony, structure, and aesthetic appeal in design.


 Fig 1.4.5 Mona Lisa by Leonardo da Vinci (1503–1506, 77 cm × 53 cm, oil on poplar wood, Louvre Museum, Paris)

The placement of the Mona Lisa's face and body follows a spiral pattern known as the Golden Spiral, which is derived from the Golden Ratio. The positioning of key elements, such as her eyes, hands, and smile, creating a natural focal point that draws the viewer’s eye.

Rule of Thirds 
A guideline where an image is divided into thirds, both horizontally and vertically.
Placing the subject at the intersection points makes the composition more engaging.

Fig 1.4.6 Thirty But Seventeen by SBS (2018)

The horizon line is positioned along the lower third of the frame, keeping the focus on the open sky. The two characters are placed near the right third, creating a visually balanced and harmonious composition.

Repetition

  • Repeating design elements creates rhythm and visual consistency.
  • Patterns make designs more engaging by adding surface interest.
  • Variety is important to keep repetition exciting and prevent monotony.

Fig 1.5.1 "Open Happiness" by Riya Patel (2013)

 The Coca-Cola bottles are arranged in a curved formation, creating the illusion of a smile.

Movement

  • Guides the viewer’s eye through a design.
  • Can be created using lines, shapes, and forms to suggest motion.

Fig 1.6.1 Alice in the Wonderland by Disney (1951)

Alice’s flowing dress and outstretched arm, along with the White Rabbit running forward, suggest action and direction. The curved lines of the Cheshire Cat’s tail, the Queen of Hearts’ staff, and Alice’s movement lead the viewer’s eye through the composition.

Hierarchy
  • Organizes content to highlight the most important information first.
  • Helps guide the viewer’s attention in a logical sequence.
Fig 1.6.2 Photo by Lee Ching Tat (李政達) (2015, on behance)

The bold calligraphy and vibrant ikura donburi image draw attention first, followed by the large ¥100 price, making the promotion clear. Smaller text provides additional details.

Alignment 
  • Ensures elements are properly positioned for unity and cohesion.
  • Creates a sense of order and makes the design feel stable.
Fig 1.6.3 Burger King's "My Winter Matcha Pie" 

The matcha pies are symmetrically placed at the bottom, visually balancing the composition.
The placement of the red price tag and the Burger King logo follows a grid-like alignment for clarity.

Harmony & Unity

  • Harmony: Ensures elements share a common trait, creating a cohesive design. However, without variety, it can become monotonous.
  • Unity: Achieved by repeating elements (colors, shapes, materials) to create a consistent theme. While similar to harmony, unity focuses more on balance and coherence.

Fig 1.7.1 The Birth of Venus, Sandro Botticelli, 1484–1486, 172.5 cm × 278.9 cm, tempera on canvas, Uffizi Gallery, Florence.

Botticelli uses a soft, pastel color palette with shades of pink, blue, and gold, which blend seamlessly to create a serene and ethereal atmosphere. The figures are arranged in a balanced and symmetrical manner. Venus stands at the center, creating a focal point, while the other figures and elements are positioned to guide the viewer’s eye around the painting. 

Scale & Proportion
  • Scale: The size of an object in relation to others or a set unit of measurement (e.g., architectural drawings, models). It can also be determined in two ways: actual measurement and visual estimates based on comparison.
  • Proportion: The relationship between different elements within a design. When proportion is well-balanced, it creates harmony and unity.

Fig 1.7.2 Attack on Titan by Hajime Isayama (2009)

The Colossal Titan is depicted as massive, towering over the wall and the soldier. The Titan’s face is exaggerated with large, exposed muscles and glowing eyes, drawing attention and creating an eerie, menacing effect. The soldier appears much smaller in proportion, heightening the sense of danger.

Symbol, Word and Image

A symbol is a sign, shape, or object that represents something else. In design, symbols can communicate information quickly, sometimes even telling a full story.

Types of Symbols:
  • Pictorial Symbols – Simplified images related to the objects they represent.
Fig 1.8.1 McDonald's Icon

The curved "M" shape is a stylized version of the restaurant’s original architecture.
  • Abstract Symbols – Less detailed but still recognizable versions of objects.
Fig 1.8.2 Olympic Games Logo

The interlocking rings symbolize global unity and the five continents participating in the Olympics. It does not directly depict sports.

  • Arbitrary Symbols – No direct resemblance to what they represent; their meaning must be learned (e.g., logos and road signs). 


Fig 1.8.3 Radiation Warning Symbol

A yellow and black symbol that warns of radiation exposure, but without prior knowledge, its meaning isn’t obvious.


Word and Image
Images play a crucial role in design by making concepts or brands more relatable. Pairing images with the right words enhances meaning. Typography also helps create visual hierarchy and balance in design.


Fig 1.8.4 Toyota GR Supra MK5 Poster 

The large "SUPRA" text in bold, red letters interacts dynamically with the background and the car. The tagline "BUILT TO REIGNITE THE THRILL OF DRIVING" supports the visual of the Toyota Supra。



CHOSEN DESIGN 

Up Movie Poster Print Wall Art 8x10 11x17 16x20 22x28 24x36 27x40 Asner Plummer

I chose the Up movie poster because it captures the film’s adventurous and emotional essence. The image of Carl being pulled into the air, holding onto his cane for dear life, immediately sparks curiosity and excitement. His grumpy expression contrasts with Russell’s eager determination, hinting at their amusing and heartwarming dynamic. The floating house, lifted by hundreds of colorful balloons, is an iconic symbol of the film that evokes a sense of wonder and nostalgia.

Beyond its visual appeal, this poster resonates with me because of the emotions it conveys. Up is more than just an adventure—it’s a touching story about love, loss, and embracing the unexpected. Carl’s journey from isolation to forming new bonds is inspiring, and this poster subtly reflects that transformation. The bright colors and open sky give a feeling of freedom and possibility, making it even more engaging.

This poster stands out because it tells a story in a single frame. It invites the viewer into the world of Up, making them wonder what adventures await. Its ability to capture both excitement and heartfelt emotion is why I chose it.

Here are the design principles that I observed in the Up movie poster:

Emphasis – The main focus is on Carl, who is positioned in the foreground with an exaggerated expression, making him the most eye-catching element.
Contrast – The bright balloons contrast with the blue sky, while Carl’s dark clothing stands out against the lighter background.
Balance – The placement of characters and objects creates a visually balanced composition, with Carl in the lower half and the house and balloons in the upper half.
Movement – The diagonal positioning of characters and objects gives a sense of upward motion, making the scene feel dynamic and full of energy.
Harmony & Unity – The consistent color palette and well-arranged elements create a cohesive and visually appealing design.
Symbol – The floating house symbolizes adventure, dreams, and emotional attachment, reinforcing the movie’s themes.
Word and Image – The title "Up" is placed near the balloons, reinforcing the idea of rising into the sky, effectively connecting text with visuals.

Feedback:
Mr. Shamsul suggested adding more examples to my explanation of Gestalt theory to make each principle more specific. Additionally, he recommended changing my repetition artwork to a different one. Everything else is fine.

Comments

Popular posts from this blog