OT Gangsterism

great site

2009-04-29T19:44:00.000-07:00

great site
http://www.myflashxml.com/dynamic_photo_gallery/auto3c/index.html

dance
http://www.lacostered.com/www/en/#/the-movie

3d experience samsung phone
http://www.armanisamsungmobile.com/

examples of using flash game to sale/ promote a product
http://scm.symantec.com/nortoncampus/

Art Direction for Point & Click Game

2008-06-02T21:35:00.000-07:00

Isometric
http://www.obake.fr/p/site.htm (Website)
http://www.2ddepot.com/ (Games)
http://www.blocgames.com/ (Block Games)

Vector Sport Games
http://www.eyetoy.com/shootzonez/

Yatsha Games Collection (nice n cute gfx)
http://www.yatsha.com/index.php

Samorost kind of GamePlay
http://www.questfortherest.com/
http://www.doodoo.ru/flash/gwen.html
http://bluewyverntea.blogspot.com/2006/09/new-in-samorost-style-games.html

Personally like this kind of gfx
http://www.zelda.com/minishcap/launch/index.html

NDS Games that i wanna play?! O.O
http://www.advancewars.com/

Chracter Design
http://go.gameflier.com/
http://ttime-s5.myweb.hinet.net/tk3/tw/index.htm
http://ttime-s6.myweb.hinet.net/rich5/character.html
http://sf.runup.com.hk/sf2/index.php
http://www.108.com.my/
http://tw.maplestory.gamania.com/

Links for tutorial

2008-02-27T02:27:00.000-08:00

How to Add an Anchor Link with Dreamweaver
http://webdesign.about.com/od/dreamweaverhowtos/ig/Anchor-Links-with-Dreamweaver/

Random Images
http://www.java-scripts.net/javascripts/Random-Image-Script.phtml

Drop down Menu
http://www.jsmadeeasy.com/javascripts/Navigation/list_test.asp

Time Clock
http://www.java-scripts.net/javascripts/ISO-Date.phtml

LightBox
http://www.huddletogether.com/projects/lightbox/

-----------------

Extra // Online Magazine
NEWWEBPICK.com
http://www.newwebpick.com/

Week 8 - Sharing by Ng Joanne

2008-02-24T17:26:00.000-08:00

sIFR
http://www.mikeindustries.com/sifr3
Fancy font in real text.
Using js html and flash > merge together = sIFR

zip files// prepare own index.html
link ref="stylesheet" // link the Js files/ (total 3 of it)
script src x2

http://www.dynamicdrive.com
Scoller // Js library

swfir (swf image Replacement)
http://www.swfir.com
download the zip//

Interface > 1st stage

2008-02-17T04:54:00.001-08:00

Homepage

History and Operation

Services

Tracking

Tools - DIM Calculator

Basically the design is more to simplicity and express.

Study of Design Agency Website

2008-02-03T18:58:00.000-08:00

Kinetic Singapore
Award winning Singaporean agency that specialises in interactive design, graphic design and advertising.
Animation. Audio Visual. Graphic Design. Logo, Branding & Identity. Illustration. Multimedia. Print. Web Design. Packaging Design.

Web: http://www.kinetic.com.sg/
email: info@kinetic.com.sg

Sreenshot of the Website

Enter Page of Kinetic Singapore Website

Homepage of Kinetic Singapore Website

Transition through out the website

Contact Page

Other Page with contents

Website of design agency use to be creative instead of a very formal and boxy way. Transition has been use between a page to go another page and all of them are very intresting. The design type face and entire mood is more to graphic illustration with picture texture.

The intresting transition actually succesfully lead to me explore the entire website and read on the content then i m intrested. Instead of plain text, they use some relevant images to enchant the massage that they want to deliver.

My personal user experience is i can actually feel the creativity they have. And i think for the Gdex website that i going to redesign later i think i shud let my user to experience the proffesional express delivery service and trustable.

Site Navigation Plan for Gdex

2008-02-02T19:38:00.001-08:00

This is the site navigation plan that i prepare for my gdex official website that later i will work on.

Website Typography and Colour Study

2008-02-02T04:39:00.000-08:00

http://www.simplifyyourwork2008.com/
A very creavity website by Microsoft Office.
Drawing/ Illustration style has been applied . Simple yet nice.

