An interesting post:How To Design A More Effective Website Header

The header of a website is likely to be the first thing people will look at when they visit your site. This post introduced three design aspects to consider when designing website header.

1. Keep it simple. This aspect could bring with clarity,trust,meaning.

 

A simple header can convey trust. For example, Wood&Faulk use very few elements in their header, focussing on their logo with two brief slogans. This sacrifice of visual elements or other content puts the company on a pedestal. Only their name and a two lines of text are needed to create an identity and convince the visitor of their high quality products.

2. Add some art so it could bring with attention,appeal,professionalism.

This header is an example for attention. the site 3D Polystyren works with a very nice 3D illustration of their name to create a  sort playground for a bunch of little figures who either stand around the letters, on top of them, or try to climb them. The illustration itself doesn’t carry a specific message, but makes you curious to see what else the site has to offer.

3. Make it interactive. It’s could bring users with engagement, fun,personality.

Interactive elements can be very engaging for your website visitors. For example Açoriano Oriental use a parralel scrolling effect on their site, letting the airplane fly through the clouds while you scroll down the page. The header becomes an integrated part of the website and invites the visitors to enter the site in a very engaging way.

Want to see more example? Click on the address!

http://blog.usabilla.com/how-to-design-a-more-effective-website-header/

Breakthrough ideas: Futuristic Glass

This futuristic concept aims to integrate the capabilities of online-services in our daily life. Since web users can now access the Web everywhere and all the time, one can use their mobility for a number of useful applications. For instance, to provide assistance in a city guide, translate texts, look up some data in encyclopedia etc. A futuristic concept which is likely to become reality in the near future.

I think this could be accomplished in the nearly by future. In fact, part of them have been accomplished now. For example, An translation APP on my iPhone could scan single word and translate it into other language.  The key question of this design is the technology of search.   As the technology is developing fast, I believe this kind of APP could be used by users soon.

50 Amazing Flash Website Designs

Today, most of interface design is using imagines as they are small and the speed of the website will be fast. At the same time the trying of 3D based website is never stop. But we should notice a kind of media that could give users better interactive experience but also could promise the speed of the web load by the smart design. This media is flash.

This post puchilshed 50 amazing flash website designs. You can’t enjoy the pleasure only by looking at the screenshot of website homepage. Just click on the picture and go to the website to enjoy the extreme interactive experience the flash website bring to you.

Post  address:

http://www.webdesigndev.com/inspiration/50-amazing-flash-website-designs

Simple and efficient

“Just paste it” is really an interesting website which use word document lay out as website’s homepage. “Just paste it” is a simple and convenient website which could make your publish your text, imagine easily and quickly. After your publish it, your can get the link of your post and share it with your friends.

Look at this image you can hardly imagine this is a homepage. It could be a word document, it could be the layout of email edition, it could be a layout of blog posts edition. How could this be used as homepage. However, this is happened in ” Just paste it”. It seems saying ” Just use it” as soon as you see this page.

The design is very simple and familiar to the users as this design is similar to word document. But at the same time, this design is very effective even for new users, they can use this website convenient in few seconds.

No beautiful design, no careful layout, simple but effectively. Probably we can design our website in this thought.

Small hinting, great importance

In learning website design, I was told the importance of hinting especially in pointing and selecting again and again. Now I find the hinting is not only important in website design. It’s also very important in our daily life. Though hinting is probably very small, it has great importance.

I have spent about five minutes to find a untying of  flavoring bags just because there is no hinting of untying. The bag is so small it’s hard for people to see the notch clearly.  But for some other favoring bags, the hinting is designed very well. Small hinting could help people save time.

My credit card have been retained as I forgot to pick up my card after use it (In China, when you use ATM, your card should be inserted into the machine in the process). There is no hinting to alert me that my card is still in the ATM machine and I have to go to the bank tomorrow to get my card back. And before I get my card back I always worried about my money in the card. If there is a hinting(just like the light and sound hinting to remind people get money), I probably not need to worried. Small hinting could make people free of worry.

Though hinting is very small and probably designed very simple, it has great importance not only in website design but also in our daily life.

The development of common sense

Have you notice the doorknob used in the entrance door in the campus? There are two kinds of knobs one kind is rectangular which is often installed in the push side. And another kind is holder which is often installed in the pull side. I think it’s really a good design. It’s so user-friendly that it’s easy for users to understand and also easy for users to remember. First time when I use this kind of door, I have uncorrected tried to pull the rectangle, then I spent few seconds to understand it.  In the following days I use this kind of door again and again. I am more and more costumed to it.

One day when I put my hand on holder and tried to pull open the door, I find I couldn’t open it. Then I tried again with greater strength, it didn’t move! At last, I find there are holders at both side of door. I suddenly find it has already become my common sense that every time I saw holders I will pull them without thinking!

