DMDN206 DESIGN AND THE INTERNET

3D collaborative design across global networks

Proj1

PROJECT 1: LAYERED FORM

DUE: FRIDAY 18 AUGUST
ASSESSMENT WEIGHTING: 40%

 

PROJECT OUTLINE

TIMETABLE: 10 July – 18 Aug (6 Weeks)
DIGITAL DESIGN ISSUES: Identity | Visualization | Navigation | Section
DIGITAL DESIGN CHALLENGE: Layered Indentity
PRECEDENTS: Gordon Matta-Clark, Lequeu, Ledoux, Boullee, Aldo Rossi
SOFTWARE: Photoshop | Fireworks | Freehand | Imageready | Flash | Dreamweaver
TECHNIQUES: Image Optimization | Flash animation & interaction | basic HTML
OUTPUTS: HTML page linked to fixed resolution Flash (swf) file containing interactive website. Original Flash file and PowerPoints.
PREMISE: A mass of information is consistently being added to databases and sites throughout the world every minute. With this increase in information comes a need to organise, visualize and identify what is important within that information. It is this collecting, culling and representing of information in a design informed and specific way that makes the basis for this project. Through the use of interaction and animation the designer has new collaborative tools to convey design ideas embodied within an object. Through navigation and interaction the user is able to ‘peel away’ embodied complexity in an object revealing a vast network of user-requested information beneath a simple, easy to use interface. The design becomes the Information Architect.

 

PROCEDURE

WEEK 1:

  • Buy a domain name and server space.
  • Start Flash tutorials.
  • Choose an object or space that you will explore. This could be one of your own projects or another design. Obtain ALL the information you can about this object/ space including design direction/ inspiration, design intentions, sections, photos, links etc. The more information the better.
  • Formulate your own response to this object/ space and elaborate on how you will visualize this object/ space and embody it’s ideas within your project. Online Blog Presentation at beginning of 2nd week.

WEEK 2:

  • Complete Flash tutorials.
  • Research into different expressions of sectional information through designers listed in the "precedence" above and expand on how you might use some of these ideas to explore your own object/ space.
  • Elaborate how you will deal with navigation throughout the site, and how you intend to layer this information gathered. How does this relate to the ideas embodied in the object/ space itself or the aesthetic value of that object/ space? Presentation at beginning of 3rd week in the form of pencil usability test.

WEEK 3:

  • Now you have the plan for the navigation and general layout of the site, you will now work on the visual aesthetic of the site.
  • Expand your pencil outline into a ‘plan of attack’ or workflow for what you will draw in Photoshop, in Flash, or other program and make a start on mocking up this information.
  • Make a Flash File of 450px height and 740px width – this is your maximum canvas size for the web. Online Powerpoint Presentation of aesthetic at beginning of 4th week from your own domain.

WEEK 4 and 5:

  • Using animation and interaction via mouse movement and clicks, manipulate your Flash canvas to show your ideas of exposing, sectioning and layering in relation to your chosen object/ space.
  • Link your website with your domain. This is your ‘publishing’ location. You will create an HTML page that contains your flash file to upload.
  • At the end of week 5 and beginning of week 6 your work will be peer reviewed and critiqued online from your domain.

FINAL HAND IN :

  • Copy your final flash file(s) and PowerPoints to the R drive. DONE!

 

ASSESSMENT CRITERIA

• Experimentation, creativity and the expression of a clear design intent
• Formal and poetic quality of your design vocabulary
• Extent of effective transformation from concept to final design
• Success in production of an easily navigatable website where navigation clearly portrays design intentions
• Success in usability, structure and sequencing of information architecture
• Ability to utilize computing technology to produce an interactive website
• Quality of craft and presentation of project work

 

REFERENCE

CLUES (HELP):    
  Week 1 CHALLENGE
You need to know how to:

– ‘Save to web’ in Photoshop
– Create a specific sized Flash file, or scene? And Publish it as an swf.
– How to create an animation in Flash?
– How to create a button in Flash?
– How to create someting in Flash that, when you click on it, plays an animation; or goes to a point on the timeline.
– Create a ‘mouse-over’ effect in Flash
– Create one page in Dreamweaver with a table containing a Flash document.
CLUES
– links to web sites below under help.
– Check out Flash sites like flashkit for tutorials.
     
WEB SITES (HELP):    
 

From DMDN201
Useful HTML Tags

Useful Javascript Tags
Websites (help)
Websites (conservative)
Websites (fonts)
Websites (HTML)
Websites (design, flash, other)

Photoshop
Adobe
Photoshop Bible
adjusting image qualities
clone stamp and patching
colouring black and white
copying layers and transformations
cropping layers and history
making and saving selections
shadows and burn tool
understanding pixels and dpi
water and reflections

Flash
FLASH BEGINNERS TUTORIAL
FLASH BUTTONS TUTORIAL
www.actionscripts.org
www.flashkit.com
www.flashsupport.com
www.macromedia.com
www.flashmagazine.com
Flash Help Menu (Press F1)

