Category: Web design

Of late there is pressing demands of kinds of professionals who suggests user experience and are called user experience experts. But what is user experience? A common idea is, behind a website’s success two factors contribute; namely great design and flaw less script. The third perspective is often ignored and this is the most vital aspect of a website. It is called user experience. A great design can lure you to stay glued, some good dynamic HTML can make you feel elated and flawless code can add joy in the exploration of the web site. But what if the messages, graphics present in the website are confusing or ambiguous? A small example will help you. Say in a shopping cart after adding an item to cart, the message flashed is ‘Thanks for buying this product’. Will it not confuse you, when you actually are not buying the item but adding it to cart? Some eye-catching designs sometimes found to be totally ignorant in terms of user perspective. I often come across blogs which have light colored fonts against dark background. A blog is meant for reading and if it is not soothing at all, you will not be able to concentrate leaving a bad user experience. CAPTCHA is one other case where more than 50% of websites only harass visitors. CAPTCHA is to block automatic form submission through script and it is often distorted so that electronically it cannot be read. Often websites remain ignorant of this fact and make CAPTCHA text so complex and distorted that one need to hire a calligraphist to decipher it. All these only leave a long sustaining bad impression in your mind and whenever you visit the website it haunts you in the back of your mind. The wikipedia definition of user experience states that ‘User experience design is a subset of the field of experience design which pertains to the creation of the architecture and interaction models which impact a user’s perception of a device or system. The scope of the field is directed at affecting “all aspects of the user’s interaction with the product: how it is perceived, learned, and used’. For every successful product or service there is a context and content of website is built upon it. The content and context is enjoyed by the user of that product or service. If we go by user perspective and satisfaction level and if our website answers in positive for all the questions asked below, and then only we can claim it to be satisfying user experience. When the user first visits the website (and every time) is it accessible to him? If it is accessible then can he find information easily? The information he gets, is it useful? Is all the information he gets credible enough? If he ever gets wrong information, he will never trust you. When he browses the website, then all the messages or helps he gets, are relevant? If you providing any text, message etc in any area, then are the placement of such texts, images desirable? Is there any flaw exists in the usability of monetary transaction in your website? The user will never come back if he is harassed with payments. Is the website overall bug free? Is it eye catching? And last but not least how unique is its service or product? Are all these information valuable? Proper mingling of content and graphics in the light of context will draw visitors to your website and accessibility and usability will keep them loyal and contented.

Sometimes we click on some buttons or links of many websites but nothing happens. It sometimes just takes you to the top of the page (if you are somewhere below on the page). I am sure everyone has experienced this at some point of time, in one or the other website. If we see carefully, a “#” symbol is visible on the left of the browser’s status bar on moving the mouse over that button or link. It signifies that the button or the text-link is not connected to any page or section. The creator has just placed that for future work. May be the designer is working on the page to be linked and once it is done, the file will be uploaded and link will be updated with the real one (xyz.html etc.). It’s an example of poor experience design. It just makes the visitor feel frustrated. If your page is not ready, simply don’t put the link on the button or text from where it will be linked. You can link it later when you have the file ready for the visitor. We see the same thing in case of navigation bar. If you have to design the navigation bar and you don’t have a few pages ready to be linked, simply omit those navigation items. You can update the navigation bar later and do a “find-n-replace” through out the website. If you are lazy enough to do that or feel it will look odd, just give a clear “coming soon” message when people mouse-over the item. Sometimes designers handle it in an other way too. When the page is not complete they use a general template and put “data coming soon” on the content area. This is also a bad practice. Why taking a visitor to a page where you have nothing to say? You can say it before he goes there by putting a simple “coming soon” tool-tip kind of stuff on the related link or navigation item! It might be a small thing to you, but think about a person who is not as “tech” as you are. He or she might feel that there must be something wrong and try clicking randomly to find the information he/she is looking for, but in vain!

Definition: Information Architecture (IA) is the art and science of structuring data, and defining user interactions before actually creating the website. Why IA is important? It is the blueprint of the site upon which all other aspects are built. They are: 1. Form 2. Function 3. Navigation 4. Interface 5. Interaction 6. Visual design Steps of IA: 1. Define goals of the website 2. Define the user experience 3. Prepare/gather website content 4. Define website structure 5. Create visual design 1. Goals of the website Defining website’s goal gives us a clear, well documented idea of what we want to build. Steps: – Ask questions – Filter the answers – Prepare design doc: “Website Goals” 2. User experience User Experience is the overall experience and satisfaction a user has when using a website (or product or any system). The experience is commonly defined in terms of “ease-of-use”. Steps: – Define the audience – Create common scenarios – Analyze competitors – Prepare design doc: “Audience, Scenarios, and Competitive Analysis” 3. Website content In this step we have to gather the content for creating the structure and organization of the site. You will need to answer two questions:  What pieces of content does the site need?  What sorts of functionality will be required? Steps: – Identify content and functional requirements – Group content – Label the grouped content – Prepare design doc: “Content and Functions” 4. Website structure It is the skeleton of website which holds the body made with information and data. Ease-of-use of a website is primarily defined during this step. Steps: – Website structure listing – Define navigation – Prepare design doc: “Site Structure and Navigation System” 5. Visual design In this step visual materials (layouts) are developed to create an experience. Visual Design includes: Graphic Design, Illustration, Typography, Layout, Color Theory, Iconography, Photography, etc. Steps: – Layout Grids – Design Sketches and Page Mock-ups – Prepare design doc: “Visual Design”