App design versus web design: what designers can teach each other

We often look at application design and website design as two different, if related, fields.

The lines blur a bit with web apps (which are technically both apps and websites), but we still tend to try to compartmentalize them. Even designers who work on both kinds of designs often view them as separate things.

But there are a lot of lessons that app designers and web designers can teach each other.

Each type of design has emerged to have its own strengths and weaknesses, often complementary to the strengths and weaknesses of the other field.

Below are six lessons that app and web designers can teach each other.

1. Avoid feature creep

App designers know that extra features can quickly become your worst enemy. Keeping your app tight and lean, with only the necessary, useful features, is a key to success. If you look at the most popular apps in virtually any platform’s app store, you’ll see that the majority have a narrow focus with only the features they most need.

Ge.tt is a great example of a web app that has avoided feature creep. It lets you quickly share and publish your files online. All the features it includes are directly related to that one central purpose.

This kind of narrow focus is important for apps, because they’re often constricted by both space and usability issues. If someone is using an app on their phone, usability can be a lot more challenging. The more features you clutter their screen up with, the more difficult the app becomes to use. While some applications have figured out ways to create feature-rich applications without clutter, it’s definitely a much more challenging proposition.

Web designers, on the other hand, often try to cram as many features as they possibly can into a website. Their view is that the more features, the more useful their site will be. And while websites don’t necessarily face the same clutter challenges that small-screen apps do, that doesn’t necessarily mean a larger scope and more features are going to add value to the user.

That’s what it comes down to: value. If the features you’re adding honestly provide more value to your end user, then finding a way to incorporate them into your existing user experience is important and worth the challenge. But don’t add features for the sake of adding features.

2. You need to create something unique and fresh

App developers know that creating something that’s different from the apps currently available is one of the most important elements of creating a popular and successful app. They need something unique and fresh if they want to stand out in the marketplace. Just adding a feature or two over what the competition is providing doesn’t cut it.

PDF Expert is a great example of an app with both a fresh design and unique functionality.

Web designers haven’t necessarily caught on to this idea. A lot of them take the same things that other designers are doing, tweak a couple of things to “make it their own” and call it a day. Sure, superficially the site might look different, but it’s still the same generic layout, the same generic features, and the same generic functionality. There’s nothing different or outstanding.

Designers who want to be really successful need to think of ways to create something that’s truly different from what the competition is offering. Come up with new ideas and new approaches to common problems, rather than looking at what the other guy is doing.

Here’s an exercise for you: the next time you have a design challenge that needs to be overcome, don’t go looking for how someone else is doing it. Instead, sit down and brainstorm ten ideas for how you might address the issue, regardless of how off-the-wall or stupid they may seem. Only after you have this list are you allowed to go look at how others have solved the same challenge. See if their solutions are really better than what you came up with. Combine some of their ideas with some of your ideas and see what you can think of. This will get you in the mindset of thinking of your own, unique solutions rather than just following the status quo.

3. Use standard GUI controls and patterns

While unique is good, the best app designers also know that there are certain standard GUI elements that are expected to do certain things. They deviate from these predefined controls at their own risk. The successful apps only do things differently when it works better than the standard GUI (which isn’t often in most cases). And most of them present clear instructions when they do deviate.

The Harvest app uses standard GUI patterns while also creating a customized interface. It makes for an app that’s both easy to use and attractive.

Web designers sometimes deviate from the norm in an effort to be unique and in the process make their sites unusable. People expect certain things when they visit a website: underlined text is a link, as are buttons, navigation is obvious and usually either at the top or side of the page, and similar common constructs. When you change things from the norm, you’re more likely to confuse your visitors.

Think of the common design patterns for any given element and then decide whether deviating from that pattern is actually going to improve the user experience on your site or just make it “different”. If it’s not going to improve the UX, forget it. And if it’s not immediately obvious how something works, then add some instructions somewhere on the page so your visitors know what to do. The quickest way to lose a visitor is to make them feel stupid.

4. Create useful error messages

This lesson can go both ways. Some app designers have fantastically useful error messages, as do some websites. But there are a lot of apps out there that don’t have helpful error messages, and a lot of websites that are the same.

Even the simple addition of a search box and links to the home page and archives can make a 404 page more useful.

Useful error messages tell the user something more than just the fact that there’s been an error. In the case of an app, a more useful error message might offer ideas for how to get around the error. On a website, the error message might give the visitor some alternatives or ideas for how to overcome the error. In either case, just saying “there’s been an error” does nothing but frustrate your user. Take the time to craft error messages that actually improve the user experience and you’ll have happier users.

