Saturday, January 9, 2010

Web Design 2 - Redesign Website

Now is Semester 6, lots of newbie subjects this sem, photography, digital vid, marketing and our old friend Web Design TWO! First day, project brief sudah datang.
This time our project require us to redesign a website... me, MC and Ruzafir are taking the same topic... which is www.theloaf.net... BREAD BREAD BREAD...
Here is my Gantt Chart for this project

and my flow chart :DDDD


mmmm, i think we gonna lapar when doing this web, especially when we are in the stage of OT! OAO... So here are the screenshots of the websites :DDD

Problems that i found in this website:
- almost 90% of this website are pictures, including Body Text.
- too much flash.
- the side button of this website should have a rollover effect.
- the colour mood could be better
- the news and event page seems to be very very long and full of data plus not interesting
- the background image of this website could be better, rather than just repeated bread background.

Competitors Websites
Salem Baking
- very good table arrangement
- colour mood is nice and very classy
- not all of this page are using flash
- it gives the bread and baking feeling
- information arrangement are neat and readable
- overall website is very attractive



Grand Central Baking
- very soft colourmood
- it gives a soft feeling in this overall website, plus it is kinda cute
- very good table arrangement
- there are alot of information and text in this website but i find the way they arrange it is very neat and readable plus comfortable for the users.
- picture quality are also clear and attractive
- the typefaces of this website are also suitable and readable



French Meadow

- very clean and neat information arrangement
- colourmood are very soft and it gives the soft bread feeling
- simple flash decoration does make the whole website more interesting
- very neat table arrangement
- the picture quality does attract the customer


Atlanta Bread

- I love the loading page, it makes the whole bread website look more different plus the intro mainpage too.
- Colourmood also suits the whole website, different subpage, different colour. This can help the user to know which part of the website are they in
- Information arrangement are also neat and readable
- Simple rhythm makes the website more interesting and fun



Commercial Websites

Burger King
- love the flash mainpage, can play around with it. This website also suits primary school kids.
- love the flow of this website, very interesting
- i like the concept of the website, is like a digital folder
- not everything in this website are flash, the text are just text instead of flash or pictures



Hello Sour Sally

- very girlish colourmood and cute
- very nice intereactive website, is like a game
- very cute character
- graphics are nice and the information are well arrange
- buttons design are also very cute


Jack Link's Beef Jerky
- very interesting western colourmood and style
- cute loading bar
- information are also well arrange
- products are also well promoted, very interesting interactive in the product page.
- overall website gives a very western, cowboy and beef feeling




Nespresso
- the loading page is simple and yet interesting
- I love the colourmood alot, is golden, red, orange, yellow and black. Sunset mood. Well, actually
- Simple intro animation makes the whole website more interesting
- I like the background music of this website, it suits the product. Plus the rollover sound effect at the bottom of the mainpage. Different page, different background music. This can tell the user that they are in a different page.
- very good interactive.



HTML/CSS/Javascript Tutorial
- http://www.quackit.com/html/tutorial/
- http://www.html.net/tutorials/HTML/
- http://htmldog.com/guides/cssbeginner/
- http://www.echoecho.com/javascript.htm
- http://www.tizag.com/javascriptT/

Design Tutorial
- http://www.tutorialguide.net/deluxi_tutorial.html
- http://www.photoshoplady.com/
- http://www.photoshopstar.com/
- http://www.photoshopcafe.com/tutorials.htm
- http://www.smashingmagazine.com/2009/02/22/space-explosion-photoshop-tutorial/

Sunday, November 29, 2009

Web Design1 User Testing




User testing questions

1. What do you think about the colourmood?
2. What do you think about the design?
3. Which part that you click can go back to the mainpage when you are in the "About" or "How To" or "Product" or "Contact" page?
4. Do you think the buttons on the mainpage are obvious?
5. Overall what do you think?
6. Any Comments or suggestions?


PLEASE COMMENT IN THE CHATBOX!!! TQ :D

Sunday, September 20, 2009

Friday, September 18, 2009

Mood Board for "How To Slim Down Your Hamster?"


flow chart will be coming soon.. :3... stay tune

Thursday, September 10, 2009

Web Design Assignment 1

Web Design Assignment and Project sudah sampai... OAO!
Jangan panic panic...

Project title: How to....?


Ideas so far...
How to slim down my hamster? HAHA!
theme: cute and cartoonish/ doodle style
1.Who am i? - Pet Expert
2.What is it?- Hamster
3.What for?- For people that have obese hamsters
4.1st task- Foods for slimming
5.2nd task- Different types of exercise
6.3rd task- Our hamster slimming product
7.Outcome- A slim an fit hamster
8. Showcase- Gallery