Lectures
LECTURE 01 Intro to Course
LECTURE 02 Usability
LECTURE 03 Navigation

 
     
LIBRARY BOOKS: (PROJECT DURATION Closed Reserve)  
Themans, Minke Bergweg : new notational systems for urban situations
Rotterdam, Netherlands : deMink / 010 Publishers, 2000
NA9208 R6 T383 B
Portoghesi, Paolo Aldo Rossi, the sketchbooks 1990-1997 NA1123 R831 A364 E
Lampugnani, Vittorio Magnago Visionary architecture of the 20th century : master drawings from Frank Lloyd Wright to Aldo Rossi NA2700 V831
Duboy, Philippe Lequeu : an architectural enigma NA2707 L613 D818 L
Lemagny, Jean-Claude. Visionary architects: Boullee, Ledoux, Lequeu. NA1052 V831
Kaufmann, Emil Three revolutionary architects : Boullee, Ledoux and Lequeu Q11 T772 42 pt3
Gordon, Bob & Maggie The complete guide to digital graphic design
Thames & Hudson. London : 2002
TA1637 C737
Rey, Chrissy Macromedia Flash MX : training from the source
Macromedia Press, Berkeley , Calif. : 2002
TR897.7 R456 M
Davis, Joshua Flash to the core : an interactive sketchbook TR897.7 D262 F
     
LIBRARY BOOKS: (8 WEEK DURATION Closed Reserve)  
Birn, Jeremy Digital Lighting and Rendering
New Riders, Indianapolis , 2000
T385 B619 D
Cachola Schmal, Peter Digital/real : blobmeister, erste gebaute projekte
Birkhauser Verlag, 2001

NA2728 D574

Danaher, Simon Digital 3D Design
Watson-Guptill Publications, New York 2001
T385 D171 D
Duffy Ellie, Maggie Troy Architecture Design:Architecture in Cyberspace 2
Wiley Academy, London Vol 68 No 11/12 November/December 1998
p NA1 A3 68 11/12
Field , Marcus Future systems
London : Phaidon, 1999
NA997 F89 F455
Imperiale Alicia New Flatness: Surface Tension In Digital Architecture
Brikhäuser, Basel , 2000
NA 2760I34 N
Jenks Charles, Troy Maggie Architecture Design: New Science = New Architecture?
Wiley Academy, London Vol 67 No 8/10 Sept/Oct 1997
p NA1 A3 67 9/10
Kolarevic, Branko Architecture in the Digital Age : design and manufacturing
Spon Press, New York, c2003
NA2543 T43 A673 I
Lindsey, Bruce, Saggio, Antonino Digital Gehry
Birkhauser, Basel 2001
NA737 G311 L752 D
Martegani Paolo, Montenego Riccardo Digital Design: New Frontiers of the Objects
Brikhäuser, Basel , 2000
TS171.4M375DE
Palumbo Maria Luisa New Wombs: Electronic Bodies and Architecture Disorder
Brikhäuser, Basel , 2000
NA2765 P184NE
Perrella Stephen, Troy Maggie Architecture Design: Hypersurface Architecture2
Wiley Academy, London Vol 69 9-10/1999 Profile 141
p NA1 A3 69 9/10
Porter Tom, Neal John Architectural Supermodels: Physical and Electronic Design
Oxford : Architectural 2000
NA2790 P848 A
Prestinenza Puglisi, Luigi Hyper Architecture: spaces in the electronic age NA 2728 P978 H
Spencer Drate, Jütka Salavetz Extreme design
Cincinnati, OH : How Design Books, c2001
NC998.4 D767 E
Steele James Architecture and computers: action and reaction in the digital revolution
Laurence King, London 2001
NA2728 S814 A
Steve Caplin and Adam Banks The complete guide to digital illustration
New York : Watson-Guptill Publications, 2003
T385 C244 C
Taylor Brian Rustboy : Animating a lifelong dream
Dundee : XL5 Editions , 2003
NC1766 S43 R971
Zeller Peter Hyper Space: New forms in digital Architecture
Thames and Hudson , London , 2000
NA2728 Z51 H
     
Migayrou Brayer ArchiLab: Radical Experiments in Global Architecture
Thames & Hudson, London, 2001
James Shaw copy
     
OTHER DIGITAL DESIGNERS:    
  Actar Architecture  
  Archi-Techtonics  
  Asymptote  
  dECOi  
  Neil M. Denari Architects  
  Pierre du Besset & Dominique Lyon  
  Shuhei Endo  
  IaN+  
  Jakob + MacFarlane  
  Jones, Partners: Architecture  
  Mathias Klotz  
  Kovac Malone  
  Greg Lynn  
  Marcos Novak  
  NOX  
  Oosterhuisassociates  
  Zeller Architecture Reasearch  
     
No comments

No comments yet. Be the first.

Leave a reply

You must be logged in to post a comment.