5. Pretty matters

This is something a lot of app designers could learn from web designers. Now, granted, there are plenty of pretty and useful apps out there. But there are also a lot of apps that have great features but are incredibly ugly and poorly designed.

App designers need to think about how they can better design the GUI of their app, rather than just using the default design scheme of the platform they’re building for. Sure, the built-in GUI elements aren’t terrible in some cases, but they’re also pretty generic. They’re not going to help your app stand out from the thousands of others in the market. Even worse is the number of apps out there that use a custom design that’s actually worse than the stock GUI.

Awesome Note is one app that definitely gets that an attractive design is important for a good app.

Consider the functions of your app and who your users are, and then think of how you can use the design to make those features easier to use and improve the perception your users have of the app itself. Say, for example, that you’re creating a vintage camera app. Using the stock GUI does nothing to reinforce the idea that the camera app does anything different than the stock app. But if you add some vintage touches and elements to the design, you’re creating an experience that’s more enjoyable for your user. They feel like they’re using an app that’s different, not just the standard camera with a few extra bells and whistles.

6. Scalability is a must

This is something that web designers have down pretty well. We know that at any point in time, our website could suddenly see an influx of traffic and need to remain usable by a larger number of people. All it takes is a bit of content to suddenly go viral, or even just get one or two retweets or shares from influential people. And to an extent, it’s not that hard for a standard website to become more scalable (it’s mostly just a matter of choosing a host who can provide servers that will scale along with your traffic).

The other issue with scalability is predicting how users will use a site or service. With most websites, this isn’t as much of an issue. But with apps, how a user interacts with the app is paramount. A small number of power users who really stretch the capabilities of the app can cause issues for other users, or just have a bad experience themselves.

Apps can be much harder to scale than websites, depending on the infrastructure. Scaling purely for an increase in the number of users isn’t that much different than scaling a website; it’s just a matter of bandwidth and processing power. Where app scalability is more difficult comes down to how individual users end up using the app.

There’s been an interesting discussion on Google+ in the past week going on between Robert Scoble and Kevin Rose. Scoble is having issues with duplicate content (“noise”) cluttering up his feed, and was publicly saying that Google+ should come up with some kind of filtering system to help weed out all this noise. Rose argues that it’s only because Scoble is a “fringe case” user, and that most people won’t run into the same issues because they don’t follow thousands of people. The question remains, should a web app like Google+ (or an app for a mobile platform) be focusing on scalability for those fringe users, or just focus on the more “average” users? It’s a debate that’s unlikely to be solved any time soon, but it is something app (and website) developers and designers need to be aware of and decide how they want to handle on a case by case basis.

Conclusion

Whether you’re a web designer or an app designer, there are things you can learn about good design from other spheres of design. Look beyond your own narrow focus at how other designers, in other fields, are handling similar problems, and then adapt those ideas to fit your own challenges.

What do you think? What other lessons can web and app designers teach each other? What lessons do both types of designers need to learn, and where can they learn them? Let us know in the comments!

I don’t understand this article. Software design principals and UX is not unique to a specific hardware platform.

Apples to apples, under the guise of apples to oranges?

http://twitter.com/cameron_chapman Cameron Chapman

While good UX is universal, there tend to be areas where app developers focus their attention that web designers might not, and vice versa. An app developer might focus primarily on function, while a web designer might focus more on form, when in reality both are vital to good UX. The emphasis is different.

The point of the article is that app developers and web designers can learn from each other about what’s important for a good overall user experience. (Of course, there’s a bit more overlap when it comes to web apps, as they’re a hybrid of an app and a website.) There are distinct differences in the development of an app or software (regardless of platform) and the development of a website that doesn’t have app characteristics, and too often those differences actually impede good user experience. By looking at what the other field is doing, both app developers and web designers can create better end products. (And of course not all developers or designers are making the mistakes outlined above, but a lot of them do.)

I hope that clears things up a bit.

http://twitter.com/jasonmulligan Jason Mulligan

I understand the gist, but I don’t understand why you mix “developer” and “designer”. Those are different jobs completely. I’m a software developer that started as a “web designer” in the 90s; what I do today would confuse and alienate “designers”.

Avangelist

