Thursday, June 16, 2011

Trip to National Museum

Photo credits: Stefie

This is my first time to National Museum which is located at Kuala Lumpur. There are a lots of interesting history facts that we actually learned back in school being displayed inside of the museum. I always find tiny things interesting somehow. These Tin Animal Currency which is used to measure general goods and as standard weights for weighing standard. The tin money earliest form was produced from solid blocks of tin metal of a standard size and weight. Some believed it's function was to dispel evil spirits. Some believed to used as weighing goods It is an early money to be first used by the royal courts of Malay Peninsula in the 15th century. These tin animal evolves in time into a form of different animals and insects such as cockerel, crocodiles, elephants, grasshoppers and tortoises were made.

Photo credits: Stefie

At first glance, it already make me to look at it long enough. I started to question myself, "What is the meaning of each of these tin animal currency made in the 15th century?" How they started these tin animal currency things back then? I searched the web and these are the results,

1. The particular shapes is believed to have started out as a simple
    shell-backed ingot but, influenced by the Chinese miners.
2. The tortoise means long life and happiness.
3. According to the chinese, Cockerel (Rooster) one of the 12
    animals of their lunar calendar, it indicates vitality and energy,
    how it crowing provides morning call for the days work; hardships
    of working in the tin mine.
4. The most common shape was the crocodile, tortoises,
    elephants, fish, crickets, beetles and others.
5. Tin ingot (Chinese silver sycees) can be found from another
    state like Malacca, Kedah, Perlis, Pahang, Terengganu,
    Kelantan, Johor.
           


For further reading, there is this book called "Tin "Hat" and Animal Money" by William Shaw and Mohd Kassim Haji Ali which is published in 1970 which have more information on these tin
animal currency.

Monday, June 13, 2011

Goodday's Website Design (Pre-final)


[click for enlargement]



[click for enlargement]




[click for enlargement]


[click for enlargement]


Sunday, June 12, 2011

Tuesday, May 24, 2011

Saturday, May 21, 2011

Goodday's Strategic Brief

Project Definition
The definition of this project is to redesign a commercial site, goodday into an interactive and functional website while maintaining the identity. The purpose of redesigning this website is to improve the website look more attractive to look at and to make the audience to stay longer instead of pressing the close button.

Current Site’s Analysis Goals
Goodday’s website should be more neat and tidy in a way so that users know where to click and start with since it serves a lot of products under the product range. Now, it is too much of link of products available in every page under product range which causes confusion which to click, what to click, link to a new link, where is the button located .Everything isn't organized properly. 

Client’s Analysis
Since it is about to let audience to know how about the products, I would suggest changing it into a simple background using a milk design for the logo to stand out more than it is now. Their unique selling point is perhaps is a company that specialized in manufacturing and to deliver good milk that covers from Goodday, Mr.Farmer, and Daily Fresh which has various products under be it a goodday or Mr.Farmer or even Daily Fresh.

Short & Long-term Site Goals
Since the long term of this site is to gain trust from the customers. Wanted them to know how they started and milk information. It is good that the website is full product’s information by the way they place their products in a page. The short term of this website is to let customers to know how delicious is goodday.

Target Audience
Their main target audiences are mainly Family with childrens and teenagers and young adults. Delivering great milk tastes with different tastes like Strawberry, Chocolate, Vanilla, and juices and even more to their customers to gain their loyalty towards their products.

Competitor’s Analysis
Very attractive and have strong identity especially Vitagen’s websites. Color mood suit their theme very much since it’s about Vitagen. Has drop down menu and flash elements like animation to cure the boringness of the website. Good navigation which is understandable, simple button and yet clear on how to use for the first time. Soft color used instead of too vibrant colors. Grid system is very neat. Since nestle’s shares is currently the top now, I can understands that their websites is-need-to-be corporate type of design. Although it doesn’t have lots of flash and design elements in it, it still look good because nestle produces a lot of products like milo and so on. So they way they arrange their information is quite good.

