Tetap teratur dengan koleksi
Simpan dan kategorikan konten berdasarkan preferensi Anda.
Aplikasi adalah salah satu platform utama di Wear OS. Aplikasi berbeda dengan
detail atau kartu, yang merupakan representasi konten aplikasi yang mudah dilihat.
Aplikasi menampilkan informasi yang lebih lengkap dan mendukung interaktivitas yang lebih beragam. Pengguna sering
memasuki aplikasi dari platform lain, seperti notifikasi, widget tampilan jam, Kartu,
atau voice action.
Prinsip
Perhatikan prinsip-prinsip berikut saat mendesain aplikasi:
Fokus: Berfokus pada tugas penting untuk membantu orang menyelesaikan berbagai hal dalam
hitungan detik.
Dangkal dan linear: Hindari membuat hierarki yang lebih dalam dari dua tingkat.
Usahakan untuk menampilkan konten dan navigasi secara inline jika memungkinkan.
Scroll: Aplikasi dapat di-scroll. Ini adalah gestur alami bagi pengguna untuk melihat
lebih banyak konten di smartwatch.
Panduan
Ikuti panduan ini saat mendesain aplikasi.
Mengoptimalkan tata letak vertikal
Sederhanakan desain aplikasi menggunakan tata letak vertikal, yang memungkinkan pengguna
men-scroll ke satu arah untuk melihat konten.
check_circle
Anjuran
Sasaran aplikasi ini adalah mengarahkan pengguna dari titik A ke titik B.
cancel
Larangan
Jangan menggunakan scroll vertikal dan horizontal, karena dapat
membuat pengalaman aplikasi Anda membingungkan. Pengecualian adalah beberapa kasus penggunaan
tertentu, termasuk pemutaran media, yang dapat mendukung scroll vertikal dan
horizontal.
Menampilkan waktu
Pengguna cenderung menghabiskan lebih banyak waktu dalam aplikasi, jadi penting untuk memberikan
akses cepat ke waktu.
check_circle
Anjuran
Menampilkan waktu di bagian atas aplikasi, karena hal ini memberikan tempat yang konsisten bagi pengguna untuk melihat waktu.
cancel
Larangan
Menampilkan waktu dalam dialog, layar konfirmasi, atau pemilih, karena pengguna cenderung hanya menghabiskan beberapa detik pada layar tersebut.
Untuk mengetahui informasi selengkapnya tentang desain dan penggunaan, lihat
Teks waktu.
Titik entri inline yang dapat diakses
Pastikan semua tindakan ditampilkan inline, menggunakan ikon dan label yang jelas untuk
aksesibilitas. Ini termasuk titik entri ke setelan dan preferensi.
check_circle
Lakukan
Menggunakan ikon dan label jika memungkinkan.
cancel
Larangan
Mengandalkan ikon saja untuk meminta pengguna mengambil tindakan.
Mendorong tindakan utama
Bantu pengguna mengambil tindakan dalam aplikasi Anda dengan menarik tindakan utama ke bagian atas
aplikasi. Mengangkat tindakan utama yang tidak ambigu ke bagian atas aplikasi.
Menggunakan label untuk mengorientasikan pengguna
Untuk aplikasi yang lebih panjang, bantu orientasikan pengguna dengan label saat mereka men-scroll
konten.
check_circle
Lakukan
Menggunakan batas bagian, label, dan petunjuk lainnya untuk mengatur konten serta membantu mengorientasikan pengguna saat mereka men-scroll tampilan yang lebih panjang dengan konten campuran.
cancel
Larangan
Menambahkan label untuk aplikasi yang berisi satu jenis konten.
Menampilkan scrollbar
Menampilkan scrollbar jika seluruh tampilan di-scroll, seperti yang ditunjukkan pada gambar berikut.
Untuk mengetahui informasi selengkapnya, lihat Indikator posisi.
Penampung konten
Lihat contoh penampung konten berikut.
Gambar 1. Penampung dengan tinggi tetap.
Gambar 2. Penampung dengan tinggi variabel.
Gambar 3. Penampung dengan tinggi dan lebar yang lebih besar dari area pandang.
Gambar 4. Penampung dengan penomoran halaman.
Gambar 5a Halaman konten yang memenuhi dimensi layar penuh dan
telah diberi penomoran halaman secara vertikal.
Konten dan contoh kode di halaman ini tunduk kepada lisensi yang dijelaskan dalam Lisensi Konten. Java dan OpenJDK adalah merek dagang atau merek dagang terdaftar dari Oracle dan/atau afiliasinya.
Terakhir diperbarui pada 2025-07-27 UTC.
[[["Mudah dipahami","easyToUnderstand","thumb-up"],["Memecahkan masalah saya","solvedMyProblem","thumb-up"],["Lainnya","otherUp","thumb-up"]],[["Informasi yang saya butuhkan tidak ada","missingTheInformationINeed","thumb-down"],["Terlalu rumit/langkahnya terlalu banyak","tooComplicatedTooManySteps","thumb-down"],["Sudah usang","outOfDate","thumb-down"],["Masalah terjemahan","translationIssue","thumb-down"],["Masalah kode / contoh","samplesCodeIssue","thumb-down"],["Lainnya","otherDown","thumb-down"]],["Terakhir diperbarui pada 2025-07-27 UTC."],[],[],null,["# App design principles\n\nAn app is one of the primary surfaces on Wear OS. Apps are different from\ncomplications or tiles, which are glanceable representations of app content.\nApps display more information and support richer interactivity. The user often\nenters an app from another surface, such as a notification, complication, Tile,\nor voice action.\n\nPrinciples\n----------\n\nKeep the following principles in mind when designing apps:\n\n- **Focused:** Focus on critical tasks to help people get things done within\n seconds.\n\n- **Shallow and linear:** Avoid creating hierarchies deeper than two levels.\n Aim to display content and navigation inline when possible.\n\n- **Scrolling:** Apps can scroll. This is a natural gesture for users to see\n more content on the watch.\n\nGuidelines\n----------\n\nFollow these guidelines when designing apps.\n\n### Optimize for vertical layouts\n\nSimplify your app's design by using vertical layouts, which allow users to\nscroll in a single direction to move through content. \ncheck_circle\n\n### Do\n\nThis app's goal is to take the user from point A to point B. \ncancel\n\n### Don't\n\nDon't use both vertical and horizontal scrolling, as this can make your app experience confusing. The exception is some specific use cases, including media playback, which can support both vertical and horizontal scrolling.\n\n### Show the time\n\nUsers tend to spend more time in apps, so it's important to provide\nquick access to the time. \ncheck_circle\n\n### Do\n\nDisplay the time at the top of the app, as this provides a consistent place for the user to view the time. \ncancel\n\n### Don't\n\nDisplay the time in a dialog, confirmation screen, or picker, as users are likely to spend only a few seconds on those screens.\n\nFor more information about design and usage, see\n[Time text](/training/wearables/compose/time-text).\n\n### Accessible inline entry points\n\nEnsure all actions are displayed inline, using clear iconography and labels for\naccessibility. This includes entry points to settings and preferences. \ncheck_circle\n\n### Do\n\nUse both icons and labels when possible. \ncancel\n\n### Don't\n\nRely solely on icons to prompt the user to take action.\n\n### Elevate primary actions\n\nHelp users take action in your app by pulling primary actions to the top of the\napp. Elevate non-ambiguous primary actions to the top of the app.\n\n### Use labels to orient users\n\nFor longer apps, help orient the user with labels as they scroll through the\ncontent. \ncheck_circle\n\n### Do\n\nUse section breaks, labels, and other cues to organize content and help orient users as they scroll through longer views with mixed content. \ncancel\n\n### Don't\n\nAdd a label for apps that contain a single content type.\n\n### Show the scrollbar\n\nShow the scrollbar if the entire view scrolls, as shown in the following image.\nFor more information, see [Position indicator](/training/wearables/compose/position-indicators).\n\nContent containers\n------------------\n\nSee the following examples of content containers.\n\n\n**Figure 1.** Container of fixed height. \n\n**Figure 2.** Container of variable height.\n\n\u003cbr /\u003e\n\n\n**Figure 3.** Container of height and width greater than the viewport. \n\n**Figure 4.** A paginated container.\n\n\u003cbr /\u003e\n\n\n**Figure 5a.** Content pages that take the full dimension of the screen and are\npaginated vertically. \n\n\u003cbr /\u003e\n\n| **Note:** Users find vertical layouts much easier to navigate than paginated UI's. Paginated UI's are best for situations when the user needs to navigate content using gross gestures, such as when working out or on the go. Because of this, they are generally used in workout and media app UIs."]]