http://www.melissarodwell.net/
A website with nice typography arrange. Black and white with some greydient.

http://www.pdk.pl/index_feng.html
3 colours +black and white which take from the CI of the company use as the colour scheme of the entire website.

http://www.boone-roosens.be/
Nice images layout with spacing and typography. Very unique ways to interactive with the site. (by using zoom)

http://www.joshchild.com/
Very nice colour combination. It really attract my attention.

http://www.rasteroids.com/
Intresting illustration pattern and colours! I like it very much.

http://www.vitiligo.com.br/
Very suitable colour sheme being used. suitable to it CI which is healthy. It has a tidy grid system.

Gdex Express - MoodBoard

2008-01-27T20:27:00.001-08:00

Moodboard for my Gdex website

Font is using back the font from the logo.

Blue, Red and White are the main 3 colours.
Where is also the colour scheme of CI.
Images that selected is base on Trusted and Express.

Research > 6 Korean Website from DBCUT

2008-01-26T06:10:00.000-08:00

Samsung Everland

http://www.samsungeverland.com/energy/index.html

A very great corperate website with nice concept and visual. ENERGIZING is the keyword for entire website and i believe they had archieve that. The music, the motion graphic has wisely been used and i think it did a very good job to helps visualizing the concept. What I had learn from this website is CONCEPT come 1st then support by visual and following with details.

Switchmw and Cravesound

http://www.switchmw.com/

http://www.cravesound.co.kr/

Simplicity make the web feel good and comfortable. Typography help a lot as it beautify the web with just plain text. Texture graphic and typography make the web intresting while it is just a little element or design graphic there.Simple yet it is a way to show their coperate identity. I realise how important the role of typography is in a web through these two website.

Bccard and Flyvo

http://www.bccard.com/

http://www.flyvo.co.kr/

This website is actually using the colum grid system(4 for bccard and 3 for flyvo) and i think this is the the reason why the website turns up messy although it had a lot of images/flash and content. Flash that will keep changing with different promotion actually save a lot of space then put all of them seperately. And i think it is great that using flash that keep changing with different slice to show different package of GDex service.

FanYA

http://fanyacorp.com/

Another way to design a coperate website that not so common. The navigation is on another side from the normal one while i never felt it is not user friendly. There is a blog for the company and i think of why they want to have it. After i go through the company blog, i felt i more friendly toward the company and i think it is the trend that company with a blog. I think of having a blog for GDex and build up the relationship and TRUSTED image on the customers.

Gdex Express

2008-01-20T19:12:00.000-08:00

My Client ::
Gdex Express
http://www.gdexpress.com/

Mission Statement / Site Objective
1.Bring out the image of trusted and professional express carrier service through the website.
(current website fail to build tursted and professional image, the CI colour, images not been used wisely.)
2.Provide certain useful tools/application
(Global Clock, Currency Converter..)
3.Provide quick access links for those important links.
(let user feel "EXPRESS" in a way)
4. Provide alternative way to user to check. tracking their shipments.
(An effective alternative way other then phone call.)
5.Replace certain information into interactive flash.
(to deliver the message more effectively)
6.The logo of Gdex will make into simplicity yet look professional.
(The drop shadow effect need to be removed.)
7.Provide tips for user in order to build a relationship between the company and the user.
(build trusted through relationship)

Competitor (Aim)
DHL (All the way)
Fedex (Express)
Citylink (Network)
-----------------
Gdex (Trusted)
-----------------
*DHL, Fedex, Citylink are International Express Carrier
*Gdex is Local Express Carrier

Build the image diffently from other company and avoid crash of the ideas. TRUSTED will be the main keyword of the entire website.

Goals
Increase the sales through building TRUST image.
Promote the use of web to manage customer order. (alternative way to mange their order/shipments)

Target Audience
Primary: Businessman
Secondery: Household
Third: Students
(Malaysian Only. Not International Express Carrier Service)

Fedex

2008-01-19T21:28:00.000-08:00

Fedex
http://www.fedex.com/my/

The corperate web for Fedex overall look clean and tidy. The purple links and text use to presant the CI of this website. It is very clean and tidy but in a way it is also a bit too boring. It just like face out to a paper that full of text and the eye is easily get tired.

