What is your favorite User Interface? (web application) [closed] - user-interface

Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 8 years ago.
Improve this question
I think it would be interesting to get a programmers viewpoint on UI design.
What is your favorite User Interface that you have come across in a web application?
If possible, say a little bit about why you like it.

http://www.google.com is my favorite. Can be considered a "lack of UI" ;)

At the risk of sounding too much of a fan ... I think StackOverflow has a great UI. It is clean, without clutter (except the creeping ads!), the navigation is straight forward and yet manages to compress a fair amount of functionality.
Fairly simple features, like the coloured vote buttons to show what you have voted for, and the live preview really add to the interactive feel.
(And I don't mind the ads as long as they stay away from the flashing punch-the-monkey kind!)

Web application: Wordpress. It's so powerful, yet clean and easy to use.
Desktop application: Excel (or equivelent). Seriously, a spreadsheet is the most innovative and clever user interface ever devised. It's used for everything. I don't know what the question is, but the answer is Excel.

GMail interface is so smooth and fast that I question me why nobody had done that before.

I think Remember The Milk has a brilliantly clean and intuitive interface

Mint.com, if you trust someone else with your bank account information. It keeps track of all your transactions, lets you fill out a budget, notifies you of unusual spending trends or transactions, and lets you drill down through your spending trends to see exactly where all of your hard earned cash is going. Best of all, it's free.
(source: mint.com)

http://bbc.co.uk homepage
http://mail.google.com/
http://stackoverlow.com (that is I liked it before the introduction of ads :)

FreshBooks accounting has a very nice interface.
(Although I upvoted the answer in favor of StackOverflow)

I think stackoverflow has done a great job in many areas in terms of usability, including colour pallete, use of whitespace, anticipating user's need for information and providing or hiding appropriately, non-intrusive JS/AJAX.
Minus points for these increasingly obtrusive ads, though. :P
Gmail is also good. Honourable mention to github.com.
Update: I recently got introduced to FriendFeed. I think they have also done a fabulous job with their web UI, in terms of clean yet attractive design, plus appropriate and helpful use of Javascript and AJAX to provide for a smooth, positive user experience. Check it out.

The new Yahoo Mail UI blew me away when I first saw it. The keyboard shortcuts, drag 'n' drop, tabs, etc. really make it look and feel like a desktop app. Admittedly this quality of UI has become a lot more common on the web in the last few years, but for me at least, Yahoo Mail was the first web app in my experience to bring this kind of usability to the web.

http://fastladder.com has great UI for feedholic. I can't live without fldr's keyboard shortcuts (and some greasemonkey to change them to fit for me.)
http://www.instapaper.com is also simple and great. This is temporary storage for web resource marked as read later, and don't need password for make account because of that purpose.

For the CLI lovers out there...
http://cb.vu/
cat about.txt
Not really useful but it's quite interesting.

Related

How to promote a new product/service? [closed]

Closed. This question is off-topic. It is not currently accepting answers.
Want to improve this question? Update the question so it's on-topic for Stack Overflow.
Closed 13 years ago.
Improve this question
This is often a bit of a problem for lone developers working on a product or a service. How can they get the word out about their product?
I recently finished a project of mine and I'm struggling a bit to spread word of it.
What do you think is the best way to promote your new product/service?
Although this question isn't strictly programming related, it's a good question for programmers wanting to get their creation out and about.
You should have a short tutorial explaining what your product does and how to use it without having to install anything or fill out a single form. I'm not exactly sure what AnyHub (The OP's website) does with my files, how I would share or manage them or why you are doing it for free.
Look at Web 2.0 sensations and see how they streamline the process from hit to customer. For example Twitter has the What, Why and How buttons right there on the front page and nothing else to distract you from them. It also has motivating testimonials there too, and is themed to represent the idea.
Also, you should be trying to find a point of pain that many people have and try to ease that. Twitter knows it is getting impossible to tell your friends what you are doing via email, sms, blogs, feeds, rss and so on so takes care of it. What do you provide (other than an alternative pricing model?) Tell me on your website.
The internet (obviously).
If you're going at it alone, grassroots via Blogging, Facebook, and Twitter work.
You can also purchase google ad words, and other ad-related venues.
You can consider an open source version of your project, or joining tradegroups/ forums related to whatver problem your product addresses, and start to build a following (but please DONT spam these groups).
Mobile phone applications are really easy to promote nowdays, thanks to Apple's iPhone App Store paradigm. Now all major players (RIM, Nokia, Palm, etc) are opening their own application stores which takes away much of the promotion effort from the developer. As long as your application, game, etc is interesting it will sell by itself. Nevertheless, everything depends on the first week you launch your app and it is up on the list of the newest arrivals.
In the desktop world things are more difficult although Sun recently announced a similar promotion scheme for Java applications. More might follow, but it will depend on Sun's success or failure.
I believe (and actually hope) that centralized "selling services" will be the primary way of buying applications, games, plug-ins, services, etc in the near future. It is far too convenient to pass.

