In this video, Diane Cronenwett describes what native apps are and provides examples of native apps in action.
- When thinking about your multi device design project understanding the underlying technology is helpful when starting to define your design. Your project may be built on a specific platform like iOS, watchOS, tvOS, Apple's native platforms for phone watch and TV, or Google's Android platforms. Native applications have design guidelines for the specific platform they were developed on. For example: Apple, Google and Windows all have design guidelines for interaction patterns and visual design to help unify the experience and create a consistent and familiar experience for the user regardless of which app is used on the respective platforms.
Knowing if the design is going to be native will help you as a designer to formulate your design using the existing platform paradigms. Google's material design patterns uses density independent pixels to define layouts that might be scaled to various resolutions across devices. You'll want to take this into account before starting your design so you can make sure your design will look the way you want it to across all devices. For example: If you look at the iOS native apps for Airbnb and Trulia, they look just like the desktop versions I showed earlier.
The difference is they were designed using native iOS platform paradigms. Some of the advantages of using native applications are taking advantage of the native device capabilities. There are a lot of powerful features built into the devices that can be taken advantage of, like GPS, Bluetooth, camera, and push notifications. Personalization: Native apps can use your location data and other bits of information in personalized content. For example: Sometimes you may notice that your searches will be scoped to your location by default or you might receive a text message from retailers letting you know when your item is shipping.
Consistent paradigms: If you're using a platform specific guidelines, users will intuitively understand how to use your product. You don't have to reinvent the wheel for most standard interactions like a swipe behavior or a tap on an icon. For example: The page controls for iOS are similar to the tvOS page controls to maintain a consistent expectation of how many pages there are to show and which page in the sequence the user is looking at. These kind of controls can make your life easier so you're not recreating them.
Native apps are faster. Using native app technology creates a faster experience. If you've ever used your responsive web app on your mobile device, you'll notice that sometimes takes longer for a tap or a swipe to register. From a design perspective there isn't necessarily anything to design for, but speed is something to be aware of. Some of the disadvantages of using native applications are, maintaining multiple platforms. One of the common disadvantages noted for native app development is that it can be an overhead for companies to have to maintain different code basis for each app.
For example: Mac apps don't work on Android platforms and vise versa. There are development tools that can help with the cross platform development, but maintenance is a consideration. Native apps are accessed from app stores. Once you create your app, you have to go through the process of releasing it through the app store and you have no way of knowing how many people download it. This process can create a barrier to entry for having an app that users have to download before experiencing your product.
And even more so if your app has a cost. In general you may want to consider a native app if you want to take advantage of the native functionality and platform paradigms for the device. You can have native apps in conjunction with responsive web app also, if it makes sense for your use cases.
- Principles for multidevice design
- Responsive design in action
- Designing for multiple devices using native paradigms
- Designing mobile or tablet interfaces
- Designing for a watch, a TV, or for voice
- Creating an information architecture diagram
- Using Sketch to design your mobile experience
- Prototyping with InVision
- Exploring Bootstrap and Foundation