The consistency for the used of images is not there. Some of the page is full of text and some of the page have a picture at the right side while some of them are at the middle.

I m think that if some of the important links replace with related images / icon will help a lot.

DHL

2008-01-19T21:18:00.000-08:00

DHL
http://www.dhl.com.my/publish/my/en.high.html

The web CI can easily been use through the colour scheme.
DHL corperate web look a bit messy as there are too many link and picture at one time.
It is out of focus. I think it will be better if change the links which is more important to be bigger then the one which is less important. Duotone images or graphic mayb can be use/ replace some pic as decorative. (Red and Yellow)

It looks messy but it actually provided many tools and application where it is very helpful for user who want to delivery their stuff.

I found out the title for every page is not obvious. It is a simple text with white colour and the font size is same with some other text. This actually make the title not obvious. Most of the text / contents having the same font size where it also same to the images that been use.

Citylink

2008-01-19T20:54:00.000-08:00

Citylink
http://www.citylinkexpress.com/MY/en-US/Default.aspx

main colour scheme : green (give me the feel of petronas XD)
overall the web look profressional if compare to GDex.
the grid system of the web is boxy but they make it slanted in a way. this actually help the web come out form the box.
There is a quick menu which i think it is quite userfriendly.
(this quick menu tell me in a way that this is EXPRESS)

I found out an error there where the disclaimer there
there are 2 side of links and both of them didt align up properly.
Term of use is slightly higher then contact us.

Re-design Corperate Website

2008-01-15T05:49:00.000-08:00

