Sunday, June 12, 2011

Trip to National Museum

    Among the topics covered in the Museum, there were some topics I was quite interested in. The first would be ancient burial methods. These methods vary across different cultures (and Eras), and are as interesting as some are mysterious.

   Take for example the Chinese hanging coffins. These coffins are placed at the face of the cliff, and Discovery Channel had documented the custom of bringing up coffins up the cliff and the tradition itself.

Chinese Hanging Coffins

   Another topic I'm interested in is the interaction between the Kings and Rulers of different lands before the modern ages (when Malacca was still a country on its own), for example China and Malacca, or Thailand and Malacca. They often sent gifts to each other to uphold the friendship between countries. China would send gifts to Malacca which represented royalty, which has left a legacy of identity in our history. Thailand (then known as Siam) was given Gold and Silver tree sculptures.

Gold Tree given to Thailand (Siam)

Saturday, January 15, 2011

Week 2 : Prototyping

Prototype 1

Week 2 : Strategic Brief

Project Definition :
The project is to redesign the Courts Mammoth Malaysian website, with functional design that portray the identity of Courts and provide easy access for consumers to Courts Mammoth’s updates.

Current Site Analysis Goals :
The site should serve as a portal for consumers to check out promotions and products, as well as get to know more about Courts Mammoth through their profile and events page.

Client’s Analysis :
Courts Mammoth is a furniture and electronics retailer which has been in Malaysia for 24 years. Their mission is “to be the most customer orientated, profit focused retailer making aspirational home products easily affordable.”
 Courts Mammoth’s USP include their sleep clinic, a service which provides independant expert consultation on solutions for a customer’s sleeping problems.

Short and Long-term Site Goals :
The long term goal of the site is to further establish Courts Mammoth’s presence in Malaysia as an electronics and furniture retailer.
To achieve that, the short term goals of the site would be to improve the consumer’s accessibility (and experience) to check for latest promotions and features. In effect, turnout at events or promotion periods should increase and thus the familiarity towards Courts Mammoth as well.

Target Audience (amended) :
Young adults are the more suitable target audience for electronics and furniture. Their age group would be around 25-35 - some of them may have just started a family and bought a house; some are occasionally expanding their furniture to accommodate more people in their home; and some would be interested to upgrade their home electronics (example: buying a bigger tv).


Competitor’s Analysis :
Competitor websites have a few things in common :

Primary:

-          - Design is consistent through website to enhance brand identity
-          - Either use their brand colors or keep it simple (lines and boxes)

Secondary:

-          - Promotions  / services / events are highlighted on the home page
-          - Online organized gallery of their products / product brands
-          - Mailing list to recieve promotional updates
-          - Make it easy for clients find their stores / contact


Idea and Concept Implementation :

The redesign of the Courts Mammoth website aims to make it more appealing to a generation of users who have become quite used to acquiring information from websites, thus will not be very patient with bad navigation and colors / text / graphics which strain the eye and mind.

The new design will have more harmonious colors as well as a more organized layout (not to mention consistent look), and feel more user-friendly at the same time slightly more sophisticated and fresh.

Thursday, January 13, 2011

Week 2 : Site Structure

1) Refined sitemap

Please visit link for details in the sitemap (and details in the pages) :
http://writemaps.com/sitemaps/shareMap/6xeie1vtrz2cuv2z3q3pao5xwyqae2vqsdvogxty14c0t54wvi


2) Moodboard


3) Structure

4) Structure 2

Sunday, January 9, 2011

Week 1 : Client Website

Courts Mammoth


- buttons are rather unappealing



-  navigation does not show current page
- information can be arranged into paragraph for better reading


- text hierarchy can be better
- there is more information about the products under 'FAQ' than the 'Products' page itself.



- Several different fonts used in the page, and links could be displayed with an underline instead of bluntly describing it with text (click to view pdf)

Overall :
Pros : main page looks acceptable.

Cons : inconsistent design of the homepage and the rest of the site.

overall lacks user-friendliness in navigation as well as hierarchy and presentation. Typography, design and copy-writing can be improved. Website looks like a basic draft rather than a completed website.

Week 1 : Site Map

Week 1 : Gantt Chart

Week 1 : Commercial Websites

inkd


