12 Trik Desain UI Aplikasi Seluler Dan Web Tidak Ada yang Memberitahu Anda Tentang – Sampai Sekarang
Diterbitkan: 2016-02-28[ Proto .io adalah alat pembuatan prototipe aplikasi seluler yang digunakan oleh pengusaha dan pemula untuk membuat prototipe realistis yang sepenuhnya interaktif yang terlihat dan terasa seperti aplikasi nyata.]
Kami bertanya kepada tujuh desainer UI, pengembang, dan pengusaha trik desain UI aplikasi seluler dan web apa yang mereka pelajari dengan susah payah, atau kebetulan mereka dapatkan selama karier mereka. Entah tidak ada yang pernah memberi tahu mereka tentang tip ini, atau sepertinya tidak ada yang tahu tentang masalah saat mereka membicarakannya. Bagaimanapun, berikut adalah 12 hal yang sekarang tidak perlu Anda pelajari melalui coba-coba — kecuali, tentu saja, Anda sudah memilikinya!
3 Trik Desain Teratas dari Duffy
John Geletka adalah Wakil Presiden Eksekutif Strategi Digital di Duffy (@duffydesignx), sebuah agensi dengan pengalaman desain lebih dari 30 tahun. Berikut adalah beberapa trik yang dia ambil selama bertahun-tahun.
Dua bisa menjadi angka ajaib.
“Dengan desain responsif, selalu desain dua layar sekaligus: potret seluler (320px) dan desktop (1200px). Itu membuat prosesnya jauh lebih cepat, ”kata Geletka.
Mulailah dengan desain tulang telanjang.
“Kurangi semua fitur, lonceng dan peluit pada awalnya. Singkirkan sampah Anda dan fokus pada tujuan aplikasi, ”kata Geletka. “Itu berarti jangan menambahkan berbagi, dan menyimpan dan setiap integrasi ke desain Anda pada awalnya. Pastikan Anda mendapatkan ide utamanya. ”
Jangan takut untuk mengambil pena.
“Alat digital memang hebat, tetapi terkadang Anda bisa menyelesaikan lebih banyak di atas kertas dalam 10 menit,” kata Geletka. “Jika Anda buntu atau kekurangan waktu, gunakan kertas.”
Raih Keseimbangan Dengan Trik Desain UI Aplikasi Web ini
Brandon Termini adalah Pendiri dan Direktur Kreatif Handsome (@HandsomeMade), sebuah agensi yang berkomitmen untuk menciptakan desain UI aplikasi web dan produk digital yang “sangat indah dan menyenangkan”.
Gunakan berat optik yang benar.
“Keseimbangan sangat penting ketika membuat antarmuka yang sukses. Keseimbangan yang baik memungkinkan pengguna Anda dengan mudah memindai aplikasi Anda seperti yang Anda inginkan,” kata Termini. “Saya melihat aturan ini paling sering dilanggar saat menggunakan berbagai ikon di antarmuka. Beberapa ikon lebih berbobot horizontal sementara yang lain lebih vertikal, dan tugas kami adalah memastikan saat disatukan, mereka merasa seimbang.”
Berat Optik dan Tombol Putar
“Jika Anda mendesain tombol putar, jawabannya bukanlah menempelkan segitiga dengan sisi yang sama secara horizontal dan vertikal di tengah lingkaran. Tentu, secara geometris mereka berada di tengah, tetapi segitiga secara optik terasa lebih berat di sebelah kiri karena tingginya yang lebih besar, ”kata Termini. “Jangan khawatir — Anda dapat melakukan dua hal untuk memperbaikinya: gerakkan segitiga sedikit ke kiri untuk mengelabui mata agar melihatnya di tengah, atau kurangi lebar segitiga sedikit untuk membuat semua sisi tampak rata.”
Dari Desain UI Aplikasi Web ke Seluler
Tiga trik desain UI aplikasi seluler dan web kami berikutnya datang dari Christian Dodd, Wakil Presiden dan Direktur Strategi Pengalaman Pengguna dan Nathan Koch, Direktur Teknologi Kreatif Cramer-Krasselt (@cramerkrasselt). Cramer-Kasselt adalah biro iklan independen terbesar kedua di AS, dengan klien seperti Porsche, Corona Extra, dan Heinz, jadi Dodd dan Koch memanfaatkan sumber pengalaman yang kaya untuk memberikan saran ini kepada kami:
Jangan lupa interaksi hover web apa pun saat melakukan porting ke seluler, dan miliki rencana yang jelas untuk menanganinya di awal desain.
“Konten yang bersembunyi di balik status melayang di desktop dapat ditangani dengan beberapa cara di seluler: langsung di halaman, dan bersembunyi di balik sentuhan. Tidak ada satu solusi untuk menangani acara hover desktop yang berfungsi di semua kasus, ”kata Dodd dan Koch. “Konten penjelasan/utilitas sering kali diuntungkan karena dimunculkan untuk ditampilkan di halaman, dan konten eksplorasi sering kali lebih masuk akal jika disentuh. Secara umum, karena pengguna merasa lebih nyaman menggulir di semua perangkat, menyembunyikan konten di balik status melayang dan menyembunyikan/menampilkan widget menjadi semakin tidak diperlukan.
Direkomendasikan untukmu:
Apa Arti Ketentuan Anti-Profiteering Bagi Startup India?
Bagaimana Startup Edtech Membantu Tenaga Kerja India Meningkatkan Keterampilan & Menjadi Siap Masa Depan...
Saham Teknologi Zaman Baru Minggu Ini: Masalah Zomato Berlanjut, EaseMyTrip Posting Stro...
Startup India Mengambil Jalan Pintas Dalam Mengejar Pendanaan
Platform Pemasaran Digital Logicserve Bags Pendanaan INR 80 Cr, Berganti Nama Sebagai LS Dig...
Laporan Memperingatkan Pengawasan Peraturan yang Diperbarui Pada Lendingtech Space
Mencoba membuat video putar otomatis berfungsi di web seluler biasanya tidak sepadan.
“Pengembang OS seluler tidak mengizinkan pemutaran video otomatis karena suatu alasan. Secara umum, audio dan video lebih mengganggu pengguna di ponsel,” kata Dodd dan Koch. “Pengguna seluler terbiasa membuat pilihan yang disengaja untuk mengonsumsi media.”
Ada lebih dari sekadar desain responsif dari mengecilkan browser Anda.
“Deteksi fitur juga merupakan bagian penting dari pengembangan web seluler,” kata Dodd dan Koch. “Jangan berpikir Anda tidak dapat menebak-nebak peristiwa sentuh di situs web desktop, detail interaksi seluler lebih canggih daripada yang terlihat.”
Ada Lebih Banyak Aturan Tiga Dari yang Anda Pikirkan
Karolyn Hart adalah Chief Operating Officer InspireHUB (@Inspire_HUB) dan pencipta IHUBApp, salah satu aplikasi web seluler tingkat perusahaan paling awal di pasar.
Cobalah untuk menyimpan semua elemen desain UI aplikasi web dalam kelompok tiga.
“Kami menemukan 'Aturan Tiga' saat kami meneliti cara menciptakan kepercayaan pada antarmuka kami untuk klien kami. V1.0 platform kami tidak tepat sasaran, ”kata Hart. “Penelitian menunjukkan bahwa tiga adalah angka optimal yang meningkatkan kepercayaan diri. Kurang dari tiga dan orang merasa tidak yakin, lebih dari tiga dan mereka merasa kewalahan.”
“Jadi kami membuat tantangan UX bahwa semuanya harus disajikan dalam tiga bagian,” kata Hart, “mulai dari keputusan hingga langkah saat klien kami mengisi aplikasi mereka. Aturan telah mengubah alat kami. Back-end kami sangat canggih untuk mengakomodasi kesederhanaan desain, tetapi hasilnya sepadan!”
Menjaga Gerakan Sederhana Dan Intuitif
Jason Suriano adalah Pendiri dan CEO Rocketfuel Productions Inc. (@TrajectoryIQ). Dengan pengalaman lebih dari 13 tahun dengan desain UI aplikasi seluler dan web, dan telah membuat proyek berbasis online dan seluler untuk perusahaan seperti Discovery Communications, Suriano telah mengambil beberapa kiat pro. Ini dia favoritnya:
Di ponsel, anggap semua jari canggung.
“Salah satu trik yang kami terapkan saat mendesain game seluler adalah membuat seluruh layar awal menjadi area yang dapat disentuh. Artinya, jika pengguna menekan tombol mulai dan melewatkannya, aplikasi akan tetap memuat layar permainan berikutnya, memastikan bahwa pengguna akan melanjutkan di aplikasi, ”kata Suriano.
“Karena UI/UX seluler ditentukan oleh ketukan, ketukan dua kali, gesekan, dan gerakan, kesalahan langkah merancang sesuatu secara langsung seperti layar mulai dapat membuat pengguna Anda terdampar atau frustrasi, memaksa mereka untuk menekan tombol beranda dan keluar dari aplikasi,” tambahnya. .
Menjaga Pikiran Terbuka untuk Trik Desain UI Aplikasi Web Baru
Nolan Kier dan merupakan Manajer Proyek dan Rekan Pengembangan Bisnis di Messapps (@Messapps), sebuah perusahaan pengembangan aplikasi yang berkantor pusat di NYC. “Meskipun telah didirikan kurang dari tiga tahun yang lalu, Messapps telah berkembang pesat menjadi salah satu perusahaan pengembangan aplikasi paling terkemuka dan inovatif di bidang pengembangan aplikasi,” kata Kier, “dan kami telah belajar banyak UI aplikasi web trik desain dalam tiga tahun yang singkat itu.”
Teruslah mencari cara baru yang lebih baik untuk menyelesaikan pekerjaan.
“Banyak trik atau metode baru untuk menyelesaikan tugas yang kami pelajari baik melalui penelitian masalah atau dengan menggali lebih dalam masalah pengembangan tertentu untuk menentukan jawaban apa yang bisa diungkap,” kata Kier. “Contohnya termasuk belajar menulis dokumen keren dengan menulis cuplikan kode baru ke LaTeX, yang mirip dengan editor teks dengan gaya/format pemrograman. Juga, Mathematica, yang seperti Mathcad untuk MacOS, memiliki fitur tersembunyi yang rapi yang memungkinkan pengguna untuk membuat skema 3D yang sulit menggunakan perangkat lunak.”
“Untuk desain, menemukan cara mengompresi bingkai menggunakan hal-hal seperti memodifikasi saluran alfa dan kemampuan untuk mengompresi gambar individual menggunakan algoritme khusus adalah trik kecil yang membantu prosesnya,” kata Kierk. “Berada di bisnis desain dan pengembangan UI aplikasi web menuntut inovasi yang sesuai dengan evolusi teknologi. Akibatnya, desainer dan pengembang kami terus-menerus mengerjakan ulang proses internal dan eksternal kami untuk “menemukan kembali roda” dan menemukan cara baru untuk merancang dan mengembangkan.”
Menemukan Orang yang Tepat untuk Bekerjasama
Robert Pieta adalah insinyur dan CEO iOS di Porter Key (@PorterKeyboard), keyboard iOS pintar yang memberikan saran kontekstual. Inilah nasihat terbesarnya sebagai insinyur dan pengusaha:
Temukan desainer pengembang, atau pengembang desainer.
“Seseorang yang mengerti dan memiliki pengalaman senior dari kedua belah pihak akan membantu menyelesaikan masalah komunikasi dan membantu menjaga proyek sesuai jadwal,” kata Pieta. “Ada dua manfaat utama untuk ini. Pertama, seseorang dengan pengalaman desain dan pengembangan dapat membantu menjembatani kesenjangan komunikasi. Baik desain dan pengembangan memiliki istilah kunci, gaul, asumsi implisit, dan penyewa inti mereka sendiri. Dengan mengetahui kedua dunia, masalah komunikasi dapat ditangkap terlebih dahulu. ”
“Kedua, pengembang dengan pengalaman desain dapat memperkirakan kompleksitas dan kebutuhan sumber daya jauh lebih baik daripada pengembang tunggal, perancang tunggal, atau bahkan manajer produk,” tambah Pieta. “Seringkali, perubahan desain kecil dapat menyebabkan penurunan waktu pengembangan yang signifikan. Ini terutama berlaku di seluler, di mana paradigma desain tertentu hampir dibuat sebelumnya. Memahami kustomisasi apa yang mudah diterapkan dan animasi apa yang mudah digunakan akan membantu memastikan pengembang dan desainer menikmati prosesnya.”
“Beberapa tim yang ada dapat mengklaim bahwa pertemuan standup dengan pengembang dan desainer memecahkan masalah ini,” kata Pieta, “tetapi seringkali, ini tidak terjadi. Pertemuan ini terlalu singkat untuk secara akurat menyelidiki asumsi desain implisit, penelitian pengguna sebelumnya, keputusan arsitektur kode yang ada, pilihan bahasa, dan lebih banyak pilihan yang mendefinisikan proyek. Hanya orang dengan pengalaman dari kedua dunia yang dapat menjembatani kesenjangan dengan cepat dan efektif.”
Dan Satu Lagi Trik Dari Kami: Gunakan Alat Prototyping yang Tepat
Beberapa trik desain UI aplikasi seluler dan web dapat diajarkan, dan beberapa hanya dapat dipelajari dengan cara yang sulit, melalui pengalaman. Untungnya, desainer dan pengembang saat ini dapat membangun keahlian mereka, seperti yang mereka katakan, di pundak para raksasa.
[ Proto .io adalah alat pembuatan prototipe aplikasi seluler yang digunakan oleh pengusaha dan pemula untuk membuat prototipe realistis yang sepenuhnya interaktif yang terlihat dan terasa seperti aplikasi nyata.]