examples of both good and bad application user interface design? [closed]

Closed. This question is off-topic. It is not currently accepting answers.
Want to improve this question? Update the question so it's on-topic for Stack Overflow.
Closed 10 years ago.
Improve this question
I'm a blind student who's taking a required UI class. One of the assignments is to take screen shots of both a good and bad application user interface and comment on what's good and bad about it. I'll have a reader help describe the interface to me but would like pointers on applications to check out. They must be windows apps. In answers I'd like a link to the application as well as brief comments on what to focus on in the UI, for example color scheme is horrible, badly labeled controls, cluttered layout, etc.
An interface experience for a Blind person is a relevant aspect of UI design. If I were in your position I wouldn't focus so much on the visual aspect of user interfaces. Go from your personal experience. What is an application that you, as a blind person had a great degree of difficulty using? What applications are a joy to use?
If I were in your teacher's position, I would find such descriptions far more valuable than an attempt at pretending as though you can see, and that things like colors or fonts are relevant to you. (unless you are only partially blind, in which case font size may indeed be a relevant factor)
There are a great many people in my field that are keenly and constantly interested in such testimonials and evaluations from blind people. Not just in an academic context. I work for a government organisation that is required to make its resources accessible to disabled people. Don't sell your own perspective short, just because of a poorly worded assignment.
A little bit old, but quite well written, with plenty of examples: http://homepage.mac.com/bradster/iarchitect/shame.htm
Good: Microsoft Office 2007
Bad: Microsoft Office 2003
As far as Windows applications go, I like Microsoft Outlook as a positive example UI. The layout of Microsoft Outlook has been imitated in a lot of other software. It allows/facilitates quick and easy navigation and searching of a variety of information with very little user effort. It allows the user to see their information in different formats (message preview, list,est.) and to adjust the UI to meet their needs and make the information that is most valuable to them most prevalent/easily acceptable.
I have to assume that you have already done this assignment, but I want to give Breton a thumbs-up for his suggestion. If there is one thing that is most often overlooked, it is consideration for visually impaired users. I often steer aspiring web developers to http://colorfilter.wickline.org/ so that they can run their pages through the various filters. If one takes a screen shot of their application, they can embed it in a web page and run it through the tester also.

