Layar & Tata Letak

Header dan Menu Mengapung dalam Kontainer Kaca Berembun Menyorot Header dan menu mengapung dalam wadah kaca berbentuk bulat yang… tajuk kaca

Header dan menu mengambang dalam wadah kaca berbentuk bulat yang menghilang saat Anda menggulik. Menggunakan efek kaca berembun (blur backdrop + permukaan semi-transparan). Meredup saat Anda menggulik ke bawah halaman.

  • tajuk kaca
  • navigasi
  • kontainer
  • desain
Modal Hasil Setelah Impor Setelah mengimpor kontak, sebuah modal animasi menunjukkan your… impor

Mengganti tiga permukaan post-import yang berlangsung bersamaan (toast, tour otomatis, avatar yang muncul) dengan satu modal yang tenang. Delay 3 detik memungkinkan avatar berada dalam keadaan stabil sebelum modal muncul. Tur ini hanya dimulai jika pengguna secara eksplisit mengizinkan.

  • impor
  • orientasi
  • modal
  • statistik
  • tour
  • bahasa
Baris Judul Hero pada Gradien dengan Tombol Sembunyikan Karya Seni Baris judul hero duduk di atas Saropa gradien dengan… pahlawan

State toggle disimpan per perangkat daripada direset saat peluncuran, sehingga siapa pun yang memilih tampilan daftar kompak tetap mempertahankan tata letak tersebut di setiap layar tanpa perlu menghilangkan kembali gambar setiap kali.

  • pahlawan
  • gradien
  • gulung
  • beralih
  • preferensi
Grids Menyesuaikan Jumlah Kolom untuk Ukuran Teks yang Besar Tata letak grid mengurangi jumlah kolomnya ketika ukuran teks sistem… aksesibilitas

Jumlah kolom dihitung ulang dari faktor skala teks aktif daripada titik break perangkat tetap, sehingga telepon dan tablet dengan pengaturan aksesibilitas yang sama keduanya tetap mempertahankan lebar cukup per sel untuk label penuh.

  • aksesibilitas
  • skala teks
  • kolom
  • responsif
  • jaringan
Karya seni Hero dalam kartu inset yang runtuh saat Anda menggulir Karya seni layar berada dalam kartu inset berbentuk bulat yang runtuh… pahlawan

Tinggi kartu diatur berdasarkan offset gulir, bukan durasi animasi tetap, sehingga penyusutan mengikuti gerakan jari secara tepat, dan umpan balik haptik aktif sekali tepat saat kartu melekat pada bar header.

  • pahlawan
  • menggulir
  • gulung
  • animasi
  • kartu
  • haptik
Karya seni layar instan tanpa pop-in Karya seni Hero dan gambar layar dimuat dari cache saat diulang… kinerja

Gambar yang telah didekode tetap berada di dalam cache memori yang dikunci berdasarkan jalur aset, sehingga kembali ke layar menghindari langkah dekode sepenuhnya, bukan mengambil ulang dan merender ulang seni dari hard disk.

  • kinerja
  • cache gambar
  • pahlawan
  • memuat
Dukungan tata letak Kanan-Ke-Kiri pada Layar Hero Tiang pahlawan menggunakan pemosisian terarah sehingga layarnya terletak… rtl

Elemen masthead membaca arah teks lingkungan daripada mengkodekan kiri, sehingga judul, kontrol kembali, dan artwork mencerminkan dengan benar daripada hanya membalik teks sementara ikon tetap tertancap di kiri.

  • rtl
  • tata letak
  • aksesibilitas
  • pahlawan
  • internationalisasi
Bagian header yang dapat diperluas pada enam layar Klik huruf header untuk menyembunyikan/menampilkan kelompok pada Organizations,… alur kerja

Mengetuk header huruf sekarang mengaktifkan visibilitas setiap kontak di bawah huruf tersebut, memberikan cara untuk menggulung daftar alfabetik panjang di enam layar berbasis data tanpa menggulir melewati entri berulang kali.

  • alur kerja
  • interaksi
Tier panjang narasi dengan distorsi visual Tiga ikon berwarna (brief/standard/full) dengan style… narasi

Mengganti kotak centang dengan ikon berwarna dan tingkatan bernama memberikan identitas visual yang berbeda untuk setiap panjang narasi, membuat opsi yang dipilih terlihat jelas sekaligus daripada memerlukan tanda centang untuk mengonfirmasi.

  • narasi
  • ux
Narasi Memorial dengan Judul dan Pemutusan Narasi memorial mencakup judul ("Dalam Kenangan …") dan … narasi

Teks memorial yang dihasilkan dimulai dengan judul formal dan berubah menjadi paragraf terpisah setiap kali materi topik berubah (karier, keluarga, warisan), alih-alih berjalan sebagai satu blok padat.

  • narasi
  • peringatan
Akses mudah untuk menambahkan detail cerita kontak Profil kontak menampilkan tautan yang membantu untuk menambahkan cerita … antarmuka pengguna

Kontak dengan narasi tipis atau kosong kini menampilkan tautan call-to-action yang dapat diklik secara langsung, mengarah langsung ke editor untuk menambahkan konten cerita, bukan memaksa pengguna mencarinya di pengaturan.

  • antarmuka pengguna
  • narasi
  • cta
Badge Penghargaan kini permanen pada kontak yang meninggal Lencana kematian ditampilkan sepanjang tahun pada kontak peringatan, bukan hanya… kontak

Indikator pengingat kini tetap terlihat pada avatar kontak yang sudah meninggal secara terus-menerus, bukan hanya muncul sekitar hari ulang tahun kepergiannya setiap tahun.

  • kontak
  • avatar
  • peringatan
  • meninggal
Peta Muat Lebih Cepat Tile peta muat dengan latar belakang gradien yang halus, membuat peta… peta

Placeholder gradien sesuai dengan dimensi grid tile dan menghilang perlahan saat gambar nyata mulai masuk, menyembunyikan perjalanan jaringan yang diperlukan oleh penyedia peta sebelum pixel tiba.

  • peta
  • memuat
  • ux
Kode QR Sematkan Tanda Saropa QR codes display Saropa brand mark in navy at center with … merek

Tanda navy Saropa berada di tengah kode QR sementara redundansi perbaikan kesalahan pada pola sekitarnya menjaga kode tetap dapat di-scan meskipun logo mengcover sebagian dari kode tersebut.

  • merek
  • qr-kode
  • berbagi
Bagian bantuan dapat dilipat dan mengingat status Bagian bantuan dapat dilipat, berkode warna, dan mengingat… navigasi

Setiap bagian bantuan memiliki warna yang berbeda dan mengingat apakahnya dibiarkan terbuka atau tertutup antar kunjungan, sehingga layar bantuan yang hanya dibaca sebagian dapat dilanjutkan dari tempat sebelumnya.

  • navigasi
  • bantuan
  • personalisasi
  • collapseable
Layar selamat datang memandu pengguna baru dan pengguna yang memperbarui Layar selamat datang bergerak dengan transisi halus memandu… navigasi

Alur selamat datang yang terpisah untuk instalasi baru versus pembaruan versi berarti pengguna kembali melihat apa yang berubah untuk mereka secara spesifik, bukan tutorial pertama yang umum ditujukan untuk pengguna baru.

  • navigasi
  • orientasi
  • animasi
  • rintisan
  • meningkatkan
Layar selamat datang pertama bergerak dengan nama merek merek Huruf-huruf jatuh dengan efek berwarna-warni per-glyph saat peluncuran animasi

Setiap huruf dari logo merek bergerak secara individual dengan gradasi warna yang melewati seluruhnya, mengubah momen startup yang dingin menjadi aksen merek yang dinamis, bukan layar logo statis.

  • animasi
  • orientasi
  • visual
Modal selamat datang upgrade satu kali Pengguna yang memperbarui pada masa Isar melihat pengantar penjelasan pada pertama… orientasi

Modal hanya muncul sekali, dikunci untuk mendeteksi migrasi yang selesai dari penyimpanan engine lama Isar, sehingga memastikan pengguna pembaruan bahwa data mereka tetap aman tanpa berulang pada setiap peluncuran berikutnya.

  • orientasi
  • meningkatkan
  • ux
Opsi Landscape pada Ponsel Ponsel dapat berputar ke tampilan landscape (default off) saat… tata letak

Ponsel beralih ke mode portrait hanya karena fitur ini kurang teruji secara menyeluruh pada bentuk faktor perangkat genggam, sementara tablet dapat berputar bebas secara default karena layar yang lebih besar sudah mampu menangani orientasi yang berbeda dengan baik.

  • tata letak
  • rotasi
  • aksesibilitas
Layar Tentang: Cerita misi dan nama Saropa Dua bagian baru pada Layar Tentang — Our Mission (pilar-pilar … merek

Bagian Our Mission menyatakan empat pilar yang mendorong pengembangan aplikasi, sementara cerita penamaan menghubungkan identitas aplikasi dengan tradisi Sikh yang istilah Saropa berasal darinya.

  • merek
  • memercayai
  • transparansi
Pengelolaan telepon dan email yang lebih mudah pada tablet Pada tablet landscape, baris telepon dan email disusun dalam 2… tablet

Tata letak dua kolom diatur oleh deteksi orientasi lanskap, bukan hanya ukuran layar, sehingga tablet yang dipegang tegak masih menggunakan daftar satu kolom.

  • tablet
  • organisasi
Tab Beranda menyesuaikan dengan bagian yang dapat dilipat Organisasi dengan menyusutkan bagian; tablet menampilkan lebar lebih. tab-beranda

State yang dikemas diingat per bagian, sehingga bagian yang ditutup di ponsel tetap ditutup setelah beralih ke tablet atau memutar perangkat.

  • tab-beranda
  • navigasi
  • collapseable
  • bagian
  • tablet
  • responsif
Header tablet meletakkan identitas dan tindakan bersama. Identitas kiri dengan tombol aksi di kanan. tablet

Pindah tindakan ke tepi belakang menjaga mereka dalam jangkauan jari pada tablet lanskap lebar, di mana tata letak hanya di depan akan meninggalkan tombol terpisah ke satu sisi.

  • tablet
  • pahlawan
  • tajuk
  • tata letak
Setiap Bagian Home Dapat Menyusut Klik pada judul bagian untuk menyembunyikan atau menampilkan bagian tersebut. Darurat,… organisasi

State pengekspansian bertahan per bagian, bukan berulang saat aplikasi dijalankan kembali, sehingga tab rumah yang diatur sekali tetap diatur seperti yang ditinggalkan.

  • organisasi
  • kelancaran penggunaan
Header Kontak mereorganisasi pada tablet landscape Pada tablet landscape, foto dan nama kontak Anda muncul… tablet

Penataan tata letak landscape menggeser identitas dan aksi cepat ke dalam satu garis horizontal daripada mengatur mereka secara bertumpuk, mengembalikan ruang vertikal yang sebelumnya dibiarkan kosong oleh tata letak potret.

  • tablet
  • responsif
Tata letak detail kontak yang lebih bersih Bagian kontak lebih mudah dinavigasi dengan disederhanakan… transisi layar

Mengurangi pengelompokan bersarang pada layar detail berarti jumlah sentuhan yang diperlukan untuk mencapai bidang tertentu lebih sedikit, mengurangi seberapa jauh gulirannya yang memisahkan bagian-bagian terkait.

  • transisi layar
  • detail-tampilan
  • penyederhanaan
Bagian kontak yang dapat dilipat dengan status Bagian kontak dilipat dan mengingat status di … detail-kontak

State collapse disimpan per kontak dan per sesi, sehingga membuka kembali kontak nanti menunjukkan bagian-bagian secara tepat seperti yang ditinggalkan, bukan mengembalikan ke keadaan penuh terbuka.

  • detail-kontak
  • organisasi
  • ketekunan

Kontak Anda adalah sumber hidup. Bolehkan itu menjadi begitu.

Dapatkan semua fitur Screens & Layouts di atas — secara gratis untuk penggunaan pribadi, dirancang untuk privasi, dan siap digunakan segera setelah instalasi.