Bagaimana Reka Bentuk UI Aplikasi Android Itu Tidak Menyedut

Pengaturcara dan pemaju umumnya tidak pereka - ini diterima secara meluas sebagai benar. Pemaju cenderung untuk memberi tumpuan kepada membuat kerja aplikasi - pereka memberi tumpuan kepada menjadikan aplikasinya secara estetik menarik . Tetapi kenapa pemaju tidak melakukan perkara yang sama?

Kembali pada hari itu, ketika halaman arahan percikan animasi dan susun atur mewah adalah sesuatu, maka pasti, masuk akal untuk menyewa seorang pereka profesional. Tetapi trend hari ini adalah minimum - atau sekurang-kurangnya lebih mudah dipermudahkan.

Izinkan saya memberikan contoh anekdot - seketika, seseorang meminta saya membuat skrin percikan untuk perisian PC mereka. Jadi saya pergi semua - mengeluarkannya pada kertas lakaran, mengimportnya ke PhotoShop, mencipta banyak garis dan kesan neon mewah. Ia boleh menjadi kertas dinding desktop, bukannya skrin percikan. Maksudnya saya buat reka bentuk yang sangat menarik dan rumit untuk mereka.

Seperti yang anda boleh meneka, mereka tidak menyukainya. Rekaan yang mereka jalani sebenarnya adalah logo kecil beberapa lingkaran berwarna bertindih, dan nama perisian di bawahnya. Seperti, 2 minit dalam kerja PhotoShop. Dan anda tahu apa? Saya sepatutnya bersetuju bahawa ia lebih baik daripada saya.

Oleh itu, perkara yang saya buat adalah - Saya rasa programmer jatuh ke dalam perangkap ini membuat kesilapan yang sama yang saya lakukan. Kami cenderung untuk memikirkan UI dan skrin percikan yang memerlukan perkara-perkara yang sangat menarik, menarik untuk membuat aplikasinya menonjol . Tetapi mereka tidak perlu - jujur, mereka tidak seharusnya. Kita harus mengambil minda pemrogram dan menggunakan reka bentuk estetik - mudah, berfungsi, berfungsi.

Dalam artikel ini, kami akan melihat beberapa cara yang sangat mudah untuk mencipta Android UI UI / UX yang elegan, walaupun anda tidak mempunyai pengalaman merancang.

Kecuali Anda Sebenarnya Ingin Sesuatu Lain, Kekal Reka Bentuk Bahan

Aplikasi anda tidak perlu menjadi " unik" dan " menonjol dari yang lain" untuk menjadi popular dan kelihatan baik. Itulah yang Reka Bentuk Bahan Google ditetapkan untuk mencapai - standard untuk UI aplikasi di seluruh industri, dan mereka telah melakukan pekerjaan yang baik. Terdapat satu ton aplikasi popular di luar sana yang berpegang kepada Reka Bentuk Bahan - beberapa nama terbesar dalam apl Android, seperti SwiftKey, Nova Launcher, SMS Textra, YouTube, hanya untuk menamakan beberapa.

Fokus utama Reka Bentuk Bahan adalah pada susun atur berasaskan kad, dengan palet warna pepejal. Google bekerja dengan pereka industri terkemuka, menarik banyak elemen dari amalan reka bentuk minimalis, dan kemudian mengeluarkan keseluruhannya secara percuma - itu adalah persoalan yang sangat baik, kerana kursus laman web dan reka bentuk aplikasi boleh menjalankan beratus-ratus dolar untuk e-buku, video, dan lain-lain.

Bermula dengan Reka Bentuk Bahan adalah sangat mudah, dan terdapat beberapa alat yang menjadikannya lebih mudah, yang akan kami senaraikan di bawah:

  • Editor Tema Bahan (macOS + Sketch)
  • Plugin Warna Reka Bentuk Bahan (PhotoShop / Illustrator)
  • Kit Reka bentuk Bahan Kit PSD (PhotoShop)
  • Kit Bahan Reka Cipta Android Bahan ( Sketsa)
  • Pembuat Tema Bahan UI

