UI design and Online Wire Frames design

It is human tendency to go ahead and do a U/I design without bothering about the actually usability of the software. When we design for a closed target audience it doesn matter how the u/i  is but when your software is gonna be used by unknown audience then oh-boy u are in serious trouble.

I personally su*k as U-I designing. But i’ve come to an understanding of the importance of it. Take it like this. if google search screen had say 400 line of text input would you visit it ? its simple . has  one text box. two buttons with  clear purpose which gives a world of solution.Now thats called a U-I design.

Things that i think are very imp while designing U-I

  1. Simplicity
  2. Atomicity
  3. Clarity
  4. familiarity
  5. use of accepted design

Simplicity

When designing be sure to  make it simple . Dont complicate . Eg. To create a new connection.Give a icon with a image and clear label of its purpose.Don show mickey mouse photo and connect label because you like the cartoon.

Atomicity

One click per operation. Make sure you don torture the user. Don surprise the user with lotta info. Give him wat he/she wants.

Clarity

Be sure of the functionality.If two things can be done in same way then be sure navigation to them are same.Don make user to find stuff. No one like hide and seek (except hide and seek biscuit . i personally hate those . ).

Familiarity

Make the ui very familiar.  Use convention from mac ,windows.Linux just copies them so don bother lookin into it. If u wan raw access to computer use linux .Anyway back to the topic. for example for copying allow ctrl+c ctrl+v. use shortcuts thats there every where. Allow drag and drop .etc…NO one like to go to pluto to cook food and similarly no one like to use software that looks like rocket launching main frame.

Use of Accepted design

make sure you use accepted design principle . Eg datagrid for show matrix info. use Dropdown for select one field. Reduces Pop-Up counts Etc,

Ok i took some months to understand these.But i encountered a site which helps you in picturing the final u-i before actually coding it.

http://gomockingbird.com/mockingbird/

Using this online portal you can get a basic picture of what u wanna do and bam bam of coding :). The site is simple and really powerfull. There are other software which allows you to do it but this is online and you need not bother out installing and such.

Got ideas,suggestion,view or comments  Keep them flowing:)

  • I am a complete novice in web and UI design and want to know what’s out there before I invest my money in anything.