responding to an environment
TRANSCRIPT
![Page 1: Responding to an Environment](https://reader036.vdocuments.site/reader036/viewer/2022062313/559caaf41a28abe75b8b47a3/html5/thumbnails/1.jpg)
RESPONDING TO AN ENVIRONMENTART & DESIGN: INTERIM REVIEW
![Page 2: Responding to an Environment](https://reader036.vdocuments.site/reader036/viewer/2022062313/559caaf41a28abe75b8b47a3/html5/thumbnails/2.jpg)
MY LOCATION: JUNIPER HALLMy environment was Juniper Hall which is leased from the National Trust, and is an 18th-century country house in a quiet wooded valley within the chalk North Downs in Surrey. There are vast grounds with many different features to study; plant-life, textures, surfaces, colours, landscapes etc.
I took some photos, which I have annotated for some raw sources to
work from and develop:
COLOUR SCHEME
![Page 3: Responding to an Environment](https://reader036.vdocuments.site/reader036/viewer/2022062313/559caaf41a28abe75b8b47a3/html5/thumbnails/3.jpg)
MY OUTCOME & DIRECTION
![Page 4: Responding to an Environment](https://reader036.vdocuments.site/reader036/viewer/2022062313/559caaf41a28abe75b8b47a3/html5/thumbnails/4.jpg)
INFORMATION TO INCLUDE
• Map of grounds
• Map of building
• Opening / Closing
• Meal times
• Room number and pass-codes
• Photos
• More information
![Page 5: Responding to an Environment](https://reader036.vdocuments.site/reader036/viewer/2022062313/559caaf41a28abe75b8b47a3/html5/thumbnails/5.jpg)
GEORGIA O’KEEFFE1887 – 1986
![Page 6: Responding to an Environment](https://reader036.vdocuments.site/reader036/viewer/2022062313/559caaf41a28abe75b8b47a3/html5/thumbnails/6.jpg)
THIS WAS MY CONTEXTUAL STUDY
![Page 7: Responding to an Environment](https://reader036.vdocuments.site/reader036/viewer/2022062313/559caaf41a28abe75b8b47a3/html5/thumbnails/7.jpg)
JING ZHANGINFOGRAPHIC DESIGNER
![Page 8: Responding to an Environment](https://reader036.vdocuments.site/reader036/viewer/2022062313/559caaf41a28abe75b8b47a3/html5/thumbnails/8.jpg)
SOME OF HER WORK
![Page 9: Responding to an Environment](https://reader036.vdocuments.site/reader036/viewer/2022062313/559caaf41a28abe75b8b47a3/html5/thumbnails/9.jpg)
INFOGRAPHIC PUBLICATIONS
“INFORMATION IS BEAUTIFUL” BY DAVID MCCANDLESS“ AND INFOGRAPHICA”, BY MARTIN AND SIMON TOSELAND AND DESIGNS AND INFOGRAPHICS BY, MARK BRYSON AND JESSE BROWN
![Page 10: Responding to an Environment](https://reader036.vdocuments.site/reader036/viewer/2022062313/559caaf41a28abe75b8b47a3/html5/thumbnails/10.jpg)
SOME OF THEIR WORK
![Page 11: Responding to an Environment](https://reader036.vdocuments.site/reader036/viewer/2022062313/559caaf41a28abe75b8b47a3/html5/thumbnails/11.jpg)
IDEA 1 • This idea is for the map of the building
• I started with a photograph of the building
• I then drew a basic outline
• Finally I scanned the drawing onto my computer, and added a darker, straighter more defined outline
![Page 12: Responding to an Environment](https://reader036.vdocuments.site/reader036/viewer/2022062313/559caaf41a28abe75b8b47a3/html5/thumbnails/12.jpg)
IDEA 1• The map for this building will be in the style of these images
by Jing Zhang
• So, I’ll have to enlarge my previous image and apply the appropriate colours and shading
• Then insert the rooms, like the ones in this image (right)
• This would be on the A1 poster
![Page 13: Responding to an Environment](https://reader036.vdocuments.site/reader036/viewer/2022062313/559caaf41a28abe75b8b47a3/html5/thumbnails/13.jpg)
IDEA 1• However, for the interactive website- when you click on a
certain room the whole image could expand like in the graphic below:
![Page 14: Responding to an Environment](https://reader036.vdocuments.site/reader036/viewer/2022062313/559caaf41a28abe75b8b47a3/html5/thumbnails/14.jpg)
IDEA 2
• My second idea is for the interactive website
• It is for the map of the grounds
• There will be a map as a background
• Then when you click on a location (e.g. cafeteria), an animation will be appear
• The animation will show how to get there from the main hall
![Page 15: Responding to an Environment](https://reader036.vdocuments.site/reader036/viewer/2022062313/559caaf41a28abe75b8b47a3/html5/thumbnails/15.jpg)
IDEA 2
• I can use Adobe Firework to create this function, which I was taught below:
By creating multiple layers, slices and using the split tool, you can render the
page so that when the user hovers over an image, more media (e.g. text, picture,
annotations) will appear.
This is what it looks like when exported and opened in a web browser
![Page 16: Responding to an Environment](https://reader036.vdocuments.site/reader036/viewer/2022062313/559caaf41a28abe75b8b47a3/html5/thumbnails/16.jpg)
IDEA 2• I will create my own images, but this is just to show what
the animation (that’ll appear) will look like
• The wave like image will flow from the main building to wherever the user hovered over
• The wave like image is inspired by Georgia O’Keeffe’s paintings:
![Page 17: Responding to an Environment](https://reader036.vdocuments.site/reader036/viewer/2022062313/559caaf41a28abe75b8b47a3/html5/thumbnails/17.jpg)
IDEA 3• I already have the map of the grounds for the interactive
webpage (Idea 2)
• So, for the non-electronic version, I’ll make another map type
• I started by drawing a Georgia O’Keeffe painting:
![Page 18: Responding to an Environment](https://reader036.vdocuments.site/reader036/viewer/2022062313/559caaf41a28abe75b8b47a3/html5/thumbnails/18.jpg)
IDEA 3• I rotated the image, flipped it and then duplicated it.
• Now it looks more like a map, with all the lines, representing contour lines
• When I make the actual image the colour will look more accurate than the second image- but this is how I will make my map of the grounds