Final Website Product

My group members and I have worked really hard on the web project.  It has been a pleasure to work with such a dedicated group and we are very happy with our end result.  I would like to thank them for a great learning experience.

Here is what the final banner looks like:

and here is the link to our website:

http://scah.cdu.edu.au/2012/NMD201/final/homepage/

I am surprised at how quickly the last 12 weeks have passed and am a little sad that my time in NMD201 has come to an end.  I have thoroughly enjoyed this unit and have learned an awful lot that I didn't think I was capable of doing.  I would like to work more on HTML and feel more confident in building websites.  I feel that I have only scratched the surface and that there is so much more to learn.  Composing was very satisfying and it has increased my passion for music and learning all I can about music is more on my agenda than ever before.  I believe I will be able use all the skills learnt in this unit and am now a little less afraid to dive into new software.

What is New Media?

I have been pondering over the article review that is part of the assessment for this blog and decided to find an article that deals with New Media itself.  I have just completed another unit in which I wrote an essay to define New Media and thought it only fitting to review an article about New Media for this unit.

I have chosen the article "Defining New Media Isn't Easy" by Bailey Socha and Barbara Eber-Schmid.  You can read the full article here.

“Defining New Media Isn’t Easy” written by Bailey Socha and Barbara Eber-Schmid from the New Media Institute is an article that defines what ‘New Media’ is. The New Media Institute (NMI) aims to better inform the general public about issues surrounding the Internet and other New Media and Barbara Eber-Schmid is the Executive Vice President and co-founder of the NMI.

The article begins by defining that the term New Media is a term that has been coined that relates to the Internet and the convergence of technology. It offers a definition of what New Media is and therefore what it is not. The authors quote Wikipedia and describe New Media as that which is often described as digital technologies, which generally can be manipulated, networkable and interactive. New Media is actually very hard to define as technologies are constantly changing and evolving. It has an effect on our society, economically, politically and socially and can also enrich the learning experience of students.

This article serves well to try and offer a definition of New Media and all that encompasses that term. It offers a great deal of information on the effects of New Media on our lives and society. The article is easy to read and uncomplicated and includes referencing. The authors genuinely appear to be qualified and experienced to write about this topic and it would make a good reference for other work. For anyone trying to get an understanding of what New Media is and where it may be headed, this article certainly offers some clarity and is an informative piece of writing.

Week 12 - Working on the Website

Tom, Claudia and myself all came in this week although there was no scheduled class, to make sure we are staying on track with our part of the website building.  Tom had arrived earlier and had done a great job of slicing the banner to create all the page links so it is certainly looking like a website now.

Our group is working on the program of events, a welcome page and also a page dedicated to past exhibitions.

Claudia had received an email from Sarah Pirie regarding some material from the previous couple of years exhibitions.  We went through the material together and made decisions on what to include on the site.  We decided to go with a link to the external site for a video from the 7:30 Report and an imbedded file for the other video.  We also decided to include a couple of images of some of the work included in the past exhibitions.

We have put together a brief program with the small amount of information that we now have regarding the inclusions in the event.  These have been listed out according to the venues and what will exhibit in these venues- The Amphitheatre, The Theatre and the Nan Giese Gallery.

I researched the previous exhibitions and found some articles written for CDU news.
Here is the link for the article regarding the 2010 exhibition - "Up Here"
www.cdu.edu.au/enews/versions/041010.../uphere_exhibition.html

and also the link to the article regarding the 2011 exhibition - "10 squared - Art from the Hot Lands"
www.cdu.edu.au/enews/versions/07112011/.../artexhibition.html

We thought we could possibly use these articles but decided that we already have enough content for the past exhibitions.  I also looked up a couple of course outlines that we hadn't been able to find as easily as others.  This information is on the page that informs the user about the students whose work is represented and what those student have been studying.

Website Development

It has been decided now that the assessment item for the web based product will definitely be a website about the end of year exhibition at CDU.

More brainstorming took place and a conversation with Peter Houtmeyers.  As a class we have come up with the bones of the project and we have formed into four small groups.  We have decided that the site needs a welcome page, a schedule of events, a map of where the events will take place, and video, image and website galleries.  The welcome page will also list the focus units that will be in the exhibition and include a brief summary of these units.  We will also maintain a theme throughout the website by using the same banner for each page.

 Group 1 - Kozo, Sachin and Diego - image and website galleries

Group 2 - Edmar and Prashant  - video gallery

Group 3 - Tom, Claudia and myself -welcome page, past exhibitions info and schedule of events.

Group 4 - Chelsea, Brendan and Edmund will work on the layout and map pages.

Here is a photo of a proposed banner of sorts that will be universal across the pages:

Website Beginnings

A lot of brainstorming has been happening in class in regards to the form our web based product assessment will take.  It was suggested that we as a whole class group create an 'unofficial' website to promote the end of year exhibition that will be held for students from the School of Creative Arts and Humanities.

Here is the initial brainstorm map:

The only problem that I see at this stage is that the exhibition details are not yet worked out and we may not have enough information to complete the site, given that the exhibition takes place after the assessment due date and after unit has concluded.

Week 10 - Creating Links within an Image

Researching how to create links within an image, I have found out about using image maps and also about image slicing in Photoshop.

An image map or use map is when you take parts of an image and create a link.  You can specify exactly what part of an image will be a link by using the coordinates that relate to the image and in doing so create 'hotspots'.  So you could have a map of the world on your website and then have each different country as a hyperlink.  You would select Australia for instance and by using the coordinates of where Australia is in the image you could then create a link to an Australian website.

Using an image map is an easy way to link different parts of an image without having to divide the image into separate files.  There is a very informative and easy to understand tutorial on You Tube that explains exactly how to create image maps.  I found this video very helpful and also informed me of a great free resource for creating image maps online.  The tutorial uses an online image map editor at maschek.

You can view the video tutorial here.



Adobe Dreamweaver makes it easy to create image maps and there is useful information on how to do this here.

Another way to create links within an image is to use image slicing in Photoshop.  This might be particularly helpful in creating a banner on a website.  Photoshop has a 'slice tool'  (as shown left) that allows you to divide an image into smaller sections and it does this by creating straight edged sections like a table.


Here is an example of using the slice tool to create smaller sections within an image.

Notice that when you select an area with the slice tool, Photoshop automatically creates more slices to complete the image.  The slice that you originally created is highlighted.  You can manually move and resize the slices.

Slicing is an ideal way to optimize your image.  You can make adjustments to the image such as making it a gif and/or changing the amount of colours used in the image and make your file sizes much smaller, therefore making loading time much faster.

Week 9 - Dreamweaver

Adobe Dreamweaver is a web design program.  You can build a complete web site from the beginning without having to know or write very much HTML.  This program makes it easy for beginners to start creating their very own websites.  You are able to enter information and the program automatically creates the code, but you are also able to enter the code manually if you like.


Adobe TV has a video that talks about what Dreamweaver is:




There are some good tutorials for using Dreamweaver at Internet 4 Classrooms.

I created my very first webpage using Dreamweaver and I am very happy with the results.  I played around with the features and was able to get the heading and menu items to look how I wanted by using a table.

Here is what my page looks like:

You can view the actual page here.

I found How To Use Dreamweaver particularly helpful and it also had a list of useful vocabulary which I have listed below:

Vocabulary:

• Anchors: (also called targets) For the purpose of hyper-linking two places on the same web page or to, the target of the hyperlink.
  Image map: an image on a webpage that has geometric areas defined that function as clickable links.
• Bandwidth: The amount of data you can send through a network connection. Bandwidth is usually measured in bits-per-second (bps).
• Bit: one binary digit - this digit is represented either as a 0 or 1. Bits are usually used to measure transfer speed.
• Byte: a byte is 8 bits. Bytes are usually used to measure storage space.
• Contrast - To show differences when compared.
• Coordinates: Any of a set of two or more numbers used to determine the position of a point, line, curve, or plane
• Folder: another word for a directory on a computer. Folders are used to organize and store files.
• GIF: A image file invented by the CompuServe Company that uses indexed color-space. GIF files work better for graphic and clip art images.
• Hierarchy: a relationship between people or things that is organized.
• Home page: The first page on a Web site that acts as the starting point for navigation. Usually the home page offers hyperlinks that you can click to go to other pages on the web site.
• Hyperlink: An address to another webpage either internally within a wesite (relative link), or a web address to a webpage outside on the WWW (hardlink).
• Hypertext [ HTML Hypertext Markup Language] A term coined by Ted Nelson to refer to a nonlinear system of information browsing and retrieval that contains associative links to other related documents.
• Hypertext is the basic organizing principle of the WWW. The coded format used to create WWW documents. HTML commands control how a piece of text will appear. Files in html format are viewed with a Web browser.
• Image map: an image on a webpage that has geometric areas defined that function as clickable links.
• JPEG: (Joint Photographic Experts Group) A file format using lossy compression. Commonly used for photographic images on the Internet.
• Pixels: The basic unit of the composition of an image on a television screen, computer monitor, or similar display.
• Resolution: the amount of pixels per inch on a screen or dots per inch in print.

(source:  http://www.ncsu.edu/viste/how_to_use_DW/vocabulary.html)