Differences Between Designing a Web App and a Desktop App
What is the last time that you downloaded a Desktop App? Probably it’s been a while. It seems that if we can find things we need and get stuff done in a browser, there’s no need to download an App to our desktop.
On the flipping side, you may still have a few Desktop Apps lined up on your deck, let me take a guess here:
Slack — to keep in touch with your work colleagues on a daily basis;
Sketch or any design software — if you’re a designer;
Evernote — if you like taking notes and documenting thoughts.
Intriguingly, patterns reveal behind the action of downloading a Desktop App. First and foremost, users who downloaded Desktop Apps are more likely to be converted to active users of those Apps. Also, some Desktop Apps can support full features even when they’re offline. Last but least, in general, Desktop Apps are more stable and reliable.
The above patterns lead to a shared expectation for both Web and Desktop App users: an App should look and behave the same way no matter it is within a web browser or on a desktop screen.
However, when it comes to aligning designs and maintaining a consistent user experience across web and desktop platforms, a couple of things need to be considered in its designing phase. It calls for not only UI adjustments but also a thorough understanding of the affordances of each platform where the App runs.
1. Understand platform guidelines
Most Web Apps look identical on both Mac and Windows, but Desktop Apps might look and feel different on Mac and Windows. It is because Desktop Apps on Mac are subject to MacOS Human Interface Guidelines and Apple already specified what UI elements designers should use for specific user interactions. For example, standard UI elements like dialogs, popovers, and tooltips(help tags) are not entirely customizable on Mac.
However, on Windows, UI elements are entirely customizable hence designers have more freedom playing around with styles like when they are designing Web Apps. It’s still better to double check and make sure the UIs are following standard UI patterns from UWP(Universal Windows Platform) guidelines to avoid confusing users.
2. Multi-task user interactions
In a Web App, users can create multiple tabs in the browser to do several tasks. All the tab windows line up in a horizontal order to make it easy for eye-scanning. Whereas in a Desktop App, users will face either several windows or several overlay modals in one window to do tasks. The challenge here for designing on Desktop Apps is to help users find the window they need and bring the right window foreground during multi-tasking.
3. Platform-specific touch interactions
MacBook Pro(2016) supports a touch bar as the extension of the current keyboard, and Windows Surface Book(2015) makes the main screen touchable. The capabilities on the hardware side of Mac and Windows have enriched screen-based interactions in both Web and Desktop Apps. Our Web Apps could become more like mobile Apps, and our Desktop Apps could be more tangible when we interact with the UI elements on a screen.
Summary
Personally, I see the merging trend of unified designs on both Web and Desktop Apps. It’s interesting to see how screen interactions become more diverse with touchable desktop screens like Windows 10 and voice-driven interfaces like Amazon Show. I guess that’s also the fun part of picturing a new world of future software products!