It’s funny to find I develop my common sense so fast. The user-friendly design can transfer to common-sense in short time and at the same time most of design that comply with common sense is user-friendly. So if your design is user-friendly then you don’t need to worry about whether it will reject common-sense.  Even if it is, then you need to believe users will develop new common sense as the design is so user-friendly.

Most of all,do your best to make your design user-friendly.

Reading reflection of week 3 Heuristic Evaluation and Ten Usability Heuristics

Heuristic Evaluation is a usability engineering method for finding the usability problems in a user interface design so that they can be attended to as part of an iterative design process. The participants of heuristic evaluation are experienced designers or evaluators who know usability principles.

Often the evaluators are consisted of few people as it is difficult for a single individual to do because one person will never be able to find all the usability problems in an interface. And evaluators from different areas could bring up with different usability problems. This could make sure the quality of evaluation.

And because of small number of participants, Heuristic evolution could save money and time.

Heuristic Evaluation is an effective model of evaluation and is commonly used in interface design and evaluation.

This week’s material also introduced ten usability heuristics which are very important.

They are:Visibility of system status, Match between system and the real world, User control and freedom, Consistency and standards, Error prevention, Recognition rather than recall , Flexibility and efficiency of use , Aesthetic and minimalist design ,Help users recognize, diagnose, and recover from errors , Help and documentation.

I have sufficiently realized these principles through the process of posting samples’ blogs. Often a good website is appreciated because of satisfied these principles and a bad design is also because of violate these principles. These principles are the things I want to alway remember about interface design.

Reading reflection of week 10

Information architecture refers to the structures or organization of a website, especially how the different pages of the site relate to one another. The important content for this week is information architecture.

First, the author introduced how people navigate. There are three ways that users could use to find information. The first is an idealized model which assume the users have been there and know the structure of the website. The second is optimal rationality model and the third is satisfying model. The third model is most realistic and it seems most user tend to use website in this way which users try to find information with minimizes mental effort.

The way of users’ navigation implicate some design principle such as express important information in first scan, frequent user links’ necessary and so on. The main purpose of these principle is to save users’ time and energy.

Then, the author introduce how to develop architecture. I think the second step – evaluate your content, need a lot of attention. As content of a website is very important, more attention should be put in this step. In our practice, we put not so much attention on this step as our website is small. We don’t have too much and complex content to evaluate but in real project the content could be complex. In this cases, a good evaluation of content and a clear hierarchy of content is very important.

Reading reflcetion of week9

This week’s reading material is mainly about the conceptual design.After determining our personas, scenarios and requirements, we will go the next step: conceptual design that’s a process of converting the designer’s mental model to user’s mental model.

In conceptual design we often use sketch, wire frame and prototype to express our design and idea. Sketch is the simplest and lowest fidelity step. In this step, the designer don’ t need to put too much detail such as pictures ,texts into the sketch. The main purpose of this step is layout of interface design. Often this step designers could complete with paper and pencil. They can draw what they think on the sketch and discuss it in group.

The next step is wire frame, in this step, the layout of the interface is almost determined and some detail elements is insert into the interface such as the imagine, the hierarchy of the website page and so on. In this step, designers could complete wire frame depend on some software.

The last step is prototype. The prototype is very detailed. In fact, the prototype is almost like a real website except some interaction function.

There is something that very important in conceptual design. First, based on the personas, scenarios and design requirements. Second, focus on the main purpose, don’t distract your attention on detail. Third, remember: the earlier the correction the easier the process.

An interesting website design- Tumblr

Few days ago, I wrote blog to introduce the trends of website design in the future. One of the trends is using full screen picture. Today I find a very interesting website – Tumblr. In this website, imagines is used as the main elements instead of text.  This is really a brave design which make people feel fresh and different. But at the same time this kind of design also have some shortcomings.

I think the first and mainly advantage is attractive. Users like simple design and more prefer pictures than text. These pictures could catch up users attention at their first glance, then users will spend more time to see these pictures. And easily find the things they are interested in.

Secondly, this kind of design is appropriate for Tumblr which is a microblog website. In this website, users enjoy the simplest way of publishing blog and mostly they will not write too much texts but publish their prefered pictures. The website put pictures on the homepage and use pictures as the search results fully expressed its character.

However at same time, too much pictures and too little text also bring the disadvantage that too little information. For some featured imagines that’s fine. But for some pictures which purpose is very blur, it’s hard to say what it want to describe.

Also, little text make it’s hard for new users to know what’s kind of website it is.

For this website, it’s hard to say whether it’s good or not as it’s a different and new attempt. I like this kind of design personally.