Dan jika anda memerlukan beberapa inspirasi untuk membuat tema Reka Bentuk Bahan yang ringkas dan elegan, lihatlah senarai blog ini:

  • MaterialDesignBlog - 15 Contoh Reka Bentuk Bahan Awesome yang dilakukan dengan betul
  • MockPlus - 12 Contoh Laman Web Reka Bentuk Bahan Terbaik untuk Mewujudkan Inspirasi
  • AndroidAuthority - 10 aplikasi Rekaan Bahan terbaik untuk Android

Gradien Warna Adakah Lebih Mudah Daripada Anda Pikirkan

Untuk alternatif kepada Reka Bentuk Bahan, kecerunan dolor adalah mudah, bergaya, dan menarik perhatian. Dan anda mungkin berfikir bahawa pereka menghabiskan banyak lukisan masa dalam semua warna, atau mereka bentuk kecerunan muktamad. Anda salah - ia boleh dilakukan dalam 10 saat dalam PhotoShop.

10 saat dalam UI kecerunan PhotoShop.

Saya juga akan memandu anda melalui ini, untuk menunjukkan kepada anda betapa mudahnya.

Buat projek PS baru untuk Bergerak ( 1080 x 1920 px @ 72 ppi berfungsi dengan baik)

UIGradients.com - Koleksi besar kecerunan pra-dibuat.

Pergi ke UIGradients.com dan cari sesuatu yang anda suka.

Salin nilai hex warna dari UIGradien

Salin warna kecerunan dari atas pratonton.

Pemilih kecerunan PhotoShop.

Klik kanan pada lapisan kosong di PS, dan pergi ke Blending Options> Gradient Overlay.

Klik terus pada pratonton corak kecerunan dalam menu drop-down - jangan klik pada butang lungsur turun. Mengklik secara langsung pada kecerunan membuka editor warna.

Nilai hex input dari UIGradient ke alat gradien PS.

Sekarang tampal paste nilai hex warna dari UIGradient ke editor gradien PS.

Laraskan seperti yang diperlukan. Anda kini mempunyai latar belakang kecerunan profesional untuk apl Android anda.

Alat kecerunan lain yang perlu diperiksa:

  • WebGradients.com
  • Android Shapes Generator ( untuk menghasilkan bentuk melalui XML, dengan pilihan untuk kecerunan)

Gunakan SVGs Daripada JPG / PNG

Daripada menggunakan PNG atau JPG untuk elemen grafik anda (butang, logo, dan lain-lain), anda seharusnya benar-benar menggunakan SVG ( Grafik Vektor Skalable) sebaliknya. Ini kerana SVG boleh diubah saiznya tanpa kehilangan kualiti - contohnya, jika anda mengangkat nilai JPG ke nilai yang lebih besar, ia kehilangan kualiti dan menjadi kabur / piksel. SVG tidak. Orang cuba menggunakan fail PNG yang besar yang akan diturunkan untuk muat skrin Android - apabila sebaliknya, anda boleh menggunakan SVG yang lebih kecil yang ditingkatkan tanpa sebarang kehilangan kualiti.

Selain itu, SVG boleh sehingga 60% hingga 80% lebih kecil dalam saiz fail daripada PNG . Ini bermakna aplikasi atau tapak web mudah alih anda akan memuat lebih cepat untuk pengguna, dan akan kelihatan baik tidak kira resolusi skrin.

Termasuk Mod Gelap Menggunakan Tema.AppCompat.DayNight

Anda tidak perlu merancang dua tema berasingan untuk memasukkan tema mod gelap / malam di aplikasi anda. Ia cukup dibina ke dalam perpustakaan AppCompat, anda hanya perlu mendayakannya dan mengedit nilai-nilai.

Lihat panduan Appual "Cara Melaksanakan Mod Gelap dalam Apl Android anda".

Gunakan Template atau Kit UI Mudah Alih

Jika aplikasi anda tidak memanggil GUI yang disesuaikan, tidak ada yang salah dengan menggunakan templat atau kit. Templat dan kit boleh digunakan sebagai panduan inspirasi, atau anda benar-benar boleh menggunakan template / kit seperti itu, sambil menambah butang dan barangan anda sendiri.

Beberapa sumber hebat untuk templat UI UI dan kit:

  • SpeckyBoy - 50 Percuma Kit UI Mudah Alih untuk iOS & Android
  • SketchAppSources - Sumber Android App UI ( Sketsa)
  • Freebiesbug - Kit UI JPA ( PhotoShop)

Artikel Yang Menarik