Presentation 2

Cheryl Ho’s video

Assignment 1 Sketch

Assignment 1 is to design a website to showcase our work from NM2208. The requirements of this assignment is pretty simple. They are use HTML and CSS.

Taking the requirements into consideration, the below are some sketches that I have done.

Stack

Flower

Presentation

Win Mobile 7

Cinema Walk In

Art Gallery

I decided to develop the last idea, "Art Gallery". After some iterations, it changes quite alittle.

Art Display

	Art Display
Typography	Title: 31pt Forelle Sub-title: 20pt Trebuchet MS bold Main: 14pt Trebuchet MS
Color Scheme	Shades of Black
Layout	2 column
Grouping and Hierarchy	Navigation and Display
Figure and Ground	Using sufficient spacing and shadow
Composition	Rule of Third
Flow of Attention	Using shading

Post Week 1 Presentation

After this week lesson, I want to talk more about WOFF that I seemed to have miss out from my previous post.

WOFF
WOFF is a very new font format developed by W3C Web Fonts Working Group to provide an alternative to the currently available font types. I believe they hope to use this font type as a web standard.

Disadvantages of WOFF

• WOFF is not a common font type, none is it widely used by any operating system.
• WOFF remains to have the same difficulty faced by other font type, which is the need for users to have a soft copy available on their sever for end-viewers' computer to use them.

Alternative Google font
I am really impressed by google. The last time I went to google font, during Nov 2010, they only have ~10 fonts type. Now, they have ~75 font types! Woah...



Now working on my assignment one. If any of you are facing design bottle neck, you can go to take a look. =)

Presentation 1

Recaping principles of visual communication
I would like to evaluate three websites, Lost and Taken, Quora and Forrst

	Lost & Taken	Quora	Forrst
Typography	San-Serif 2-3 type of fonts	San-Serif 2-3 type of fonts	San-Serif 2-3 type of fonts
Color Scheme	Vintage, Reminiscing	Cool, Semi-formal	Cool, Informal
Layout	2 column	2 column	2 column
Grouping and Hierarchy	Yes	Yes	Yes
Figure and Ground	Good Separation	Good Separation	Good Separation
Composition	Rule of Third	Rule of Third	-

All these three website uses CSS. It is quite difficult to find website that does not use CSS now a days. In time to come, HTML5 is going to phase out inline styling, further enforcing the web designers to use CSS.

In order to standardize design across the websites, HTML and CSS uses classes. Therefore, all content with the same class will utilize the same CSS bring about a uniform look across the website. This will also allow consistent in the hierarchy and allows viewers to understand the groupings easier.

Advantages of CSS

• Consistency
  By making one change to your website's CSS style sheet, you can automatically make it to every page of your website. Not only does CSS save time, it also ensures that your web pages have consistent styling throughout your site.
• Viewing Options
  CSS can help to make websites available for different media by allowing the same markup page to be presented in different viewing styles i.e. for print or for a mobile device.
• Superior styles to HTML
  CSS has a much wider array of attributes than HTML, therefore allowing more visual designs to play around with.
• Accessibility
  By separating style and content, it is easily for content-creator to focus on creating or modifying the content instead of having to juggle style and content at the same time. This also allow search engines to search for content more efficiently.

What is WOFF
The Web Open Font Format (WOFF) is a font format for use in web pages. Other font types are TrueType, OpenType, Open Font Format and SVG fonts. It is not expected to replace these format, but just provide and alternative and if possible a standardization for web pages.

Advantages of WOFF

• WOFF fonts are compressed, so they download faster.
• Include support for tags and other unencrypted metadata.

WOFF doesn't really have any disadvantages, not that its advantages are very attractive either.

I cannot find any website using WOFF but I am sure there are good websites that are using WOFF, just that I do not know how to search for them.

Assignment 1 Requirement

Assignment 1 is out!!

Web Media

Procedure:

• Apply Principles of Visual Communications (i.e., Design Principle) to create your online NM2208 portfolio.
• Create a theme for your own design (any theme you like).
• Define the typefaces used, the color, the grid and other design elements applied in CSS.
• Design the graphics (images) to suit your theme.
• Upload your design to our server (uniform).
• Find an available domain and register. (e.g., www.tanagao.com)
• Minimum pages=10 pages (organization is flexible e.g., blog for a1, rough a1, final a1, afterthought)
• Design for at least 2 media (e.g., print and screen; change the font, graphic, layout etc).
• Must be original!

NM3208 Creating Content for New Media

First step towards surviving NM3208 =)

Picture by Laetitia Chretien and Sebastien Zanini.