My Client - Gdex Express
http://www.gdexpress.com/
(how come the links of .com.my is not workable.. =v=" so unprofessional)

List of competitor for Gdex

Avanti WorldWide Express
http://www.avanti.com.my/

City-Link Global Network
http://www.citylinkexpress.com/

DHL
http://www.dhl.com.my/

Fedex
http://www.fedex.com/my

Nestle - Corporate Web Research

2008-01-11T05:27:00.000-08:00

Nestle
URL: http://www.nestle.com/

Screenshot - Mainpage of Nestle Official Corperate Website

Screenshot - Other pages of Nestle Official Corperate Website

Nestle is a company that involve in childcare, cooking, petcare and wellness. Compare with the previous corperate website that i did, Nestle have more contents in ther website. I was wondering and i start to find out why. In the end I realise that as Nestle is involve in food industry and they need to provide the ingredient and other information while they have many products with different sub-brand such as (Kitkat , Milo, Maggie...) Other then food there is also products of petcare, wellness and so on. Thats why there are so many contents and links.

Screenshot - Grid system of Nestle Official Corperate Website

3 colum grid system has been use by Nestle official website. First colum with navigation , the second one with contents and the thrid one is the links that mentioned at the contents.
As a example, the contents is meantioned about About the company itself while in 3rd colum there will be show the links to download the report of Nestle and other infomation abt the company. Banner/images is located at the mid of the website so that the web wont looks boring which is all text base.

Screenshot - Search engine which located at top of the website

As the website have a lot of content, at the top of the website there is a search enigine provided. This is kinda helpful as there are so many contents but user can easily get the information that they want by using the search engine.

Screenshot - Links which located at botom of the website

As usual, bottom of the website have a list of links that not usually click/view by user but it is there as it will help other user they like to check out more and it is more to the website itself rather then the company information.

As conclusion, Nestle corperate website is more to text-base while enchat the content by using some images which is a way that commanly use by the designer. Flash not been using and i think this is quite a waste because flash would help a lot to deliver the msg even better then images if it is welly use .

Canon - Corporate Web Research

2008-01-10T23:05:00.000-08:00

Canon
URL: http://www.canon.com/

Screenshot - Mainpage of Canon Global official website.

Screenshot - Sub-page/content page of Canon Global official website.

Canon is a world leader in imaging products and solutions for the digital home and office. They have a lot of different type and series of products but they did well when categories the contents and also information. They seperate it into main navigation and sub-navigation and the grid system for the content pages are different from main so that there are more space to fit in the product info/ contents. It look tidy and well organize. This is able to make me feel their professional in the industry and feel the confident with their products.
(i realise that a lot of nice image and they are in high quality which looks sharp as the company are dealing with imaging products.)

Screenshot - Grid system of Canon Global official website. (Mainpage)

Screenshot - Grid system of Canon Global official website. (Content page)

Flash has been use in the mainpage and the flash is interactive while it is linkable to anohter page. The grid system of mainoage are different from the other. Mainpage has lesser spacing as there are many links and also images. Other then navigation, image links has been use for certain highlight for their products and also event. Normal links has been use as update news/press and official notice.

The grid system for the page which have more contents is much for simple then the mainpage. A lot of space has been given to contents which is think is good where it wont feel like very pack or uncomfortable when i was reading the contents.

Tidy, clean and simple yet profersional design is always the choice for corperate website and it same goes to Canon.

Sony - Corporate Web Research

2008-01-07T21:53:00.000-08:00

SONY
URL: http://www.sony.com/index.php

>> screenshot for sony official website in flash

>> screenshot for sony official website in HTML

Sony is a internation company which involve in many industry such as electronics, games, music, movies. So it is quite a challaging when come to design a main official coperate website. There will be a lot of contents and products information. Let's see how Sony actually solve this design problem by looking at their grid system.

>>grid system for Sony official website

4 colum grid system has been use for links and each colum represent different caterories which is SEE, HEAR, PLAY and SHOP. This is quite different from last time what we seen. (Music, Games, Products etc)

RSS has been implimented for user to check out their latest update/news.
Drop down menu is kind of good solution for Sony as they have a lot of products as it wont comsume a lot of space for the website.

The overall design of the website is clean and tidy so it is quite user friendly. Flash has been use rather then using normal images. The flash is interactive where user can actually select the items there and click for futhere information.

The identity of the Sony which they call it as has sucessfully bring out through the website. Simplicity yet nice. at the same time it bring the feel of classy to me.

Web interface research

2007-11-23T06:58:00.000-08:00

Arrg.. just finish flash actioscript then now html coding.. wuwuwu...

toa damn good.. provided right brain and left brain training = ="

end up like drop alot of hairs... T_T

well... when i open back my ai files.. ahha.. monday is the presantation..>"<

everything like very rush.. and everyday edi full with assignment..

sat n sun is lasts 2 days to working on.. =.= then sunday still need to do for typography... hell...

web become intresting when we can apply swf~ hor! a new challage.. and i wonder how far i can go.~ i wanted to make my web more playful since it was a toys website for teenager so i start to research on how actually ppl work on flash button.

i research on game website so that the button is more funky n more related to my halloween theme.

http://entertainment.upperdeck.com/shaman/en/interface.aspxa
card game website. it having a section which is interactive demo n tutorial who to play the cards. intresting layout as well o.o. but less content ler..the buttion is like rollover will come out a shuriken. 1.ROLLOVER EFFECT <>

http://ms.nintendo-europe.com/ffcc/enGB/

http://www.nintendo-europe.com/microsite/zeldaminishcap/

both are tutorial website as well. it give the tutorial on the gameplay. very details.

a GBA game. FF! and also Zelda. famous game. the interface is base on GBA graphic but it still look intresting while the graphic not so nice. very well in arrange for the content. make user can easily understand the massage of tr tutorial. Learn learn~~

Halloween Toys

2007-11-10T06:30:00.000-08:00

How to change your daily item into halloween toys will be my theme in this project.
hahah i found a nice halloween meal XD
seem like very nice :P

anyway i m not working on cooking stuff = =

http://www.benjerry.com/halloween/

another cute halloween website ~

i study the element that they use and try to apply in my web design.. >"<

How to make a..

2007-11-05T03:11:00.000-08:00

Hoho.. the assignment never end .. >"<

http://dollmaker.nunodoll.com/
this is the 1st website that i reseach on. It teach how to make a doll step by step. but what bad abt this website was it is without design. It just text and images.

http://dimdima.com/khazana/activities/show_activity.asp?q_title=Toy+Helicopter
This is another site which teaching people how to make toys. and it more to like paper toys. Well, the instruction is just given buy text and few images.. hmm.. can as the ref for how to plan the content but not the overall design.

http://www.pumpkinpatchesandmore.org/index.htm this is the site is main on haloween. it teach how to carve an elaborate pumpkin designit and it also teach how to cook pumpkin ( many recipe). Teaching step by step n with a lot of images. very details n clear instruction.

http://www.enchantedlearning.com/crafts/halloween/
all about halloween items can how to do it.

Sharing: Free Web Hosting

2007-10-27T10:17:00.000-07:00

In order to make your web online, you need to upload your website to any server which available. You can choose either using the free hosting or paid.

Here is a link which have a list of free hosting. You can try out .
Different provider have different limitation.
Ermm, if you ask me how to make decisison, my 1st prorioty was no Ads on web.
For this moment,i think basic bandwith and disc space is enough for us .
http://www.free-webhosts.com/webhosting-01.php

Here is an example,http://www.zendurl.com/
My link: http://www.zendurl.com/ywei/contact.html

But it having google adsence and also a link.. its quie annoying so.. try not to choose this kind of server provider =v=" (why i choose ler? kena tipu lar... its write ads free.. but after upload.. ishh)

After you get the free web hosting, you need to upload you files to the server.
Some of the provider provided FTP / Upload through broswer.
If u been given FTP, then u need to use software to load it.

here is the software that u recommended
http://filezilla-project.org/
This software is quite friendly.

screenshot when i uploading my files.

for those who intrested to buy a personal web hosting,
i suggest this one http://www.exabytes.com.my/

Please feel free to check out or ask any question.
Mayb what i shared got mistake,

so please let me know if there is any.

(and don cruse me =v= for sharing wrong info)

:) have a nice day~

Visual for Web A1> Edited

2007-10-22T08:56:00.000-07:00

Please feel free to give any comments.
Your suggestion can help me improve on my design.
Thanks!

Visual for Web A1

2007-10-07T08:41:00.000-07:00

Sharing

2007-10-01T07:04:00.000-07:00

http://webseon.nacan.net/alone2007/

this is a very nice search that i found during doing the research.

very good art directcion as well as concept.

but very heavy in file size as it load kinda long...

BUT its worth! +nice bg music.

so please feel free to visit if u r free~ :)

http://cmc.msc.com.my/event_detail.php?ID=195
http://mayang.com/textures/Manmade/html/Paper/index.html

References

2007-10-01T05:38:00.000-07:00

https://www.spris.com/starshot/model.asp
https://www.spris.com/starshot/flydaddy/flydaddy9.asp
a site that introduce their model which is quite related to my concept that showing my relationship.

http://www.dauxlab.com/

the character design and also the stats analysis pai chart.

URLs used during sharing session

2007-10-01T05:34:00.000-07:00

www.bmxmasters.com
www.brainfood.com
www.durexdickorations.com
www.harajukulovers.com
www.kutztown.com
www.jrvelasco.com
www.natashabedingfield.com
www.runlondon.com
www.nathanlove.com
www.t3rzer.com/principal_eng.html
www.bupla.comwww.gmillustration.com
www.jasondoherty.com
www.erinhurleyonline.com
www.juxtinteractive.com/up2d8/up2d8.html

Research: Website 6

2007-09-15T01:25:00.000-07:00

6.Communicator World
http://www.communicatorworld.com/home.aspx

This is a flash website and done by a designer studio. This consider an extra one but i found it was so intresting so i share it here also. It is different with the website that i research just now. This website is using the meta mine method as user need to explore then only know there is a button to click or get futhure information. I really donno how to draft out the grid system of this website ><".. I found out this kind of website is instresting also. It just like a game and feel free to explore. But the way i think this kind of website cannot serve for certain purpose as the information was not instance . We need time to found out 1 by 1.

More screenshot

Research: Website 5

2007-09-15T00:44:00.000-07:00

5. Lycos Website
http://www.lycos.com/

Well, this is the screenshot for Lycos website.
As i said just now (research 4) , i feel like want to compare between yahoo! and lycos. Both of them use very simple grid system.

LYCOS YAHOO!

Both are almost the same just the place they put navigations are differents. And i found out that both of the site use List of Link a lot. I thinks this is the best solution for a lot of contents like news. Compare to Yahoo! i prefer Yahoo! more then Lycos. From the interface, the size of the image that Lycos use almost the same size and i feel like no focus point. ( like which one is more import / hot news) The icon of wheather as large as the artist award picture. While Yahoo! have various size. But both of the really arrange nicely and tidy.

Research: Website 4

2007-09-15T00:21:00.000-07:00

4. Yahoo, Website

http://www.yahoo.com/

This is the screenshot for the website.

Yahoo! is a popular website and its always full with a lot of contents such as latest news, horoscope, games, emails,... etc. What i am so suprise is after i analysis the website, actually they just use a very simple grid system.

What i can feel is like the front page of yahoo! just like our newspaper. It full words and as my Typography lecture said, most content you have, more harder is. So newspaper always with nice typographic. O.o .. actually i wonder why. Ha, but untill now hvt found out yet. Same with yahoo!. I really not dare to comment more about it as if u ask me how to make it nicer or make it more tidy... i will said like ermmm... ^^" I think maybe i shoud compare more like yahoo! with Google-ig, Lycos..etc and learn more then only i can manage this kind of "quantity" contents.

Research: Website 3

2007-09-14T23:35:00.000-07:00

3. Orange.com Website
http://www.orange.com/english/home.php

This is the screenshot for the website.
This is a website for a Communication and Entertainment company. As usual, after i do analysis i draft out the grid system for the website.

This website was well plan for their sub navigations.
Refer to the screenshot below. They use another way to present the buttons.

This website use spacing smartly as their layout reserve a big space for contents and also background. So that user would not feel not comfortable and very pack of words. As the graphic is in swf format it will slightly animate and make the website looks lively. The website was well plan for the typography use stick to the major colour orange which related to their company. They try to tone down the orange for the graphic in order to make those contents look more contrast. Imagine if the orange is too sharp, the images will become the focos point but not the info. From here i aware of use of the colour and image is very important as we need to know which is the main thing should be focos and which is the things that just use to enchant the main things.

As there are communication and entertaiment company, i think their website should have a very soft / nice background music, cause they play with a lot of spacing. Although the spacing make overall looks nice but i still feel like miss something there and i think if there is a soft bg music it will be nicer.

Research: Website 2

2007-09-14T23:09:00.000-07:00

2. Web Sango Website
http://www.web3go.com.tw/index.asp 3go.com.tw/index.asp

This is the thumbnail of the website. Its is a website for webgame so the contents of the website is full of game data, information, picture as well as tutorial. So it was a challage to arrange so many different kind of info together in a page.
Same as above, after analysis i was draft out a grid system for this website.

Same a the 1st website, i found that for a look nice website they always prepare a big space for their contents and i feel like contents part always become a part that i will not aware of. As usual, the navigation is on the top as well as left side of the web and i think this is the way they make it user friendly. There are consistency for every single page i like they use those game elements become their navigations/buttons. It was so intresting. This website didt have the weakness for the 1st page. The image for the title will changed after few sec and they will be a highlight will keep shinning on the logo. So it wont looks like all is dead.

For this website, what i feel like not very good is it navigation. At the same row of navigation,2 of it will open pop out window. I personally feel it was not consistent enough because when i surf on 1st and 2nd its wont pop out but when click on 3rd it will pop out. I am able to edit on it, i will seperate the pop out links to another part which wont put together with those link that would not pop out.

Research: Website 1

2007-09-14T20:27:00.000-07:00

There are some website that I feel there are good enough to be my references.
And now I am going to share with you guys.

1. Microsoft Corporation Website
http://www.microsoft.com/en/us/default.aspx

This thumnails is the screenshot of the website.
Overall its looks tidy, comfortable as well as trendy.
After i do analysis the website, i draft out then gridline for the web.

The layout of this website is nice as well as it have the consistency for every pages. They leave quite a big space for contents so it wont looks untidy although when there are plenty of words. I really appreciate the way that they doing the layout. It was a comfortable in a view while it was user friendly. There was a hierachy there so I wont feel I was lost when i surfing this site. The navigations was clear enough and the font they use is san-serif type font, Arial. There is also a consistency in the colour mode which is all in blue tone and it blend everthing well together .

I know they must be their own reason for doing the website to be like this. Maybe they try to make the site lighter file size as the user was using slow connection still be able to view their site.
Errmm, I try to think at their side and also mine.. If i am going to edit smtg to the site, i will add some little animation there. Examples, the image design there were many lines, i will make them like slighty move, change the curves... So overall for the web interface wont feel like everything is dead, no motion at all.