Here is the adress for the site

http://www.arch.usyd.edu.au/~tsin8905

The Presentation

Well today is it.  The site is a lot smaller than i had intended, this is due to lack of time and not realising the technicality of some of the things i wanted to do.. 

One of the things i have learnt from the process is that when you have a guiding concept it really drives itself... The plan for the project changed a lot as the work progressed.  This is great as it makes the meaning stronger but also annoying because things keep changing /evolving.  

Key points for the presentation:

its about multiple dimensions - quantum theory

its about representing space

its about the spaces in between

its about constant movement - i forgot this bit in my talk

its about layer and merging of space

I think things came across pretty clearly.  I am worried that it wont be clear enough without me to explain it.  

In Regards to AUDIO the general consensus is put it in.. so i just did and will post the site with the audio option.

All in all things went fairly well. 

I have learnt a lot this semester.  Particularly about knowing the limitations of software and the web... It can do a lot but is suprisingly difficult to design for. i feel i have improved my grounding in software. knowing what file types to use and how to structure things.. something that i think is really important basic stuff but i never knew.  I also learnt hat the best things are often not suing the coolest stuff.  find a program that does what you need to do rather than designing to suit the program.

 

 

The Pannning

In the end i couldn't get the scripting to work on my site so i don't have the panning effect.  this is a bit of a drawback as it looses its immersive feel.  However that being said hopefully the page filling the screen will help.

Dimensionifying Audio

I have spen some time recording sound and then "dimensionifying it".  

I recorded some sounds, speech and street noise.  Then used echo, chorus and flange(delay) effects to simulate the effects i am applying to the images. (but in sound form)

The end result is fairly bizarre and represent a soundscape more than anything else.  I think the sound is very appropriate but  i am not sure if i should include it or not.  I will have to see...

Revision of order

I have changed the order

1. intro 

2. animation 1

3. animation 2

4. explanation - This is at the end because it provides some meaning and will make people want to view it again. 

The spaces between

I have always thought of the website as an immersive 3D environment.  However this requires either a lot of javascripting which i am not confident in or a massive file size for the site and a new modeling program with higher rendering.  

It more important that the site explores the potentials of space than it being a 3D environment.. therefore i will focus on these aspects to make my concept as clear as possible.

the layout will be more simple...

Here is the new version.

Intro - explaining what the site is about

The spatial concept - dimensions in dimensions

Animation one - multidimensional spaces as patterns

Animation two -  as above but differently

Progress Update

I have been trying to get as many different types of animations as possible.  However i am limited by what different options actually follow the concept.   As a result I will have less animations than expected.  This means that the resulting site will have less pages than expected and reduces the immersive quality.  

I still dont have that scripting for the movement around the page

Also i feel there is an element missing from the site that explains what it is about.. So i am including a new part...

It is basically a 2d representation of 3d which is then put into 3d space.o this makes the resultant number of dimensions 9.  well not really, it will just be more planes on the same dimensions.  But... at least conceptually it will make things clearer for the audience.

Project Update - the new animation

After speaking with Gianni I have decided to make the animation in flash.  It is pretty easy - much easier than photoshop.  

I have also realised that the interaction to the site will have to be revised.   I now think i will have a couple of animations that all work the same way but are of different scenes. Then they will be linked by 'hotspot' areas.  They will be integrated into the key areas so that you zoom into those spaces.  Thus the hot spot will initiate a new image of the area and it will zoom in - An animation in an animation.  

Note:  Gianni will try and find the code to give me the movement around the screen

For audio i am planning to add reversed sound with reverb and chorus...

Project Update: Problem - movie file size

I have run into a problem.. the movie file sizes for the animations from the 3D model are too large.

Exporting the animations @ 600x450 @ 10fps resulted in an 11meg file size. For the final site the animation needs to be at least double the size if not more. The resulting file size would be way too large load on a web page.

Another issue is that the quality is not sufficient to have a seamless transition Sketchup cannot export at a higher definition.

As a result i need an alternative. a simple means to convey a change in orientation. the animations themselves were essentially a zoom with a rotation of the view. This is relatively easy to do in flash. The trick is how to change over to the next image:

The options are:
1. Bury the images in major image so that when you zoom through you can get into enough detail. - this works for one level of detail but only allows a linear progression.
2. Have a cross fade at mid rotation. can look cheap if not done well.
HOWEVER there is the potential that the page is always in cross fading thus everything would blend into one constantly moving image.. The major issue is how to get smooth transitions.

Option two is the best option. Assuming I can get smooth transition animations in photoshop or imageready...

The page will be one animation which you can change time around.. the BEST way to do this is to find a way to make a mouse over operation that moves you in the timeline.

This solution is much better. much simpler and ultimately more effective. the final touch would be if there was some way to make the whole animation rotate, so the mouse over also changes the orientation.

I need to see what is possible before I go any further. I will ask Gianni in class.

The Final Concept and Storyboard

The Concept

The website will be an exploration into space and dimensions. It will be constantly moving and changing depending on the users mouse movements. The base images are similar to those previously posted.

Space and dimensions
The images used for the animation are perspective emphasising the images depth. these images are then merged to change the perspective and space the evolves. During this transition you are left in an in-between space which is the merging of two different spaces. Thus our perception of space is constantly changing whilst never being defined.

Movement and interaction in the site
The actual page will be bigger than the window size which allows people to move around the site similarly to the iPrefer website.

The page itself will also be an animation which constantly changes
mouse over animations will also change perspective within the base animation.

The Storyboard

What I need to do to get my website up

ASSESMENT OF IPREFER WEBSITE

ASSESMENT OF IPREFER WEBSITE


Website adress: http://www.prefer.com.tw
I Prefer International Group
Artworks by River Kuo
Website Programming DesignbyFog

TOM SINGLETON
200327414



Introduction

The website is for a Taiwanese fashion designer showcasing work and latest news. The site is built in Flash, and is composed of a variety of simple elements creating a highly effective collage.


Loading Page

The loading page is in my opinion the best feature of the site. It slowly ‘draws’ a scene whilst the page is loading, this scene sets the character of the site. It also creates suspense whilst the scene is being revealed, this immerses people in the experience. This is done by slowly revealing hand drawn sketches, using (possibly) a releasing clipping mask or covering object. This makes the sketches appear to draw themselves. The use of hand drawn images also creates a closer connection to the audience as people can more easily relate to hand drawn work than computer based drawings.

The scene is set on a stage that is larger than screen size, rather than using scrollbars, action scripting (?) is used to move around the screen depending on the movement on the mouse relative to the centre of your window. This is makes the user feel as though they are involved in the site as they can ‘move’ around inside it as opposed to just viewing it.

The content of the scene is composed of images, rollovers, and small animations. They all work together with a collage effect overlayed with varying transparencies. They animation is not particularly detailed but its design suits the style of drawing s animated. The level of detail and finishing of the drawing and animation give the page a scrapbook effect, almost as if we are watching the page come to life.








































Main Page


To move to the content of the site you can click on a house ( a button with mouseover animations in front - which part). This takes you into a room with the same scrapbook feel as the loading page. There is a background image which is again is larger than the screen size which you can move around. In front of this image objects are placed as mouseover animations some of which are links, the mouseover also activates a small caption bubble with a description of the content.

On the top right off the screen there is horizontal menu with vertical scroll menus. Upon selection, content appears in a defined area over the background image. The menus are animated to give them movement, each of the images in the collections are rollover images with blur and zooming effects.

This page is a collage of content and a collage of different design tools. Simple animations and movement have been used to great effect to create an immerse site which feels much more immerse and involving than it actually is.















One of the key aspects of the site is that it is fun. There are many elements of the site which have been designed purely to add to the character of the sit and for the user to enjoy. the images below show an example of this in the doorway to the right hand side.










Summary of the key features of the site:

• Scrapbook character makes the site feel personal
• Animation and movement combine to create an immersive environment
• Effective use of varying techniques to create an effective page without overdesign
• Although the page is complex in its number of elements it is clear and effective
• There is an element of fun – a great way to get a positive opinion of your product

Week 11 - Class Notes

Todays class was a quick recap on animation, using photoshop in particular.

nothing new but good to recap...

The Assesment: 

Was to make a three part web page using prescribed images and including animation.  the point is to make it look good, it is art not design...

I made the animations in photoshop. it is easier and i am much more confident than on flash and it works week, however it also limits your potential to link files from rollovers or buttons

The Start

Here is the image that i think i will start my page from. It looks a bit deathstarish but i think that is okay. It is important that peolpe see this is a model in a dimenionless space. Perhaps the model could come out slowly as the page loads... that would be a better way to intriduce it. it would be een better if at the start you could move it around. perhaps the background would bet better as a pattern too that was it represents more the ideas of dimensions depth and spatial perception.

Extra Dimensions

Excerpt from website:www.superstringtheory.com

The theory currently known as M

Technically speaking, M theory is is the unknown eleven-dimensional theory whose low energy limit is the supergravity theory in eleven dimensions discussed above. However, many people have taken to also using M theory to label the unknown theory believed to be the fundamental theory from which the known superstring theories emerge as
special limits.

We still don't know the fundamental M theory, but a lot has been learned about the eleven-dimensional M theory and how it relates to superstrings in ten spacetime dimensions.

In M theory, there are also extended objects, but they are called M branes rather than D branes. One class of the M branes in this theory has two space dimensions, and this is called an M2 brane. Now consider M theory with the tenth space dimension compactified into a circle of radius R. If one of the two space dimensions that make up the M2 brane is wound around that circle, then we can equate the resulting object with the fundamental string (one-brane) of type IIA superstring theory. The type IIA theory appears to be a ten dimensional theory in the normal perturbative limit, but reveals an extra space dimension, and an equivalence to M theory, in the limit of very strong coupling.

We still don't know what the fundamental theory behind string theory is, but judging from all of these relationships, it must be a very interesting and rich theory, one where distance scales, coupling strengths and even the number of dimensions in spacetime are not fixed concepts but fluid entities that shift with our point of view.

So is it possible?
Here is an except form a newfeeds about a new telescope that may allow us to observe 'another dimension'.

http://space.newscientist.com/article.ns?id=dn11172&feedId=online-news_rss20

Cubism and Cubo-Futurism

Both of these movemnts were creating artworks which drew from spatial qualities- perception, perspective and spatial relationships.

By creating the virtual spaces in my model what i have done, is really very similar to the cubist concept. looking at the aforemented qualities in a 3 dimensional space (albiet on a screen) rather than a 2d canvas (with some exceptions, of course) and we come back to my thinking at the beggining of the course about the 3d to 2d relationship. - how to represent the 3 dimensional environmments in 2d.

Furthermore the futurists were also concerned with the representation of time in thier works. im my proejct the perspective and depth play a large role in repersenting time and potential movement, this is emphasised by the visibility through the walls.

THUS:
My work is perhaps better as an exploration of the spatial qualities that i have created in my virtual model rather than tryinh to turn it into something else.

The following is a link to an intersting writing on picasso's cubist work and what the advent of cubism means:
http://uk.portalmundos.com/mundoarte/comments/cubist.htm

Futher note:

If there are 3 traditional dimensions with a 4th for time. What does the potential for there to be up to 11 dimensions means for our perseption and creation of space.

Site visuals - Perception and Patterns

I originally intended to create an immersive 3d web environment. However I have found that what we have learnt, and the time we have is insufficient to do this effectively.

Whilst preparing the 3d model i have found an interesting aspect of the model is to do with patterns created by spaces and more specifically created between spaces. its the bits in between that count...


Here are some of the images which give an indication of character/atmosphere of the site.

The following images are examples of the patterns created by the relationship between the spaces.

The following images are the last in the sequence. It then morphs into a cubist painting, which is in itself a representation of spatial qualities and relationships.

This is the new blog site

As the last site ran out of storage space i have transfered it over to this adress. for now i will continue posting here..

For reference to work prior to October see blog.

http://iblog.net.au/tsin8905/