I have been designing and coding apps for around 8yrs now but have still actively done web sites also, but really you’re right and wrong.
You’re right in the two are different jobs, but having an appreciation from either direction is essential. But I think what you’re talking about is more the missing cog which is the role that joins these two together. that is ultimately what a designer is.

http://twitter.com/jasonmulligan Jason Mulligan

I don’t understand this article. Software design principals and UX is not unique to a specific hardware platform.

Apples to apples, under the guise of apples to oranges?

http://twitter.com/TheJobReservoir The Jobs Reservoir

Very interesting. I think they both can learn from each other in some way.

http://twitter.com/Alexandra_qr Alexandra M.

Hey,
and I use http://snappii.com to make iPhone apps, it’s really easy and doesn’t require programming skills

http://www.onlineexpression.co.nz Karl

Informative post, thanks a lot.

http://www.iamevan.me Evan Smith

I really liked this :) I’m only sixteen but I love reading these things. I think that both would really benefit from cooperation.

http://twitter.com/jasonjflaherty Jason Flaherty

I think that is something the iPhone / iPad has over the Android Devices… A great looking standard GUI.

http://www.fipe.co.uk fipe

I’d like to think that most designers understand that it benefits them to be able to design for more than one platform (web or app). The idea in itself is not exactly mind blowing yet it’s something that some people seem to have a hard time getting to grips with.

http://www.fipe.co.uk fipe

I’d like to think that most designers understand that it benefits them to be able to design for more than one platform (web or app). The idea in itself is not exactly mind blowing yet it’s something that some people seem to have a hard time getting to grips with.

http://www.fipe.co.uk fipe

I’d like to think that most designers understand that it benefits them to be able to design for more than one platform (web or app). The idea in itself is not exactly mind blowing yet it’s something that some people seem to have a hard time getting to grips with.

http://www.fipe.co.uk fipe

I’d like to think that most designers understand that it benefits them to be able to design for more than one platform (web or app). The idea in itself is not exactly mind blowing yet it’s something that some people seem to have a hard time getting to grips with.

http://www.fipe.co.uk fipe

I’d like to think that most designers understand that it benefits them to be able to design for more than one platform (web or app). The idea in itself is not exactly mind blowing yet it’s something that some people seem to have a hard time getting to grips with.

SampeiMihira

very well conceived article! It occurred to me to deal with “both side of the moon”: sometimes app developers develop poor GUI, some others designers exceed in not-so useful but long-time required to load details…well done ! Many thanks for this interesting article.

SampeiMihira

very well conceived article! It occurred to me to deal with “both side of the moon”: sometimes app developers develop poor GUI, some others designers exceed in not-so useful but long-time required to load details…well done ! Many thanks for this interesting article.

SampeiMihira

very well conceived article! It occurred to me to deal with “both side of the moon”: sometimes app developers develop poor GUI, some others designers exceed in not-so useful but long-time required to load details…well done ! Many thanks for this interesting article.

SampeiMihira

very well conceived article! It occurred to me to deal with “both side of the moon”: sometimes app developers develop poor GUI, some others designers exceed in not-so useful but long-time required to load details…well done ! Many thanks for this interesting article.

SampeiMihira

very well conceived article! It occurred to me to deal with “both side of the moon”: sometimes app developers develop poor GUI, some others designers exceed in not-so useful but long-time required to load details…well done ! Many thanks for this interesting article.

SampeiMihira

very well conceived article! It occurred to me to deal with “both side of the moon”: sometimes app developers develop poor GUI, some others designers exceed in not-so useful but long-time required to load details…well done ! Many thanks for this interesting article.

http://www.hurleytech.com Milwaukee Web Design

In my opinion, if most developers and designers would at least follow your first and third points, the quality of websites and applications overall would improve substantially.

http://www.hurleytech.com Milwaukee Web Design

In my opinion, if most developers and designers would at least follow your first and third points, the quality of websites and applications overall would improve substantially.

http://www.hurleytech.com Milwaukee Web Design

In my opinion, if most developers and designers would at least follow your first and third points, the quality of websites and applications overall would improve substantially.

http://www.hurleytech.com Milwaukee Web Design

In my opinion, if most developers and designers would at least follow your first and third points, the quality of websites and applications overall would improve substantially.

http://www.hurleytech.com Milwaukee Web Design

In my opinion, if most developers and designers would at least follow your first and third points, the quality of websites and applications overall would improve substantially.

http://www.hurleytech.com Milwaukee Web Design

In my opinion, if most developers and designers would at least follow your first and third points, the quality of websites and applications overall would improve substantially.