Idea & Concept Implementation
In my opinion, I would suggest changing the layout of the wire frame and change it to a little bit of cool colour with not-so-strong blue color. Having social buttons to be beside but, on the side layer of the design might be better to promote the goodday’s products. Identity of Goodday will be remained which is the blue so that it is still recognizable as Goodday’s  at first glance of the colors used. The importance of white space is also important to a design so that readers could breathe through it and make the design to stands out than the rest. White and Blue is a good combination for this website. As for type color, transparency with background texture or a little bit of grayish will be good as black will be to strong for the eyes to read at. This website should be easy to understand and narrowed down so that users can easily navigate from a topic to another topic like Goodday products under Goodday instead of every products with different brand is under a page.

Goodday's Moodboard Proposal

[ click for enlargement ]

Goodday's Site Map Proposal vers.2

[ click for enlargement ]

Saturday, May 14, 2011

Goodday's Site Map Proposal

[ click for enlargement ]

Design Tutorials

Site: abduzeedo


Site: abduzeedo


Some other useful tutorial sites:

HTML Libraries

Javascript Libraries
Site: Web Source
Site: Java Script Free Code
Site: Java Script Kit
Site: Smashing Magazine/Javascript 
Site: Hong Kiat 


Tutorials of Javascripts
pop up window: Web Source
back to previous page: Web Source
slideshow gallery: Java Script Kit
live validation: LiveValidation

Goodday's Competitors


Site: Vitagen
Analysis: Very interesting curve line instead of a straight line for the header. Very strong identity colour and organized in a way that it is so neat and very lively. Illustrated diagrams can attract younger children to understand it in a better way.


Site: Marigold
Analysis: Have 2 options before entering the website. I think this is a good way to track where do they come from by placing this option. Marigold uses "FREE" to attract audience to look at it instead of navigate away from the current page.


Site: Dutch Lady
Analysis: Out of all competitors, i think Dutch Lady designs their websites with a big-kind-of-designing. It is interesting in a way that it can actually attract children in a more friendly way since it is designed big enough for  children to read it.


Site: Nestle
Analysis: Corporate designing of Nestle. Grid and Type system is well organized. History content is added with a picture rather than all texts. Since Nestle have a lot of products, it is well categorized.

Goodday's Gantt Chart

[ click for enlargement ]

Goodday's Original Site Map

[ click for enlargement ]

Analysis of Beautiful Websites



Site: WorryFreeLabs
Analysis: The way they centralised their informations make it different from the other website which can be found left alligned. Big font size is used and interesting javascript used in this website especially the "next" button. Interesting way of feedback form instead of the normal ones.


Site: KeyFruit
Analysis: Apllication rollover and gif application actually change the whole website from dull to interesting. Consistency in this website is very nice to look at.


Site: Stack
Analysis: Stack, is really sketch and grayish and yet it is still very nice to look at. Very comfortable color to look at and the illustration is very nice that it brings out the website to look at.


Site: Silver Pistol
Analysis: Very interactive and fun way of displaying their description. Background colors can be change as the user click on which color they prefer the background to be. Very neat and have nice typeface that brings out their digital stuffs. The use if flash also functioning as in making audience to explore it further.

Site: Pointless Corp
Analysis: The application of illustration and colors mixed well in this websites with the illustration.

Wednesday, January 19, 2011

Structure Site

  "home page" // "gallery page"
"menu page"

Strategic Brief

Project Definition
The definition of this project is to redesign a commercial site, Soul-ed Out into a interactive and functional website while maintaining the identity. The purpose of redesigning this website is to improve the website look more attractive to look at.

Current Site’s Analysis Goals
Soul-ed Out’s website should be more neat and tidy in a way so that users know where to click and start with since it serves mediocre food. Now, it is too much of repetitive elements in every page at the bottom which causes confusion which to click, what to click, link to a new link, where is the button located .Everything isn't organized properly. 

