Week 3 Photoshop

Week 3 Photoshop

In this week’s class we learnt several animation technics in Photoshop. Although I knew Photoshop before, I only use it as a graphic design program. I did not notice that the Photoshop has the animation function. It is very handy and we can use it for making simple gif files. The basic way is create numbers of layers and use a layer as a frame to create animation or we can use the Tween function to automatically generate the frames.

The second part of skills were more related to web which are saving images with a proper size and slicing a large images to several pieces. As I mentioned in last post most web sites are based on images or using large images as their background. The images’ size is the factor I did not beware very much before. A simple example is if we use a high quality image in a Blog post, obviously it will slow down the speed of loading the Blog. Slicing an image in Photoshop is also a very good technic for web design. The sliced image can be saved to HTML and then loaded into Dreamweaver and then the further works like adding linking to each piece of the image can be easily done.

Week3

Week 3

The website that I introduced in this week is called Scaramouch. Basically it is showing a short drama on a flash based web page. I found this website when I was surfing on internet. I accidentally went to this site and the art works or the drawing with nice appeal attracted me.

I think the art works on this site is firstly hand drawn and then using graphic software like Photoshop to present onto internet. On main page of the drama it used a clock to navigate the whole page. It has several chapters on the single page, but the window for showing the drama is still fit on small screen computers. Viewer can move the page from left to right and top to bottom; this is an important feature, because nowadays computers have wide screen is increasing, and the website that can move from left to right is fitted to those wide screens.



Link: scaramouch.org

CSS

CSS

In this week class the main topic we learnt is CSS (Cascading Style Sheets). Before I take this class I do not really understand the concept of CSS or the code behind it.

In Dreamweaver when we design a web page we can add a CSS sheet to give more styles to the components of the web pages. For example: the text in the web page can be modified to a certain size font or colour. Not only changing the styles of a web page, the advantage of the CSS is we can save the CSS sheet and use for other web page for same styles.

For the web design we also learnt two other good features in Dreamweaver which are the Links and Tables. The Link is very basic and also significant component of a website it links up each web pages. I think using table in web page is also a very important skill. Table helps designer to organise the content of a web page.

Week 2 website

In this week I had a discussion about information visualization. I found the diagram on “Honda.com.au” is an every effective way of presenting information and it is also a well designed webpage.

http://www.honda.com.au/wps/wcm/connect/internet/honda.com.au/home/buying+tools/help+me+choose/help+me+choose+homepage

The webpage is flash based and has all the car products from Honda. When customers come to this website, the diagram helps them to choose a particular product according to their requirements. On the left hand side there are options which can be selected by customers and the pictures on the right will present certain products.

Week 1 in Web Art and Design

In this week we browsed a lot well designed website.

Webmonkey.com

Html Cheatsheet

Webmonkey is a very good reference website for html and also other web design skills.