- quite a user friendly contact page
- starting from the Sub-title, to the email (care@inkd.com) and the CEO's email, they're telling us that there are committed to taking our messages.



- Clean and clear home page, with a smart way of having promotions (countdown).


- Beautiful navigation, very clear on how it works. (titles, sub-titles, 'View All', and links)



- information is well presented on the same page (top: features ; right: help/contact ; left: categories ; bottom: customization)

Overall: A beautiful website with clean, simple, but smart design and navigation, making it easy to navigate and friendly on a one-to-one level, with the text almost 'speaking' to the user. Presents information well.

______________________________________________________________________________________

Mission Bicycle Company


- Good navigation design : the contact, feedback, and help are conveniently available in the same spot throughout the website.


- products


- the very handy 'help' feature which allows the user to take a snapshop of the page to communication easier.


- nice color-coded gallery

Overall : Website with good navigation that contributes to the 'feel' factor. Easily accessible 'contact', 'feedback' and 'help' helps boost the user-friendliness.

____________________________________________________________________________________

nestliving


- simple navigation that prioritizes in making space for the content.


- the rest of the navigation tucked in a corner. Again, main content in the middle is given priority.


- gallery


- well presented information, good use of bold and single line paragraphs.

Overall : A website that succeeds to puts content first, with its navigation simple yet functional and easy to find, as well as successfully making large amounts of information easy to read.

___________________________________________________________________________________

Team Excellence


- clear and appealing navigation (below the arrows), bold but effective way of presenting the information (the 'about us' is summarized in one big picture which also promotes their features)


- clear and beautiful way of presenting information


- presents information on a different page as deemed necessary, but at the same time subtly providing a link back to home.


- beautiful information presentation

Overall : A corporate website that is functional and information well-presented, yet still beautiful, original, and appeals to both common users and corporates (assumption)

Week 1 : Competitor Websites

Harvey Norman


- typography in body content can be better. Lack of hierarchy in presenting information (title and content are put together with no apparent separation)



- different categories can be labeled, for example: 'advertisements'.


- information on this page appears to be slightly better presented


- can be better replaced with a simple 'view' or 'go' or a button.

Overall :
Pros:
- maintains the identity of Harvey Norman throughout the website (colors and logo)
- simple navigation, uncluttered and clean.

Cons:
- nothing to indicate which page you are currently on.
- quite a few subtle mistakes and less-than-thoughtful designs reduces the overall appeal.

Comments: basic typography and design, but acceptable for use.
__________________________________________________________________________________

 SenQ


- inconsistent look (logo is not seen here)


- although navigation is arranged in order, but the design looks cluttered, a little messy.


- description 'locate your nearest senQ store' can be bolded for better presentation.


Overall :
Pros : design that promotes the brand identity

Cons : logo is missing in some pages, minor inconsistency. Some pages look cluttered, maybe due to the design and also the typography.

Comments : Nice look and feel but can be cleaner

___________________________________________________________________________________

Ikea


- Clean and clear navigation with indications of the current page as well as highlights. Uses the brand color.


- Information well presented, using pictures rather than too much text.


- Again, beautiful and functional navigation designs.


- Unique and innovative way of sending a message, by using elements that interact with on-screen objects instead of the conventional presentation.

Overall :
Pros : Clean but retains identity, some innovative and interesting ways of presenting information, at the very least, not boring at all.
Appealing names : 'Even Lower Price' replacing the common 'Promotions' and the special 'products' page.

Cons : Brand identity could be enhanced somehow.

Week 1 : html library

1. slide-in menu
http://dynamicdrive.com/dynamicindex1/slideinmenu.htm

2. mouseover tabs
http://dynamicdrive.com/dynamicindex1/mouseovertabs.htm

3. content glider
http://www.dynamicdrive.com/dynamicindex17/featuredcontentglider.htm

4. tooltip
http://www.dynamicdrive.com/dynamicindex5/dhtmltooltip.htm

Week 1 : Photoshop Tutorials

1. http://abduzeedo.com/adobe-cs-5-design-premium-box-photoshop



2. http://psd.tutsplus.com/tutorials/drawing/creating-a-cool-yellow-helmet-icon/



3. http://www.webdesignerwall.com/tutorials/design-watercolor-effect-menu/



4) http://www.photoshopstar.com/web-graphics/satisfaction-guaranteed-seal-or-badge/