final thoughts and uploading

Finaly all work is completed.

 

I have certain thoguhts on my pieces

Website: I am very happy with i belive the style is very simple but professional providing infomation using very neat HTML and CSS also using open source comment box which we learnt this year all in all i am very happy and cant wait to upload to web server. I would add more content given more time and also postion each pages clouds slightly different to give each page a little uniqness however how it is works fine and looks great.

 

Book: I am also very happy with the book althoguh i have had trouble achieveing what i orignaly set out to do i belive the look and funicanality is very good the way it opens out would be interesting plus the diagram is not hard to looks at its actully fun to the eye. Given more time i would do the reasearch for real and perhaps spend mroe time creating the arrows between the links. overall i am happy and belive the piece is very different to that created by others.

Indesign problems

Whilst createing the book i have had numerous problems trying to get to grips with indesign to me it just doesnt make sense also for the purpose i am using it i also belive its not the correct tool.

My book does not operate like a normal book although its 12 spreads they open into 1 in a way that laying out in Indesign is just impossible.

 

In order to create my book how i want to it work i have exsported the dismensions into photoshop and started to create it in there as it is a diagram not a coloum scrict format book. I put the diamensions into photoshop and create 1 canvas which i could work on marked out the work area with rulers and made sure i knew where the pages ended and started whilst being able to see it all together and not spli across different art boards. Mary herself had trouble coming to a conclusion on which program to use when i asked how to set up in in design i did not get a final answer but was told illistrator might prove better but unforuntly i was left non the wiser. I have done the book in photoshop into 1 giant image then is rulered out however i croped and saved multiple times so that each page is saved i then placed onto a in design book in order to furfill submission require ments i understand that in short is a “Workaround” however i would argue that it is nesessary and proved better for it achiveing a much better result than i could have hoped for.

Here are the images:

This slideshow requires JavaScript.

Why Clouds?

I have been working on my piece for somtime now and when someone that i showed a work in progress to asked me “Why Clouds” it made me think i havent actuly exsplained my thinking it just seamed right so here it goes…

 

Clouds for me represent the perfect metaphor in relation to links. Clouds are objects that travel around disappear and reappear often change shape or form but allways providing the same job much like a link that takes us around cyberspace even though we dont fully know where we are going we know that we will end up some where else. Links also come and go with websites and they too change shape form being used within images, text, quote’s etc. So to me clouds are similar arnd provide a very literal image version of a Link they also provide a nice contrasting astetic and make great content boxes.

cloud design

I have been using photshop to create a series of images.

 

The first set of images i created where clouds to be used as a header and content for website also to be used in the book to represent links. These where made entirely in photoshop by hand using a tutorial online.

 

The second thing i created was a sun this was intirely for the website my idea was that as a “You Are Here” statement the clouds that are navigation  the one you was on would have a shining smiling sun behind it. I create 4 different version 1 for each page.

 

I also created a footer that is supposed to look like grassy hills i made it in photoshop without any tutorials.

 

There is also a 3px wide image that will be repeated to create my background image on my website this means that no matter how wide you pull out the screen the page will always blend in.

 

Here are the images:

This slideshow requires JavaScript.

More idea development

After to looking at all the minimlist websites i have to a revelation to how my book and website should actully look. I have diteced the previous colour themes and chain ideas as they we a little obvious with not a lot of thought behind them the new style that i wish to aim for is a cartoon scenery cloud layout. I have found a a tutorial on how to create cartoon clouds, background and suns.

For my website i will layout all content onto cloud which are in a sort of table format however slightly off centre to give that natural feel mabey with content hanging of the sides aswell so for people that look around the website more will find little hidden content. I wish to carry on the idea of everything being a link including pictures hoever because links can overtake the piece each paragraph will have its own link realting to the theme of content and the background image will not be a link due to mabey clicking the wrong object. I wish to have birds, building etc. in the background however so these could easily be links as they will have no content over them.

For the book i wish to carry out the exact same idea as before laying out a massive mind map however insterad of the chains and diagram feel i will use the same cartoon clouds and sky to achieve a direct link between the website and the book. The diagram however is going to need a way to show the different type’s of links or the amount of links from each website i aim to do this through using photo shop to put a colour tinge to each type of cloud. My current thinking of the key would be somthing like this

“colour=0-10 links

colour=11-20 links

colour=21-30

etc.”

however i will need to put more thought into this and create a set of cloud images to test it out.

Minamlist websites

As a resource for research Shelley suggested looking at a few minimalist websites to get an idea of how they look and feel.

here are some websites and notes i made on them:

http://www.saschaeggenberger.com/

The website above is a very simple website however it feels and looks very nice and well designed. The website is only one page of large text but the typography is perfect for the theme and the background has a lovely texture to it that makes the piece really stand out from others. i would however create more pages and have some sort of navigation built in as she is offering web design however not showing much web design more just graphic design on show. This piece also has no real grid layout however that is just because the lack of content the statement just has to sit in the middle.

