Mastering Apps for Large Screen

Join us for an engaging session as we delve into the fascinating world of large screen adaptation. In this presentation, we will explore the "how" and "why" behind adapting mobile apps to large screens, equipping you with the knowledge and strategies to get started today. We will cover key concepts, crucial decisions, and effective strategies that will empower you to create seamless and immersive experiences for users on larger displays.

Furthermore, discover how this cutting-edge design language can enhance your large screen adaptations, delivering visually stunning and user-friendly interfaces. By the end of this session, you will be equipped with the insights and inspiration to take your app designs to new heights on larger screens.
#LargeScreen #Android

Transcript

1. Su Myat Tun Mastering Apps for Large Screens
2. What + Why Large Screens ?
3. Why large screens Matter for your app It is not just larger, but it’s optimal in that new context. Why adapt apps How to adapt your app design in portrait posture, ways to consider approach to adapting tablets Approaches 01 02 03 What + Why Large Screen?
4. 1. Phones, Foldables, and Tablets 2. Android 12L + Android 13 3. Optimized UXs for different forms of Input 4. Multi-tasking 280M Active large-screen devices Section #
5. Beyond mobile phones, foldables and tablets are fasted growing devices
6. It is not only about stretch to fit but also adapt new form factors
7. Large screen gives user more immersive experience
9. User expectations that change when an app is adapted to a larger screen Device Basics What + Why Large Screen?
13. User approach tablets often because it helps people get more done.
14. 1. Comfort 2. Capability 3. Efficiency 4. Immersion Design challenge for Large screens
15. 1. Comfort - less constrained by portable form; space to see more at the same time 2. Capability 3. Efficiency 4. Immersion
16. 1. Comfort 2. Capability - Ability to see more and do more 3. Efficiency 4. Immersion
17. 1. Comfort 2. Capability 3. Efficiency - Makes multitasking is easier 4. Immersion
18. 1. Comfort 2. Capability 3. Efficiency 4. Immersion
19. Way to consider when approaching adapting the composition of your mobile apps for tablets. Way to Adapt Approach
20. Expand & reorganize 01 Combine content 02
21. 21 Expand & reorganize A great option would be expand the canvas of a phone screen, and reorganize the content. This is different from simply “stretching” the mobile phone design Approach
22. 22 Combine content Based on your mobile app hierarchy, this would be essentially taking multiple screens from one user flow and present them in a single view, when on a tablet. Approach +
23. + =
24. Way to consider when approaching adapting the composition of your mobile apps for tablets. Building blocks Approach
25. 25 Layout regions Foundation for interactive experiences. Navigation, App bar,Body Building blocks
26. In tablet, move nav bar to the edges that make easier to access
27. The compositions can be helpful when defining layouts and organizing common elements involved in adapting your app. Canonical layouts Adapting
28. Layout regions How to organize the content and actions in your app to best suit the use-cases you support. Adapting
29. 1. List Detail Many layouts can be established based on the relationship between a list of items and a detailed view for a selected item.
30. 1:1 layout 1:2 layout
31. Supporting panel The supporting panel layout extends a screen which different from list and detail view layout because the primary and secondary regions represent functionally distinct panels. Adapting
33. Feed Feeds are a common layout found in news and social apps. A feed layout can be used to show different pieces of content thought cards and lists. Feeds
35. Large Screen Quality Tiers measurement
36. Large screen ready Full screen Basic support for external support devices Large Screen optimized Layout optimization Enhanced support for external input devices Tier 3: Basic Tier 2: Better Large Screen differentiated Multitasking Foldable postures Drag & drop Tier 1: Best 01 02 03 Quality Tiers
37. Large Screen Restricted
38. Keep learning How to build great Android apps for large screens and foldables on youtube goo.gle/large-screen-quality d.android.com/large-screens/gallery goo.gle/material-layout goo.gle/large-screen-layouts goo.gle/large-screen-input
39. Thank You Su Myat Tun Senior Android Developer @ Lomotif