Posts Tagged ‘Cert 4’

List of well designed websites

Thursday, July 23rd, 2009

Below are a few simple but well designed sites and Why!!

  • Mozilla.com
  • Iconbuffet.com
  • Boldchat.com
  • Enhancedlabs.com
  • Protolize.org
  • Sumagency.com
  • www.teamviget.com

Mozilla.com

Clear, open, fresh, simple. When you arrive at this site, you’re under no doubt what the site does, or where to start looking for what you want. The design is positive and happy.

mozilla.com screenshot

Iconbuffet.com

The site sells icons, so it lets the icons rule, showing its wares from the first page.

The colours and typography are solid & strong, projecting a trustworthy brand while not getting in the way of the proposition.

iconbuffet.com screenshot

Boldchat.com

Boldchat provide a great live chat service for web sites, which is a very wide market to address.

So the site design is clean, smart, and shiny, using clean copy and smart imagery to communicate the core messages in a compact space.

boldchat.com screenshot

EnhancedLabs.com

Another icon maker, doing bigger, richer icons, so the the site showcases them bigger & richer.

Bold, flattish colour creates a strong first impression and still lets the product stand out.

enhancedlabs.com screenshot

Protolize.org

Tony Yoo’s collection of recommended web resources is a great example of strong graphic elements balancing to make a site that’s bold and easy to use.

Big text, simple nav, high usability, all wrapped in strong colour and finished off with nice graphical touches.

protolize.org screenshot

Sumagency.com

Acres of balanced white space, easy-read text and cute content graphics combining to tell a simple story.

sumagency.com screenshot

I just love the concept with the wall metahpor that this website uses. I also think that the way this site works with all the interaction and movement being done with CSS is very cleaver.

vignet

What Do you think?
When you go to a website that you like do you know why you like it?
Do you even think about why you like it :)

A possible information architecture process:

Wednesday, March 18th, 2009

Collect and organize product requirements.

You should focus on more than the list of desired functions. You need to investigate the stated and implicit factors that the organisation or website owner considers to be most significant in the product’s success.

Collect and organize user needs and expectations.

Either using existing research or by performing an comprehensive user research and persona creation process, you identify what the products’ users want from it and how they expect to use it. You put this information together into a mental model of the user, an understanding of the user’s wants, needs and expectations.

Perform a content audit.

The depth of the audit depends on the final outcome-high-level navigation redesign requires only auditing a sample of content, whereas a CMS migration necessitates a rigorous page-by-page inventory. The audit is the analyzed to define primary content types, which are then laid out in a Content Map.

Create a new information architecture

By coupling the content audit analysis with your understanding of users’ mental models and the product’s business goals. This architecture will define the overarching user experience of the site and will be documented in a diagram specifying every step of the user experience within the section under review.

Prepare the documents that define the foundation of the new information Architecture

Provide detailed navigation specifications indicating the navigation elements required for every page, in order to guide the implementation of the new architecture.

These specifications will be supplemented by wireframe schematics indicating the placement of all navigation elements. You can also provide a style guide that will outline naming conventions for key content areas, URL conventions, and conventions for site-wide way-finding cues.

More resources

http://adaptivepath.com/events/training/complete/files.php

http://www.iainstitute.org/tools/