How to gain weight?(for those who are born with high metabolism/born skinny) lol~ im a member...XD
Theme: Delicious food style (either in reality or line art)
1.Who am i? - Doctor/Pharmacy
2.What is it? - Fats
3.What for? - to help people gain weight
4.1st task- Food that is needed to gain weight
5.2nd task- To do list to gain weight
6.3rd task- Not to do list
7.Outcome - a fit and normal weight person
8. Showcase- Gallery

How to create your own art style?... err... cacat ka?
Theme: texture doodle/ texture art + some montage
1.Who am i? - Art Director
2.What is it? - Art Style
3.What for? - to help art students or those who are interested in art and designs
4.1st task- research and references/materials/resources
5.2nd task- Find your interest in different type of art style together styles
6.3rd task- Combine different types of art styles together
7.Outcome- Own artstyle
8. Showcase- Gallery


How to create a nice doodle artwork?
Theme: doodle
1.Who am i? - Designer
2.What is it? - Doodle
3.What for? - to help those who are interested in doodling
4.1st task- materials
5.2nd task- Ways to doodle/demo
6.3rd task- products
7.Outcome- a decoration for anything

8. Showcase- Gallery

How to spend your time in the toilet while doing big business?... ROFL
Theme: Cartoon/Cute
1.Who am i? - Auther
2.What is it? - Time
3.What for? - to help people save time
4.1st task- basic/common ways to spend your time
5.2nd task- others different ways to spend your time/sharing
6.3rd task- products
7.Outcome- Save time
8. Showcase- Gallery


How to make your own eco enzyme for cleaning (natural soap)
Theme: Greenish and crayon style
1.Who am i? - Auther
2.What is it? - eco enzyme
3.What for? - for cleaning and cut down water pollution
4.1st task- materials/preparation
5.2nd task- steps/making it
6.3rd task- preserving it
7.Outcome - your own eco enzyme for cleaning (natural soap)
8. Showcase- Gallery

How to be an Otaku?
Theme: Cartoon
1. Who am i? - Auther
2. What is it? - Otaku
3. What for? - for people who loves anime alot
4. 1st task- the TO DO list to be an Otaku
5.2nd task- the NOT TO DO list to be an Otaku
6.3rd task- Otaku's accessories
7.Outcome - a perfect Otaku
8. Showcase- Gallery


How to convert your boring whit after school shoe into a fashion shoe?
Theme: Cartoon
1. Who am i? - Auther
2. What is it? - Shoe
3. What for? - for fashion/DIY fashion
4. 1st task- shoe designs
5.2nd task- materials
6.3rd task- process/steps
7.Outcome - a fashion and nice shoe
8. Showcase- Gallery


Photoshop Tutorial Urls
- Underwater
- Waterdrops on leaf
- Manipulate Smoke into a Image
- Robotic Frog ... ... ... awesome
- Dynamic Lightings
- Frozen City



Pretty Websites

Mola Ativism

Raduceuca

Level 2 Design

Artgeex

Stolen Design



Tutorial URLs
- Snowflake
Feedback: I think this tutorial is fine and it is quite detail. The good thing is there are alot of pictures, so you won't get lost while you are doing it.

- Ship in a Bottle
Feedback: The picture stated quite clear, although is a graphic pictures. To me, graphic pictures are better than photos, is much more clearer

- Gain Weight
Feedback: I quite like the idea of putting pictures in almost every tips they given. At least, there is an example there.

- Good Night Sleep
Feedback: I find that this tutorial page is lack of photos, so is abit unattractive.

- Plush Toys
Feedback: This is actually not bad. You can download the tutorial into your computer. It is quite friendly user with the download cause the user can use the tutorial even if they are offline.

Saturday, July 11, 2009

Design Method project 2

so far.. i done these much only for interface design...
i just did some refinement from tihao and kenix's comments.. any comments?

ATOMIC ALIEN

mainpage and rollover

subpages


SOFT CAGE

mainpage and rollover

subpages

comments?

Thursday, July 2, 2009

Dmethod: Project 2... continue again

Pattern Design (click to enlarge it)













Wednesday, July 1, 2009

Dmethod: Project 2... continue

Logo Design SOFT CAGE: (click to enlarge it)





Dmethod: Project 2...

Logo Design
ATOMIC ALIEN 1
: (click to enlarge it)













ATOMIC ALIEN 2: