Palet warna
Untuk palet warna Reka Bentuk Bahan, Google lebih suka sistem 'dua warna' dengan varian:
Jadi sebagai contoh, seperti dalam foto ini. Warna utama anda berwarna ungu, dengan warna sekunder anda seperti sian. Dan untuk elemen lain dari UI anda, anda akan menggunakan varian warna ungu dan sian, jadi semuanya menyatu.
Ini Penyunting Reka Bentuk Bahan adalah alat yang sangat berguna yang membantu anda mengumpulkan variasi warna. Anda juga boleh mencari inspirasi dari agensi reka bentuk UI / UX profesional seperti Tanah liat , atau senarai ini syarikat reka bentuk web bertaraf tinggi pada tahun 2019.
Susun atur grid responsif
Memahami susun atur grid responsif bermaksud memahami bagaimana ketumpatan piksel dan penyesuaian skrin automatik berfungsi. Sebahagian besarnya, rata-rata DPI telefon Android adalah antara 300 hingga 480 DPI.
Dengan itu, layar 300 DPI biasanya dapat memaparkan hingga 4 lajur:
Manakala layar dengan 600 dpi akan memaparkan hingga 8 lajur.
Di antara setiap lajur adalah 'selokan', pada dasarnya kawasan yang memisahkan setiap lajur. Oleh itu, pada telefon bimbit dengan 360dp, setiap selokan sekitar 16dp.
Memahami DPI skrin
Semasa merancang UI, sama ada UI sistem atau UI aplikasi anda, anda perlu mengambil kira ketumpatan piksel yang berlainan dengan saiz telefon yang berbeza. Berikut adalah carta resolusi skrin dan ketumpatan piksel yang paling biasa:
Jadi sebagai aturan praktis, ketika merancang tema atau aplikasi 'global', dan tidak memfokuskan diri pada membuat tema untuk satu peranti, anda harus mulai dengan kepadatan terendah. Ini kerana jika anda memulakan reka bentuk pada 1x, anda hanya perlu melakukan pengukuran dalam piksel, dan nilainya akan tetap sama di seluruh DP.
Walau bagaimanapun, jika anda merancang 3.5x, anda perlu membahagikan semua nilai dengan 3.5 untuk menyesuaikan diri dengan kepadatan lain, dan kemudian ia menjadi sakit kepala dalam mengira beberapa nilai DP.
Petua tambahan untuk reka bentuk Android 10 UI / UX
Sekiranya anda memerlukan warna khusus untuk komponen tema seperti radio, butang, kotak pilihan, dan lain-lain, anda semestinya tidak gunakan drawables untuk menunjukkan pelbagai keadaan ( dicentang, diklik, dll) . Kerana apabila anda menggunakan drawables, anda kehilangan kesan Reka Bentuk Bahan asli (seperti riak) yang dikemas kini Google secara meluas dalam Android 9 dan Android 10.
Semasa bekerja dengan Reka Bentuk Bahan, Google menyertakan banyak barang yang dapat anda manfaatkan, dan mereka akan mengalir dengan lebih semula jadi dengan UI / UX anda.
Jadi sebagai contoh, berikut adalah beberapa kata kunci untuk komponen bertema dengan elemen Reka Bentuk Bahan terbina dalam, dan aplikasi atau UI / UX anda masih akan menikmati tingkah laku sistem asli dan keadaan UI.
Butang dengan android warna tersuai: backgroundTint = '@ color / red' ----- Butang Radio dengan android warna tersuai: buttonTint = '@ color / red' ----- Imej & Ikon android: drawableTint = '@ color / merah '----- ProgressBar dengan android warna tersuai: progressTint =' @ color / red '
Untuk menunjukkan bayangan sederhana di bawah komponen seperti dalam mod paparan kad, anda hanya perlu menggunakan sifat ketinggian.
android: ketinggian = '1dp'
Penggabungan tag dan sifat induk sangat berguna, untuk memberi anda kawalan XML yang lebih baik dan terkawal.
Perubahan susun atur animasi benar-benar dapat meningkatkan UX anda, dan hampir semua ViewGroup akan menghormati ini. Oleh itu, setiap kali terdapat perubahan dalam hierarki pandangan, ia akan disertakan dengan animasi. Dengan sedikit pengetahuan, anda juga boleh merancang kesan peralihan tersuai .
android: animateLayoutChanges = 'benar'Teg android Pembangunan 4 minit membaca