Looking for some examples of GUI apps with great design [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
We don’t allow questions seeking recommendations for books, tools, software libraries, and more. You can edit the question so it can be answered with facts and citations.
Closed 8 years ago.
Improve this question
I will start developing my next desktop application in about a month. In the past I have delivered functional software that hasn't wowed anyone, including myself, in the usability or aesthetics department.
Does anybody know of any resources or guides or even books that could showcase examples of good design in desktop software?
There seems to be a lot of resources for web apps, but such resources for desktop applications are rather slim.
I enjoyed these dot net rocks tv videos by Mark Miller on The Science of a Great User Experience really got me thinking about good ui:
http://www.dnrtv.com/default.aspx?showNum=112
http://www.dnrtv.com/default.aspx?showNum=123
Where you can really make a difference with GUI design is if you are addressing a difficult to understand concept in a GUI.
When you are doing that, creativity is critical. When dealing with complex hardware configurations (something I had to do a lot, but probably doesn't apply to you), I've had good luck going to tech manuals and tech support people and trying to completely understand the problem. Then I took the methods they used to show me (diagrams from the manuals, whiteboard drawings, etc) and tried to code them into a GUI.
Had a couple massive successes with this.
Iteration is also critical. Prototype something quickly then beg everyone you see to try it. Ask them to solve a problem, then watch where they go first and watch what they have problems with.
Address every problem and stumbling block.
Don't be afraid to throw it all away and start over, it was only prototype code.
Separate your GUI from your implementation so that you can swap out the GUI if you find a better approach.
If you want to concentrate on just one feature, have a look at ITunes' search box which filters as you type. Other software may have had this before, but this was I think the first place I encountered it.
The difference between this and classic search was an eye opener for me in terms of readability.
Auto-complete which you see in so many places is another one. I'd recommend IntelliJ IDEA for the way it took auto-completion which emacs, Visual studio etc had for ages and added autocompletion for variable names and method names in a manner which almost seemed psychic the first time you encountered it.
You can look at Thirteen23 Experiences
To make things usable, you need to make sure that you follow existing conventions for your target platform and application type.
For example, if you're developing a Windows App you'd better make sure that control-c copies, control-v pastes, control-s saves, etc. The File menu better be the leftmost item in the menu bar, and the Help menu better by the rightmost item.
If you don't follow existing conventions, users are going to get annoyed with your application very quickly.
Google for HIG. Human Interface Guidelines typically include lots of research into best-practice in user interfaces, and explain in great detail how to design each aspect of a program. Also, have a google for "user-interface hall of shame" or something like that.
In this question I mentioned GUI bloopers. Part of great design is knowing what makes bad design and why. It is actually a great book, although I don't know how much of it is available on the website.
You can check case studys on websites of GUI companys. I fund few at www.puzzlehead.com
Check there and also other sites.

Is help file (or user manual) dead? [closed]

Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 5 years ago.
Improve this question
Back in the days of Unix, you couldn't even close a software without reading the man page first. Then came Mac and Windows with consistent menu layout and keyboard shortcuts, but you still saw paper user manuals shipped in the shrinkwrap box, which described each and every single operation possible in the app. After the Internet, help files became html documents.
Nowadays with Web 2.0 applications, you hardly see the Help. Even if it's there, they simply describe some specific tasks. In other words, the apps are relying more on the common sense or don't-make-me-think factor of the user base.
Years ago Microsoft came up with a concept called Inductive User Interface, which basically tells programmers to put in instructions on the apps itself, but I am not sure how popular that idea is.
Are help files, user manuals, and context sensitive online help with F1 key dead? Have I failed if user could not find out what to do from the UI? If not, what degree of help should I provide? (both for desktop and web app)
EDIT: How does documentation/help file mesh with agile development methods? For example, should the developers think twice before UI changes that may obsolete a bunch of screenshots?
Three notes on help:
F1 / stand-alone context-sensitive help was always doomed. It was hidden by default, and so the people who most needed it were least likely to read it. There was hope at one time that we would be able to train users to always hit F1 when they ran into trouble, but too many applications without useful context-sensitive help... combined with too many bizarre help interfaces... pretty much killed this.
Manuals are as important now as they ever were. Not so many printed manuals anymore, but online manuals are better than ever. The proliferation of wiki-as-a-manual systems has helped here, reducing the up-front cost of creating good online documentation. Of course, plenty of people just don't read...
The beauty of using web pages as an application interface is that you can combine useful context-sensitive help with the UI, removing the barrier for novices and others who otherwise couldn't be bothered to look for relevant information when they get stuck.
Of course, there are still plenty of apps, even online apps, designed with obtuse interfaces and a tiny little help icon in a corner somewhere, presumably hoping that the latter mitigates the former. Pity them.
No way. You look at the amount of documentation and training and marketing expenditure even MS puts up.. you'll get your answer.
Try using someone else's product, and you will learn the true value of documentation - I'm learning Godiagrams right now.. :)
So I can say without a doubt.. NO and it never will.. no matter how intuitive user interfaces get.. beyond a certain size, you will need help and training. But by understanding the user and what he needs to get done, you could design it such that the time he/she needs to learn the system to do his/her routine tasks is minimal.
Have I failed if user could not find out what to do from the UI?
If not, what degree of help should I provide? (both for desktop and web app)
They should be able to use your your app to do basic things from the UI. eg say for an image editor, they should be able to create a new image, and draw some lines then save it just by looking at the UI.
This is best done by following common layouts (like having new, open and save under file in the menubar, and using the standard open and save dialogs).
The same goes for webapps, people exspect to be able to do the basic stuff without having to read the docs, but for more advanced features people will still read the docs. (eg most pople will read the docs for say BB code, or markdown at least sometimes, but they expect to be able to post without having to know them)
Are help files, user manuals, and context sensitive online help with F1 key dead?
They still have their place. People will use them to learn about how to best use various features, for example markdown or bbcode, or how to use filters to get certain effects in an image editor.
I've been incorporating context-sensitive screencasts into my applications. I've found this helps non-technical users grasp the application quickly, without asking for live help.
The Idiot/Dummy books must be doing quite well. Imagine if the standard application help was as good as those books. The standard F1 help for a lot of apps is just awful.
Is help dead? No, but some of it should be taken out and shot.

Prototyping a GUI with a customer [closed]

Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 7 years ago.
Improve this question
When prototyping initial GUI functionality with a customer is it better to use a pen/paper drawing or to mock something up using a tool and show them that ?
The argument against a tool generated design being that the customer can sometimes focus on the low-level specifics of the mock-up rather than taking a higher level functional view of the GUI overall.
Always start with paper or paper-like mock-ups first. You do not want to fall into a trap of giving the impression of completeness when the back-end is completely hollow.
A polished prototype or pixel-perfect example puts too much emphasis on the design. With an obvious sketch, you have a better shot of discussing desired functionality and content rather than colors, photos, and other stylistic matters. There will be time for that discussion later in the project.
Jeff discusses paper prototyping in his Coding Horror article UI-First Software Development
Click the "Watch a video!" link at twitter.com to see an interesting take on the idea from Common Craft.
The "Napkin Look & Feel" for Java is really cool for prototyping. An actual, functioning, clickable app that looks like it was drawn on a napkin. Check out this screenshot:
Seriously, how cool is that?
I would suggest you sit down with your client and use a tool like Mockupscreens and develop the UI interactively. A benefit it has over Napkin LAF is that it does not require coding, or indeed development tools of any kind
Check out Balsamiq
It does the "THIS IS NOT A FUNCTIONAL APP" napkin view very well and is easy to use.
Has a full featured demo you can try out online and as an added bonus you can email your XML to your client and they can tweak it and play with it and email it back to you without having to have a license.
There is a book called Paper Prototyping which details pen and paper drawing and what you can gain from it. I think it has a lot of benefits, particularly that you can, very early on (and easily), modify what the end result will be without much effort, and then start off on the right foot.
A basic paper version is the way to go for an initial mock-up. It's been my experience that if you do a "real" mock-up, even if you explain to the customer that it's a non-functional mock-up, they are confused when things don't work.
Bottom line: keep it as simple as possible. If it's on paper, there is no way the customer will confuse it with a working product.
For the first draft, I prefer to use graph paper (the stuff with a grid printed on it) and a pencil. The graph paper is great for helping to maintain proportions. Once the client and I have come to a conclusion I'll usually fill in the drawing with pen since pencil is prone to fading.
When I actually get around to building the digital prototype, I'll scan in the hand-drawn one and use it as a background template. Seems to work pretty well for me.
I think it is best to start with Paper/Whiteboards/White walls.
Once you have the basic structure, you can move it to Visio with the wireframe stencils
(Download a Stencil Kit)
(Visio Stencils for Information Architects).
Or you could use Denim (An Informal Tool For Early Stage Web Site and UI Design) with a tablet PC or Wacom tablets to design the GUI and run it as HTML website.
WireframeSketcher is a tool that helps quickly create wireframes, mockups and prototypes for desktop, web and mobile applications. It comes both as a standalone version and as a plug-in for Eclipse IDEs. It has some distinctive features like storyboards, components, linking and vector PDF export. Among supported IDEs are are Aptana, Flash Builder, Zend Studio and Rational Application Developer.
(source: wireframesketcher.com)
I've recenly used a windows App to prototype an application to a customer (the final interface has to be integrated into a website).
At first people thought that it would be the last version and they started to make very heavy criticism from the way controls were displayed to the words I had used (terminology and stuff) and the meeting time ended before we could even discuss the functionality itself.
That discussion dragged on for days and days until I told them that, being a mock (and not a final application) all input is welcome but we had to focus on the functionalities first and then we could move on to look and feel as well as terminology issues.
From thay meeting on I am always terrified of prototypes and mock-ups... Perhaps I should just have given them something made in visio instead.
You can try out ForeUI, it allow prototyping with different styles, what's more, it can make interactive prototype and run it in browser.
For a non-installation browser based tool you can try draft-it
It's free - and if you have a gmail account - no registration is needed.
Makes interactive/Step by Step Or Slide Show- prototypes. You can share your protoype with anyone you choose by just sending a link.
Works for us ...

Resources