Client’s Analysis
The banner shouldn’t be in such funky direction. Since it is about delicious food and drinks, I would suggest changing it into a simple background for the logo to stand out more than it is now. Now, it looks more like a music website with music visualization. Their unique selling point is perhaps is communication as it can be seen everywhere throughout the website. The way they type and greet people who surfs their website.

Short & Long-term Site Goals
Since the long term of this site is to bring peace, freedom and celebrate good times. It is good that the website is full of friendliness by the way they greet users/customers.The short term of this website should be easy to understand and narrowed down so that users can easily navigate from a topic to another topic without clicking too many pages of under a big title. Like the reservation shouldn't be hide, which on the other side should be clear to see at the contact us. Too many sub menu of a menu will not do. Not only that, menu has to be the first priority since it's about food. 

Target Audience
Their main target audiences are mainly rich people and teenagers. They even prove their place is full of soul by placing the testimonials page from their customers. This website is full of friendliness in my point of view. In order to be respected, communication and manners is important.

Competitor’s Analysis
Very attractive and tidy with the grid system. Color mood suit their theme very much since it’s about food. Has drop down menu and flash elements like animation to cure the boringness of the website.Good navigation which is understandable, simple button and yet clear.

Idea & Concept Implementation
In my opinion, I would suggest removing the repetitive banner at the bottom. Having social buttons to be beside but, on top layer of the design might be better for viewing. Some of the unnecessarily content should be remove since it’s about food, lounge and bar. Identity of Soul-ed Out will be remained which is the yellow green and white so that it is still recognizable as Soul-ed Out at first glance of the colors used. The importance of white space is also important to a design so that readers could breathe through it.

Monday, January 17, 2011

Moodboard

Version I [click for enlargement]


Version II [click for enlargement]

Version III [click for enlargement]

Sunday, January 9, 2011

Competitors' websites for Souled Out

site: http://www.thewineryrestaurant.net
analysis: very nice layout and animation of the website. very neat and clear. It also provide interactive with the user which make the website very elegant with the wine. Lots of interaction with user which make user to browse more for the content and expectation from the user itself. Animation of the site is very nice and very good to look at it. Music wise is very comfortable.
site: http://www.geographer.com.my
analysis: the color suits the theme of the restaurant. It is also very neat in a way for the form. The feel of the website brings out the building feel since it's very historical. Provides a lot of information about itself. A good way for people who like to know about the place before visiting it.
analysis: uses of the chili's color itself. Very nice and comfortable to look at. The rollover is very nice too. Background texture is very interesting to make the background doesn't look that plain. They even have drop down menu for their user under e-mail club tab.
site: http://www.fridays.com.my
analysis: very nice theme. very neat and clear to user. Although it is very nice. It doesn't display some of the menu using Chrome browser whilist it display nicely and everything is shown using internet explorer. Very attractive color to attract the user to browse. It also provides drop down menu for heavy contents. I find the music is a little bit frightening to me.

Site Map of Client's Website(Souled Out)


[ click for enlargement ]

Websites with analysis










site: http://www.20thingsilearned.com/

analysis: an interesting way of delivering the content. very nice illustration. It also provide instruction on the bottom left panel to let us know how to use it. it is also very neat and hierarchy. it can be fast forward on the bottom with different section provided.














site: http://www.fucking-windows.com/


analysis: interesting websites with a resizing-the-browser technique. there are few others there. please visit. It is very interesting!
















site: http://www.imaginaryforces.com/


analysis: lots of information being neat using the dropdown technique.










site: http://www.ostragoth.co.uk/

analysis: another scrolling browser like the nike's websites. it's interesting just by scrolling without clicking on the links

Design Tutorials














+ create funny stuffs and nice using this trick
+ click here to go to the site















+ creating a vintage theme of traveler diary in photoshop
+ click here to get to the site











+ this is a site where we can learn about how to create retro folded typography with photoshop
+ click here to get to the site














+ this is a site on a tutorial how to transform photo into
watercolor painting
+click here to get to the site