New UI Patterns in App Design: A Blessing or a Curse?

Software design has made some interesting strides lately. It’s possible that we’re beginning to see Apple’s role in setting UI standards give way to the innovation of third party developers.

Unfortunately, this shift makes for a much more complicated scenario for developers and designers. Tempers rise, fingers are pointed and even users begin arguing about the difference between inspiration and theft. When trends are set by third party designers, is it acceptable to follow them?

Evolution

The arrival of OS X brought a complete paradigm shift for app designers. Realistic “Aqua” icons began replacing the old OS 9 cartoony style and brushed metal textures took over everything in sight.

Before long, everything in OS X started to look pretty similar, just as it had in previous Mac OS versions. All Mac apps “looked” like Mac apps, which was in effect a good thing. Users like familiarity because it makes an operating system easier to use.

This “Apple” look has gradually evolved over time with a few major jumps, defined for the most part, by Apple. The biggest influences were likely updated iterations of OS X (Jaguar, Panther, Tiger, etc.) in conjunction with new iLife versions. Each OS X brought large, overarching design changes that just about every developer was expected to follow. iLife on the other hand, represented Apple’s best UI suggestions for structuring your apps. Suggestions which developers eagerly took and users eagerly adapted to.

Take iPhoto as an example. iPhoto represents a quintessential UI pattern for OS X users. We’re familiar with the layout, the colors, and everything else that makes iPhoto look and feel like iPhoto. We’re familiar with it not only because of iPhoto itself, but because the same UI was then picked up and used in just about every app with an image gallery. When we have an app that contains lots of photos, screenshots, etc. we both want and expect it to look like iPhoto.

screenshot

iPhoto, LittleSnapper and Flickery

The same is true of Mail, not technically an iLife app but certainly designed with iLife shifts in mind. In OS X, Mail set the standard for apps that featured lots of text-based content that needed to be sorted through and read quickly. Email clients, database apps and RSS readers all directly cloned the Mail interface and used it for their own purposes.

A New Game Changer

Every now and then in this history, a third party app would come along and set a standard. We’re still seeing the effects of Quicksilver’s influence on launchers and Transmit’s influence on FTP clients.

One of the most notable of such events recently took place in the case of Tweetie/Twitter for Mac. Twitter apps were once a dime a dozen, but Loren Brichter came along and gave us one that shocked us in its beauty and simplicity. It struck out on its own, leaving behind standard UI rules that we had all grown accustomed to.

The impact of the interface can be seen in the sheer volume of users Tweetie still had right before it became Twitter for Mac. Despite the fact that development had seemingly gone stagnant, leaving Tweetie completely void of standard Twitter features that every other client possessed, thousands of people like myself found that we simply couldn’t switch to any other client!

Tweetie Takes Hold

We’re now starting to reach a point where others have decided to jump on board this wagon. The Tweetie interface that we knew and loved was perfected in Twitter for Mac, and is being directly applied to apps across several categories.

screenshot

Twitter, Sparrow and Reeder

The image above shows Twitter, Sparrow and Reeder, three apps in three different categories heavily influenced by Brichter’s work (Brichter was even directly involved with Sparrow to some extent). I can’t name any other non-Apple UI pattern that made such a quick, cross-genre leap!

Reeder Sets the Standard

The Reeder interface shown above is a scaled down view and actually wasn’t even added until fairly late in the Reeder beta stages. Before that, Reeder was busy blazing its own trail. As with Twitter for Mac, this pattern was very quickly picked up by developers and is well on its way to becoming the new standard for RSS clients, leaving behind the tired Mail metaphor.

screenshot

Reeder and its progeny

The Rise of the App Developer

Tweetie and Reeder represent an important piece of Mac history. They seem to mark a rise in the influence of third party developers as standard setters that don’t necessarily subscribe to Apple’s standard UI patterns.

Think about it, here we are faced with Lion, a brand new operating system with widespread UI implications across the board and yet I’m writing about how the App Store is looking more and more like Tweetie and Reeder every day! This is a major shift from events surrounding previous OS releases.

