Re:Designing Web Interfaces: Standard Screen Patterns
by nickb on Wednesday January 21, 2009 @12:57PM
(#443532)
Vast majority of these patterns are from desktop apps, not web apps. Majority of the example screenshots are from desktop apps as well.
While desktop and web apps share a lot of similarity, they're not the same. Web and desktop apps have different limitations and as a result have different evolutionary paths. Also, people expect them to behave differently so you can't present a UI to the user that doesn't behave like they expect it to behave.
Re:Designing Web Interfaces: Standard Screen Patterns
by fauigerzigerk on Thursday January 22, 2009 @03:08AM
(#444512)
They say "These are are broadly applicable solutions for general problems that arise in enterprise software and productivity web app design. They are not web site patterns, which have already been cataloged and explored quite thoroughly*."
You say desktop and web apps are not the same. Sure, but the question is whether their logical UI differences are determined more by their webiness/desktopness or by the fact that most desktop apps are enterprise/productivity apps whilst the majority of web apps is not.
Re:Designing Web Interfaces: Standard Screen Patterns
by yeahit on Wednesday January 21, 2009 @09:32AM
(#443237)
In my daily browsing, I often see Designs that are not on that list.
For example Hacker News is a very standard interface to me. I would call it "Forum".
"Search" looks like it has multiple columns, but in my daily experience the main characteristic of "search" is that it only has a single column of results. (Google, Amazon, Yeahit...)
Another standard Layout, I would call "Portal". Yahoo is an example. Most pages are more or less "Portal" these days. (Another name for "Portal" is "utter mess".)
Re:Designing Web Interfaces: Standard Screen Patterns
by fharper1961 on Thursday January 22, 2009 @10:29AM
(#444873)
Speaking of the design of Hacker News. I think that not having a footer that gives visual feedback that you've reached the end of the page is a glaring usability flaw!
On HN, when you scroll down page by page and you reach the bottom there is no visual indication that you are at the bottom. And since you haven't scrolled a complete page down you are forced to rescan the page to find where you left off reading.
The NYT gets this right. Their footer is big enough so that with a regular window you'll always scroll complete pages until you see the footer.
I like the HN contents, so I put up with the design flaw.
Re:Designing Web Interfaces: Standard Screen Patterns
by ibsulon on Wednesday January 21, 2009 @01:38PM
(#443583)
The author qualified this list as designs he has used for himself in enterprise software. I don't believe that he was suggesting that these were a list Set In Stone.
Re:Designing Web Interfaces: Standard Screen Patterns
by dan_sim on Wednesday January 21, 2009 @08:41AM
(#443186)
I'm no web designer expert but won't screen patterns be used as default design for web site when they shouldn't. I mean, will they be as overused as programming design patterns? Don't forget that the singleton ruined a part of my life.
Re:Designing Web Interfaces: Standard Screen Patterns
by moe on Wednesday January 21, 2009 @09:11AM
(#443211)
I think UI patterns are a good thing because there is only a small number of good solutions to any given UI-problem but an infinite number of ways to screw it up. Identifying and explaining a few proven solutions for the most common tasks can help newcomers to make good choices instead of reinventing the wheel (potentially badly) every time.
Re:Designing Web Interfaces: Standard Screen Patterns
by dan_sim on Wednesday January 21, 2009 @09:31AM
(#443236)
I'm really on both sides of the fence here. I said that because I'm currently writing an app that has a completly non-standard design because every app that does what I want uses "search/results" design but it just doesn't work (at least for me).
On the other side, I'm happy to see that maybe a bad UI idea will be standardized into something usable.
Re:Designing Web Interfaces: Standard Screen Patterns
by lacker on Wednesday January 21, 2009 @01:05PM
(#443543)
Like design patterns, you should learn them so you can both use them intelligently when appropriate, and make fun of people who overuse Singleton or the "Column Browse" template.
Re:Designing Web Interfaces: Standard Screen Patterns
by sethg on Wednesday January 21, 2009 @03:27PM
(#443741)
I think when a pattern is used widely enough, it just fades into the background; when the navigation tools are in their expected places, then the users who have gotten used to the pattern can spend more time paying attention to the content. Which is what we want, right?
Re:Designing Web Interfaces: Standard Screen Patterns
by timf on Wednesday January 21, 2009 @11:36AM
(#443412)
I started reading this book on Oreilly's Safari service a couple days ago, recommend it (nb: I am a remote services/concurrency guy learning UI principles/techniques, not an experienced designer).
Re:Designing Web Interfaces: Standard Screen Patterns
by dantheman on Wednesday January 21, 2009 @08:50AM
(#443195)
I think this is great. Excellent work. I think we need more work identifying useful patterns to: 1. make it easier for users & 2. save development time and effort on standard views.
Re:Designing Web Interfaces: Standard Screen Patterns
by balsamiq on Wednesday January 21, 2009 @03:05PM
(#443721)
Hi ph0rque, funny you should mention that...Theresa Neil, who put the patterns together, was very instrumental on helping me get the new mockupstogo.net site together (I thank her here: http://www.balsamiq.com/blog/?p=617). She was planning on putting all of the patterns on Mockups To Go as well, but if someone wanted to do it for her I'm sure she wouldn't mind... :)
Re:Designing Web Interfaces: Standard Screen Patterns
by bmelton on Wednesday January 21, 2009 @12:51PM
(#443524)
As a recent Django convert, I think that'd be insanely useful. Shoot me a line if you'd like some assistance (barry.meltonATgmail)
Having played around with a few of the pluggables recently, are their standards for block areas? E.g., in some of the pluggables I've used, they use "TITLE" for the HTML page title element, while some have used "PAGETITLE" and another used "HEADTITLE".
Re:Designing Web Interfaces: Standard Screen Patterns
by dustineichler on Wednesday January 21, 2009 @02:46PM
(#443687)
I'm not a UI guy, but I found this incredibly useful. It'd be interesting to find the anti-pattern in all this and implement that instead. Seems ironic to standardize such a creative aspect of development.
While desktop and web apps share a lot of similarity, they're not the same. Web and desktop apps have different limitations and as a result have different evolutionary paths. Also, people expect them to behave differently so you can't present a UI to the user that doesn't behave like they expect it to behave.
You say desktop and web apps are not the same. Sure, but the question is whether their logical UI differences are determined more by their webiness/desktopness or by the fact that most desktop apps are enterprise/productivity apps whilst the majority of web apps is not.
For example Hacker News is a very standard interface to me. I would call it "Forum".
"Search" looks like it has multiple columns, but in my daily experience the main characteristic of "search" is that it only has a single column of results. (Google, Amazon, Yeahit...)
Another standard Layout, I would call "Portal". Yahoo is an example. Most pages are more or less "Portal" these days. (Another name for "Portal" is "utter mess".)
On HN, when you scroll down page by page and you reach the bottom there is no visual indication that you are at the bottom. And since you haven't scrolled a complete page down you are forced to rescan the page to find where you left off reading.
The NYT gets this right. Their footer is big enough so that with a regular window you'll always scroll complete pages until you see the footer.
I like the HN contents, so I put up with the design flaw.
On the other side, I'm happy to see that maybe a bad UI idea will be standardized into something usable.
Having played around with a few of the pluggables recently, are their standards for block areas? E.g., in some of the pluggables I've used, they use "TITLE" for the HTML page title element, while some have used "PAGETITLE" and another used "HEADTITLE".