Download presentation
Presentation is loading. Please wait.
Published byNoah West Modified over 9 years ago
1
MU120 Digital Media Design & Development Design Principles 2 See presentation available from Lectures page of module website http://mmedia.glos.ac.uk/mu120 http://mmedia.glos.ac.uk/mu120 Review Assignment
2
Design principles Review the Flash presentation from week 2 Alignment Proximity Contrast Repetition If you have trouble remembering these, try rearranging the initial letters and using the mnemonic!
3
Critique – Alignment, Conrast
4
Critique – poster - all 4 But where is the Designer’s grid?
5
Print design example Alignment? Beware of fillers
6
Reverse of flyer Alignment? Notice colour coding – prepare reader for Repetition? Contrast?? Verdict?
7
Contents page (pdf) Tenuous use of colour coding in pdf Contradiction from flyer Result - confusion
8
Classical design – ratio & proportion “The proportions of the formal elements and their intermediate spaces are almost always related to certain numerical progressions logically followed out.” Josef (Müller-Brockmann, 1968) References Müller-Brockmann, Josef (1968) The Graphic artist and his (sic) design problems. New York: Niggli Ltd. Müller-Brockmann, Josef (1981) Grid systems in graphic design. New York: Niggli Ltd.
9
Designers should consider proportion Divine proportion Gives 1:1.61803 or Approx 5:8 ABC AB AC CB = 1+5 2
10
Golden section rectangle 5:8 Stonehenge 1900BC Acropolis, Athens & Vitruvius 500BC Rediscovered in Renaissance Leonardo da Vinci c.1485 Dürer c.1521 (also facial proportions) http://www.youtube.com/watch?v=GO3o9drC1mQ http://www.youtube.com/watch?v=GO3o9drC1mQ Le Corbusier 1931 5 8 4 3 800x600 screen 5 8
11
Support from Psychology Fechner tested using man made objects Books, boxes, buildings Lalo repeated the work more scientifically but found the same % proportion
12
Some examples Explanation of Designer’s grid for print http://www.markboulton.co.uk/journal/comments/five_simple_steps_to _designing_grid_systems_part_1/ http://www.markboulton.co.uk/journal/comments/five_simple_steps_to _designing_grid_systems_part_1/
13
Designers and “the grid” Attributed to the Swiss or International style developed after WWII Built on De Stijl, Bauhaus and new typography of the 1930s Seeks to present complex info in a structured and unified manner Characterised by reliance on typographic grid Investigate Max Huber, Ernst Keller, Müller- Brockmann Criticised by New Wave designers in 1980s Investigate April Greiman (US)
14
Design for screens As noted, trad grids based on the classic Golden Ratio do not work for standard 4:3 ratio computer screens 800x600; 1024x768 etc New ‘standards’ emerge “Being close is not good enough; if the items on a (web)page ar not lined up perfectly, the design will look messy” (Vest et al, 2005: p.44) Vest J, Crowson W. & Pochran S. (2005) Exploring Web Design: an in-depth guide to the art and techniques of web design. Clifton Park, NY: Thomson Delmar Learning Where to start? Given that you need to fill the screen at 4:3, consider making the content occupy a golden rectangle
15
Begin with navigation Navigation for paper is ‘understood’ by all users Aim for screen navigation to be as obvious Think ahead for portfolio
16
Assignment scenario Here be Dragons map
17
Assignment 1 Portfolio of 5 tasks Drawing Version 1 of the map Layout V2 of the map to illustrate Design principles Character animation Vector character who will “live” in your map Slideshow Demonstrate the use of scenes so that a user can navigate from the map to a different place Here be Dragons Interactive multimedia map, structured Flash movie Begin in Week 3
18
Navigation needs ‘design’ too! Design navigation in keeping with the theme It’s ok to practise in Flash with standard buttons but you will lose marks if they are still in the final submission Begin to consider your colour scheme See website Resources link for Adobe’s Kuler site Allows you to develop a swatch of colours visually and then note the RGB/Hex values Stick to your palette as far as possible to achieve unity
19
Lab Practical sheet is a START Quite a lot of work this week… Check out Safari http://proquest.safaribooksonline.com/http://proquest.safaribooksonline.com/ Remember to use Rulers, Grid and Guides zoom to ensure HIGH QUALITY with vector graphics Check: if you have used Flash before, have you expanded your knowledge yet? If not, why not?
20
Any Questions?
Similar presentations
© 2025 SlidePlayer.com. Inc.
All rights reserved.