Final Site

Here is where you can find my final website..

http://sws.canterbury.ac.uk/cr243/index.htm

Advertisements

Implementation

I was quite daunted to start the making of the website as I knew the horizontal slide would be a challenge and I was afraid that it wouldn’t work. I watched tutorials and read up and downloaded many different basic layouts and eventually I got it to work. Below is the initial frame-work before I put in content and started styling it.I created this by using dreamweaver but hand coding as I find all the dreamweaver buttons are scary and confuse coding in my mind. Also I like the fact that through letters and symbols I’ve made a website look good, and that gives me real satisfaction.

Once the frame-work was successful, I started adding in notepad background, changing the background pattern, then title, and navigation and eventually content. This was the “easy” part. However, occasionally I would try to add in a bit of css and it would stop the horizontal scroll completely, and then spend ages fixing it again. During the making of the website I found the horizontal slide quite difficult especially as I don’t really know javascript. But I did manage to pick up a few bits, but it was definitely difficult to get my head around so I have decided to pick up a few books over the summer and read and teach myself some javascript, so I feel more confident in the future.

I have also found that I enjoy more structured websites and found this really difficult as I kept trying to make it more free and I feel it shows in the outcome. However, this assignment has taught me way more than my first as it was more of a challenge and a lot more hard work(even though it was only one page!!)

One thing I may do differently is make it more interactive, make it maybe more of a puzzle and that way I could have used roll over images and titles more.

Website Elements

After deciding the style of both my book and website, I thought it was about time I designed the website elements in photoshop, so I could incorporate them in easily. See below an image of my title, all of my links, my background and a few extra things just incase.

This slideshow requires JavaScript.

Now what..?

Once I had my title sorted, this really drived my content. I took pictures of specific objects that would relate to my memories that would relate to the four different types of recalling memories. See below for the pictures I actually took, and then after is the old styled photos that were done in photoshop that I will use in the book and on the website.

This slideshow requires JavaScript.

 

Title

I felt the title of the book/website was bugging me the most and stopping me from moving on, I looked at meaning of memories and the mind and memory, and came across the word Subconscious, which means the following:

adjective

1. existing or operating in the mind beneath or beyond consciousness: the subconscious self. Compare preconscious, unconscious.
2. imperfectly or not wholly conscious: subconscious motivations.
noun

3. the totality of mental processes of which the individual is not aware; unreportable mental activities.
This really sums up what I’m exploring within my book and website. However just calling it The Subconscious doesn’t really say much and seems too factual. So I thought maybe I want to make the subconscious seem more important and maybe it is just as important as the conscious mind. So I explored the word important and found the word significant. So there is my title.
The Significant Subconscious.

Typography

Whilst still getting my head around using InDesign to create the book, and a bit daunted by the website coding, I decided I would look it to the typography of both as I want there to be a consistent style. I want the style to be slightly handwritten as if to say its someones memories. Because I wanted the same typeface for both this has limited me to using @fontface kits. Below are a few trials that I did.

Out of these typefaces I really like the first one because its easy to read but still looks a little like someones handwriting, it is called Veggieburger and can be found at http://www.fontsquirrel.com/fonts/Veggieburger

I need to decided what typeface I would like on the book cover and in the website header as I may want something more elaborate, especially if it will be incorporated in with the ink blot.

Header Insipiration

As I now know my cover for my book is based on ink blots, I want to make sure the header of my website correlates with this. So I have looked around at others headers as below and found I really like the use of real elements and the black sketchy look, so I will redo a few mock ups and incorporate the ink blots and same typeface in the header.

This slideshow requires JavaScript.

Continue reading