Project Complete!

Tuesday, September 12, 2006

At last the project is complete and ready for hand in! Did a few finishing touches to the website today, made sure everything worked - page links, images, etc.

I thoroughly enjoyed this project (mainly due to the fact I want to do website design when I leave Poly!) I would've liked to learn a bit of flash and had been able to incorporate that into my site design - but I think we are doing that next?

Overall, I am quite happy with my final outcome and with that said, gimme my grade! haha.

Adding of Pages & Content

Tuesday, September 05, 2006

Over the past week I have added various pages to my web page:

  • The Homepage: The index page. Has a welcome message and brief intro as to what the site is about.

  • Introduction: A brief introduction into the first written languages and top five languages of the world.

  • The English Language: Information page about the English language and the origins of English.

  • Random Facts: Totally random facts on words - typewriter words, longest words, place name, etc.

  • Word Fun: Funny ways of using words in English - includes oxymorons, Tom Swifties, Tongue Twisters and Palindromes.

  • Puzzles: Page features a groovy wordfind!!

  • Contact Me: Page containing my email information.
  • Converting Design To Web!

    Tuesday, August 29, 2006

    After creating the layout design, I created roll-over effects for my navigation links by using Image Ready.

    I then opened the .html file into Dreamweaver where I placed a DIV layer over where I wanted the content to go and saved this to keep as my basic template page so that all pages would look exactly the same.

    Intially had the problem of not being able to get the words/content material to fit directly onto the refill lines, however by changing the line- height to 20 solved this (as i had created the line pattern in Photoshop to be 20px apart!).

    Also used a stylesheet to keep all my page styles consistent - defined font type, size, line height headers and link properties - visited, active, hover, etc. here.

    Final Layout Design

    Sunday, August 27, 2006

    And finally it's a layout I like!

    As you can see, I went back to my second design.

    And, After applying many different colour filters/ gradients and many annoying mental debates with myself, I was able to finally pick a scheme I liked!

    Man, I hate being a perfectionist… Can you tell with my nice blog formatting?!

    Ah ha, now it's onto the coding/ scripting of the entire website! (I love nerdy things..) I intend on using Photoshop / Image Ready CS to creaty funky roll-over effects and then placing the generated .html file from that into Dreamweaver MX to finish off!

    Design Development 2

    Monday, August 14, 2006

    With Photoshop:


    First concept:

    Not too sure about colour usage - too many colours perhaps?

    Background looks a little plain too.

    Second concept:

    Added a repeating background image to liven the background.

    Experimented with different colours - complimentary scheme here.

    ##? concept:

    More playing around with colour schemes here - Monochromatic this time. Too boring for my liking however.

    Sometime later:

    Went off on a tangent here - got sick of the other layout. .

    Started with intention of making it look like a noticeboard. Also, tried to 'grunge' it up - ripping up the paper, etc.

    However this design seems to be taking nowhere so I will ditch it!

    Design Development

    Monday, August 07, 2006

    Rough ideas/ sketches for layout design:


    Use pieces of refill to arrange navigational links and content.
    Possibly arrange pieces of paper in a noticeboard format.
    Use of a simple notebook?
    Have a notebook style page for content with scattered letter background?




    Have refill paper, post-it notes, pens and clips arranged on a tabletop?



    Another variation of previous idea.

    The Design: Ideas

    Monday, July 31, 2006

    Notes from last lesson:

    Rather than writing everything, I'll just note the important stuff!

  • First page: index.html or .htm. All file names must be in lowercase. Less than 8 characters, no spacing, symbols, etc.

  • Image files: - JPEG / JPG, GIF & PNG (not often used)

  • Movies: .mov - quicktime, .avi, .mpeg & .swf (flash). most of these require software/browser plugins.

  • CSS: Cascading Style Sheets. Determines how your webpage looks.

  • Screen Resolution: 72 DPI is the internet standard, also 96 DPI available. Screen resolutions vary - most commonly used ones include 800 x 600 & 720 x 1024.

  • Recommended maximum size for each webpage: 150 kilobytes. x_x


  • Design Ideas:

    I'd like to base my overall website design on paper - because that's what words are primarily written on.

    - So backgrounds like refill paper, post it notes, etc.

    - I would like to arrange the navigation links and main body content/text in a noticeboard style layout. However noticeboards tend to look cluttered as notices are placed in an unorganised fashion. Website layouts should be organised & look neat so that visitors can browse/navigate the site easily. So, if I were do do a noticeboard, it would have to be a very tidy one.

    * Will add sketches later.

    Words

    Saturday, July 22, 2006

    So I have decided I will do my website on "words" – more emphasis on written words, rather than spoken ones.

    I will broaden the topic to include areas such as English & other various languages in order to create a reasonable amount of content for my website.

    I will also include topics such as story/ play writing & poetry as well as a modern view on words in everyday life – use of clichés, jokes, puns (play on words), text language, Oxymorons, Tongue Twisters, Tom Swifties & Palindromes!

    As this sounds like a fairly mundane topic, I hope to include some fun interactive material for my site. Things such as word finds, puzzles, and other quizzes on words (spelling for example.) would add a little fun.


    Contents: (NOT FINAL!)

    Introduction to Words & Languages:
  • First written language(s)

  • How many languages in the word today

  • Style of writing in different languages/ alphabet characters.


  • English Language:
  • Origins of English

  • First English alphabet

  • First English words, sentences, etc.

  • First stories, poetry, etc.

  • Developments over time


  • Fun Words/ Facts:
  • Did you know?

  • Oxymorons

  • Tongue Twisters

  • Tom Swifties

  • Palindromes

  • Txt wrds


  • Quizzes & Puzzles:
  • Wordfind

  • Spelling Quiz
  • Brainstorming

    Friday, July 21, 2006

    Just brainstorming for possible website choices.

    Blue: too lame
    Wash: Laundry powder? Clothes? Washing machine? Dishes?
    Talk: Conversation, phones, languages.
    Gestalt: ???
    MOMA: Museum of Modern Art. A possibility.
    Words: Talking/conversation, speech, remark, communication, poetry, stories, English, languages. Vocubulary, expressions, terminology.
    Time: clocks, history,etc.
    Break: Erm...
    Speed: Cars, motor vehicles, etc.
    Law: History of Law in New Zealand?
    Sound: Music, stereos, ipods, etc.

    At this point, I'm likening to the idea of using Words as my theme of choice.

    First Post

    Tuesday, July 18, 2006

    What happened today:
    - Received our brief.
    - created a blog using blogspot.com & a provided template.

    By next lesson: 300 word paragraph & few thumbnail sketches on website I want to create for project.

    The Brief:
  • You will design an interactive web site that describes one of the following: blue, wash, talk, gestalt, MOMA, words, time, break, speed, law or sound.


  • OR

  • A webpage from an era where there was no internet, for example, what would the personal webpage /blog look like if it was made by Genghis Khan.