We can trace this back to the iPhone and its revolutionary App Store. The iPhone not only reinvigorated software development, it brought it to new heights. Developers are rockstars like never before and that has spilled over to the Mac. These days, it’s almost as if Apple is looking to what’s popular in app design and basing their new design decisions on that rather than the other way around!

The Problem

With this shift, a huge problem arises in the form of intellectually property. When Apple sets the standard for app design, developers are actually expected to follow suit. No one suggests that LittleSnapper “ripped off” iPhoto, instead we write reviews about the “gorgeous iPhoto-inspired interface.”

This is not the case when the trend setter is a third party developer. If we post a review of anything that looks remotely like Reeder, commenters immediately cry out for the blood of the offending designers, longing to see them hanged for their crimes.

The thing that needs to be decided is, where do we draw the line between theft and the widespread adoption of a new and better UI pattern? Throughout the history of software, the masses have duplicated the efforts of the innovators. But what incentive is there to innovate if any successes are immediately cloned and occasionally even improved upon, making the innovator’s app anything but unique?

What Do You Think?

This article is merely meant to point out a trend and the resulting problem, not offer solutions. Frankly, I don’t know the answer. However, I’m quite curious to hear what your solutions are.

If Sparrow really is a better way to structure an email client, at what point should competing apps meet user demands and adopt everyone’s new favorite structure? If the Reeder model has improved upon the email UI we used to use for RSS, should other developers maintain the old system or join the revolution?

Eventually, standards have to be set. You can’t really make the argument each and every app developer should create unique interfaces. Imagine if every app on your Mac presented you with a drastically innovative UI. Wouldn’t that crush usability? Don’t we love Macs because of the consistency of the design and experience? So, who should set the standards and how do we know when something is a new standard and when it is intellectual property that shouldn’t be duplicated?


  • WPHead

    If a UI works, then I don’t see why other app developers shouldn’t be allowed to make something similar too it. Sure, they can’t just copy it 1:1, but if they develop something similar to it with their own twist then I don’t see what the issue is.

    Take the Mobile RSS for Mac vs. Reeder example, Mobile RSS is using the Reeder UI with their own twist (additional grid based layout). Even if people consider it a rip-off, then still Reeder will benefit from it as people will point it out, causing potential buyers of Mobile RSS to check out Reeder (and increase Reeder’s sales). So, basically an app that is a rip-off of another app is simply marketing the original app.

    For those people who think Mobile RSS is a rip-off of Reeder, I’m sure you’re also as passionate about car manufacturers ripping off each other’s designs, electronics manufacturers doing the same, copying between clothing brands, etc., etc….

    • Tonijn

      “If a UI works, then I don’t see why other app developers shouldn’t be allowed to make something similar too it.”

      Say that to the developers @ Samsung.

  • http://www.sourcesqr.com Kelvin Lee

    Great article, particularly like the summary of the recent design trend :D

    IMOH, I think knowledge and technology is and always will be built upon the existing knowledge that works, so that they can use it as a framework, a stepping stone to leap forward to the creating new knowledge and technology. The way I see it, it’s how human evolve from a Monkey from tens of thousands of years ago. Only if we know and adopt what works, we can create something better.

    So go adopt whatever other great minds have created, then create something even better to set a new trend in return :)

  • iynque

    Wow… fantastic article. Very, very thought provoking. …thoughts without any satisfying conclusions, so that’s all I’m going to say :P

    Gold star (and a raise!) for Mr. Johnson.

    • http://www.coroflot.com/joshuajohnson Joshua Johnson

      Thanks! I really appreciate your comment.

  • Tom Fanelli

    Thought provoking article, as a product manager for a saas company, I think we are beyond people simply being able to “me too” the competition. Yes, a beautiful interface is nice, and personally I come to expect this level of interface design, otherwise I am just not satified with the use of a product. But, for a product to be truly revolutionary they have to think of a new way to apply the same elements and style everyone else is using. Apps like sparrow are finding their place because they have been able to focus on only what matters most when doing email, there was no other app similar to sparrow or as nicely designed. If you scoped out sparrow people would tell you that you are crazy because users tend to want more features not less. But they took a risk with a minimal app and it worked. I like to think that was the real challenge, not designing the graphics and interface, although they are nice.

    • Scott Danielson

      That’s actually an interesting point I hadn’t really thought of before. I personally don’t think that every app has to set out to be “revolutionary,” can just aim to do something really well.

      But I wonder if Apple’s consistency in building “revolutionary” products that push the envelope with every iteration has somewhat made us ambivalent toward anything that doesn’t break boundaries a bit.

  • http://www.mothsoftware.com Beatrix Willius

    This trend is very noticable. However, what is working and good for the iPad doesn’t mean it’s good for the Mac. Take Sparrow for instance. Why is the mailbox list hidden? To me most iPad-like applications have the similar issues:
    - What the xxx is wrong with using icons with color?
    - A toolbar belongs at the top and not at the bottom. And please not 2 toolbars (Cornerstone).
    - Why do I need to hide interface elements? We have screens now up to 2500 x something pixels nowadays.

    And let’s not talk about the eye candy from Apple’s applications. Every time I see the 3 dots in iTunes I get annoyed. What was once a guideline for interfaces is now nothing.

  • http://www.ganimecreative.com Anthony Ganime

    I agree with WPHead…Good design takes what already works and improves on it to innovate. Most usability comes down to the grid and placement of UI elements and similar icons types…but the true creativity can come from the overall feel of the App in context to it’s content, as well as “outside of the box” features/additions…

  • Sigilist

    The concept of standardizing a UI across all platforms, all programs, or all programs of a certain focus or ilk is simply the desperate attempt to re-establish group-think at best or taking the approach that one persons or entity knows what’s best for all in all situations. Does anyone else see the fallacy here. Standardizing GUIs is not about what’s best for users; its about what is best for the dominant developer who has succeeded in taking control.

    That is not innovation… in fact it’s quite the opposite of it. And copycats are nothing more than those trying to tap into the dominant developer’s following that has been led to believe that one size fits all and d.d. knows what’s best for everyone.

    Alternative UIs inside certain programs or environments are often experiments in finding something that works better for the task(s), environment, outcome, user subgroup, etc. at hand. This is where evolution takes place just like in nature… but unlike in nature, the more dominant one strain of DNA (one ideology) becomes, the less evolution takes place. And it leads to lack of innovation and ultimately stagnation… and…

    That which does not grow and change (adapt), withers and dies. This is what is happening inside Apple and its attempt to make all hardware units (tablet, notebook, desktop, etc.) environments look and work the same. And it is common for people to then not even think about it when they try to spread / extrapolate it to software… to other attacked areas of existence.

    Let the chaos reign. Let’s gene pool mix and swirl. Let developers grow a new backbone and challenge all standards. In the end, so long as such experiments are not obviously suppress through the politics of commerce and social paradigms, we’ll always see new innovation … vs. homogeny.

    Your example of iPhoto is perfect, but not in the way you intended. The iPhoto interface is not the best way to manage imagery for anyone who gets serious about it. Copying that paradigm merely dumbs down the potential and possibilities.

    • Sigilist

      Additional… the AppStore is how the dominant ideology is being enforced as so many people go for convenience and don’t seek the diversity that is out there. And the assumption that that diversity is simply being made central and easily available is false. Not to mention it is the Big Box Store paradigm for the internet. You all know that whether you’re aware of it or not. The BBS moves into your town, and suddenly a lot of small stores go out of business. It’s happening right now. It used to be that there were reference clearing houses where one could go to find listings of developers to visit… its a dying paradigm, but is it really for the better.

      Is diversity being served or suppressed? Is the view of what is really out there being limited and or controlled in a way that channels us to think we have diversity when we only have the level of diversity that a small faction thinks we should be aware of? And of course its easier for us that way, isn’t it? And I’d ask the same question about this article.

    • Joshua Johnson

      Just to clarify, in your opinion, Reeder should drop the Tweetie-like contracted interface? It’s certainly not innovative as the screenshot shows so you think it’s merely an example of “copycat” interface design that is bad for users?

    • http://www.coroflot.com/joshuajohnson Joshua Johnson

      BTW, I’m actually all for most of your conclusions. I hold innovation much higher than duplication. Better to be the trendsetter than a follower! I think shameless developers rip off hard work every day and I want no part of it. However, useful UI patterns do in fact exist and serve a purpose.

  • Dom Leca

    Really nice article. Thanks

  • http://rationalgang.com/blog/ Gil S.

    I think an important distinction can be made between Apple and third party vendors. Apple as the creator of Mac OS X sets the standard and limits for what an application can be or do. Third party vendors, on the other hand, are only specific to the application that they developed. Apple expects us to comply or at least be “inspired” by the general UI principles that are reflected in their OS. The same cannot be said of all third party developers. A further distinction is the difference between being influenced by a third party app and duplicating that app not only in its GUI but in its functionality as well.

    Sparrow and Tweetie, while featuring similar interfaces, are not the same in terms of functionality. Clones, even if there are some slight improvements, seem unjustified because these are independent developers that put much effort into creating that interface. It is easier to copy than it is to inspire. The problem is not as bad if we deal with apps that have different functions but the same does not apply to something like Mobile RSS vs Reeder. These are important differences that we need to make.

  • http://www.geekygoodness.com Curtis Hard

    To correct, Reeder was not the first RSS app to implement the 3 column layout, Caffeinated was, Caffeinated screens and mockups / alpha’s where out long before Reeder was ever started on OSX.

  • Charles

    I think the change in interface style has a lot to do with our adoption of “wide screen” displays. The Twitter/Sparrow/Reeder style of interface can be summarized as a “three column” design.

    A few years back, I would say we are still in a transition period–from standard 4:3 screens to 16:10 or 16:9 wide screens. Although it seems like a small change, fitting a 4:3 optimized UI in a 16:9 screen is just not going to work. The result is two empty space on both side of the application window. You can try to cover them up by maximizing the application window, bit it just looks awkward.

    The new “three column” design solves the widescreen problem. Its width is wider than the height. These apps should be remembered as first generation widescreen optimized apps.

  • Pingback: Best of AppStorm in August

  • http://po-com.com PO-COM

    “Reeder Sets the Standard” – i don’t really understand what this is pointing to. i don’t see anything in this app that is new or trailblazing. the only slight tweak i can see is that there is no titlebar, with just a top toolbar only. is this what the article is referring to?

    a 3-column layout is nothing new, and reeder is not the first app to use it, nor even the first rss reader to use it. i think first time i noticed a 3 column view, similar to these, was microsoft outlook – like 7 or 8 years ago? NetNewsWire was the first rss mac client i used, and it had the same “innovation” – again, years ago.

  • Sergio

    I think the way you talk about Reeder is proof that it is not a bad thing to borrow other app’s UI ideas, in fact, I would be honored to have another dev/designer to borrow my UI concept. That is, as long as he/she doesn’t clone the app functionality as well.

    Twitter, Reeder and Sparrow serve as a good example of building 3rd party consistency among themselves and that’s a good thing. Apps like Pulp show that it’s possible to build another decent RSS reader without ripping off another popular one.

    So there ya go, I’m in favor of UI consistency and having 3rd party apps to set standards too, but I don’t like complete rip-offs that include UI and functionality as well.

  • Pingback: Songsterr: Guitar Tabs on Your iPad | iPad.AppStorm

  • Pingback: Dribbble On Your Desktop with Play by Play | Mac.AppStorm

  • Pingback: Dribbble On Your Desktop with Play by Play | Apple World

  • Pingback: Dribbble On Your Desktop with Play by Play | Design City

  • Pingback: BugHerd: Beautiful Bug Tracking

theatre-aglow
theatre-aglow
theatre-aglow
theatre-aglow