http://www.delarocque.com.br/11/home.html#mywork

The website above is also again a one page website however through the use of navigation it gives the impression of a multiple pages. I like the very unique idea of navigation combing the use of a fixed position with links that not link to another page rather a new location on the page is very stylish it achieves a good look whilst advertising his abilities to think outside the box. The only problem i would image is the site on a smaller screen probably would struggle as you would either lose navigation or content.

http://www.vanityclaire.com/#home

I like the website above for the style and look they have used colors to contrast and it works very well creating a funky and very designer feel to it. The website is also very friendly using language to talk the audience directly and make jokes however i do not like horizontal design it feels like there is just to much on one web page and is not the easiest to navigate with a average mouse as there is no side scroll bit plus when you do use the links on the “first page” if you wanted to go to a certain other page you either have to scroll through them all or go back to the home page then click the link you now want. this is still interesting however the navigation lets it down.

http://www.thibaud.be/

Research

Whilst researching for links to use in my project i have come across the following all of these are relevent into my theories and design process.

 

Tutorial Links:

How to create a cartoon Sun-  http://www.webdesign.org/photoshop/drawing-techniques/how-to-draw-the-cartoon-sun-exclusive-tutorial.16991.html

How to create a cartoon Cloud- http://www.photoshopstar.com/graphics/cartoony-splash-page/

 

Interesting Links for website:

WIKI Definition of six degree’s of seperation- http://en.wikipedia.org/wiki/Six_degrees_of_separation

Theory proven?- http://news.bbc.co.uk/1/hi/7539329.stm

Facebook 3.64 degree’s of seperation- http://www.bbc.co.uk/news/technology-15844230

Organic trafficing- http://en.wikipedia.org/wiki/Web_traffic#Organic_traffic

Idea Development

During a lecture with Shelley i explained my original idea for a website design the concept behind it and what my book was link in relation however through speaking to Shelley its not the content that has to be similar rather its the feel and look of the two pieces so my original idea concept wise still works however the look of the website will have to be completely different to have the same feel as my book.

We spoke more about the book so we could get a relating idea for the web site when we came up with the idea of mind maps as a layout. I have now started to draw out possible looks for the website so i can get an idea of how the web site will look as well as work. I plan to make my website a giant mind map so it will start at the top with the links in a “bubble” then lines running off into other bubbles which will hold the content all should be internet linking and have a feeling of floating there rather than a grid layout. The logistics of this type of website can be very difficult as i will have to create the background that is an image covering the whole of the page which has the lines and perhaps the boxes for the text allready there then using positioning i will have to place each bit of text separately onto the laid out area.

I have started in Photoshop to build a mock up of how the website will look however this is just basic and i will need to know how much content there is before i create the website as when creating the background i have to think ahead on what will be there. The idea is very complicated however if done right should provide a very unique idea which will be very professionally looking as well as having a similar feel to that of my book.

web design color themes

I have drawn out idea for my websites with this in mind i wanted to get an idea of color themes so using the Adobe Kuler theme creator these are possible color schemes that relate to the subject matter and have a nice ascetic. all design for website will also impact for the book as i would like the astetic to be iconic for my piece and be recognised instantly.

these are examples of some of the colors themes i have liked so far.

http://kuler.adobe.com/#themeID/395406

http://kuler.adobe.com/#themeID/168039

http://kuler.adobe.com/#themeID/724809

http://kuler.adobe.com/#themeID/1766912 (this one a little different but still a really nice contrast not sure for the website though)

http://kuler.adobe.com/#themeID/1809244 (i created this one not great though like 2 or 3 colors black doesn’t really fit)

http://kuler.adobe.com/#themeID/1809254 (i created this from a stock image this one involving red)

http://kuler.adobe.com/#themeID/1809248 (created from a images of a silver chain quite a nice one as well)

The name for the website at the moment is “The Internet Link” and i have an image in my head of a black with silver maybe shades of blue. I am also researching into images looking for a stock image of a clean high resolution metal chain that i could use as a header or possibly as a boarder i have found a few (see below). These all look really nice i will remove the background to create and add a title to try create a header then from this i will then redo the kuler from that image it might give me a final set of color to work from whilst web designing.

This slideshow requires JavaScript.

Design continued

I have been thinking more about how the diagram would actully work within a book format. I have come up with the idea that the book will have fold out pages which in the end create a poster like size with the diagram spreading across the whole page but leaving small gaps for people to start adding in there own links to creat an even larger piece this also continues the idea of natural digression reaching even further links across the cyberspace. This should link into the website if possible a page where people can select a site on the diagram and type in the new link they found which will open it up on the diagram to everyone else aswell.

These are just passing ideas i have drawn some of them out on a sketch pad and will continue to add to them however the logistics for this idea is a little overwhelming as each time a person added a links the website would have to exspand to create space for the work so a repeated background would also be needed. The book however is fixed but also is limited as links would slowly become inative or lose the links to the other websites shown however at the time of creation it would work proving the theory.