Skip to content
··7 menit baca

Apakah kamu siap untuk dunia Mobile? Apa saja pilihanmu?

Smartphone menawarkan channel yang intim bagi brand ke pelanggan, tapi apakah situsmu sudah siap? Jelajahi opsi mobile site, native app, dan responsive design.

Posting ini ditulis pada tahun 2013. Beberapa detail mungkin sudah berubah sejak saat itu.

Jadi dengan jutaan pengguna smartphone, menggunakan ponsel mereka setiap hari, apa yang bisa kita lakukan untuk memanfaatkannya? "Bagi semakin banyak konsumen, di berbagai pasar, tingkat pendapatan dan demografi, ponsel adalah perangkat dan channel komunikasi yang paling dekat dengan hati mereka. Ini secara definisi bersifat intim dan personal, dibawa ke mana-mana, digunakan sepanjang hari dan dikustomisasi melalui mengambil dan menyimpan foto pribadi, mengunduh musik, menambahkan wallpaper, membuat shortcut dan, semakin sering, melalui pemilihan aplikasi dan fungsi." Dari TNS Global Key Insights Mobile Life. Karena ini, smartphone mewakili peluang besar bagi brand untuk memiliki hubungan intim, satu lawan satu dengan pelanggannya. Dari sudut pandang owned medium, kita punya opsi seperti

  • mengembangkan mobile site
  • native mobile app
  • memanfaatkan jejaring sosial yang sudah ada seperti Facebook, Twitter, Instagram.

Dengan mobile site, kamu tidak bisa memanfaatkan berbagai fungsi seperti akses ke album foto, kamera, video, kontak dan lainnya. Pengalamannya kemungkinan tidak akan sekaya/seinteraktif native mobile app. Namun hal baiknya adalah mobile site bersifat platform agnostic yaitu bisa berjalan di iOS, Android atau Windows. Untuk Native App, kamu bisa membangun app yang sangat kompleks dengan pengalaman kaya, grafis cantik, gambar 3D dll... Namun, sangat penting untuk tahu bahwa kamu kemungkinan harus membuat versi berbeda dari app yang sama untuk iOS, Android, Windows Mobile atau sistem operasi lainnya.

Apakah situsmu saat ini mobile friendly?

Untuk menjawab pertanyaan ini, kamu bisa mencoba mengunjungi situsmu sendiri di smartphone atau kamu bisa menggunakan simulator ponsel (yaitu cari saja online "How does your site look on mobile?" dan kamu akan menemukan banyak tool gratis). Kalau situsmu dibuat dari flash, maka kamu TIDAK akan bisa melihat apa-apa di iPhone (atau perangkat iOS manapun seperti iPad, iPod Touch) karena iOS tidak mendukung flash. Beberapa tool akan memberikan petunjuk cara mengoptimalkan mobile site-mu. Pertanyaan yang mereka ajukan bisa seperti:

  • "Apakah kamu melihat gambar rusak atau konten yang hilang?
  • Bisakah kamu membaca teks tanpa zoom atau scroll ke samping?
  • Bisakah link dan tombol diklik dengan ibu jari?
  • Apakah video, game atau animasi lainnya terlihat?
  • Apakah visual dan tone konsisten dengan materi marketing lainnya?"

Dengan menjawab pertanyaan-pertanyaan ini dan mengetahui berapa waktu loading mobile site-mu, saya kira kamu bisa punya gambaran kasar tentang bagaimana performa mobile site-mu dan area apa yang harus kamu perhatikan untuk perbaikan. Sekali lagi daftar di atas sangat dasar dan ada banyak hal lain yang perlu dicek untuk mengetahui apakah situsmu mobile friendly.

Situs mobile friendly

Di Vietnam, dalam hal mengembangkan mobile site, dari sudut pandang teknis, ada beberapa opsi untukmu:

Responsive Web Design

Responsive web design (RWD atau Responsive Design) relatif baru jadi masih ada jalan panjang bagi desainer dan developer untuk menguasai konsep ini dan mewujudkannya dengan indah. Ada banyak contoh website responsive design seperti http://mashable.com/, http://www.bostonglobe.com/ atau blog saya sendiri menggunakan tema yang mendukung responsive design. Saya belum menemukan banyak situs di Vietnam yang mengimplementasikan Responsive Design. Dari "Think Insights with Google", mereka menulis "Responsive web design (RWD) memungkinkan kamu mengoptimalkan pengalaman situs di berbagai ukuran layar tanpa membuat banyak website. Dengan menggunakan template fleksibel, CSS media queries, dan JavaScript events, responsive web design bisa merespons ukuran viewport perangkat, menyesuaikan gambar, layout template dan visibilitas konten. Kamu bahkan bisa memanfaatkan kemampuan perangkat baru seperti dragging, swiping dan gesture pengguna lainnya yang dikenali oleh perangkat sentuh. Semua teknik CSS dan JavaScript ini bisa ditumpuk pada satu file konten HTML, dikirimkan ke semua perangkat." Contoh di bawah dari Mashable untuk menampilkan responsive web design kalau kamu belum yakin apa itu: mashable desktop version Ini ukuran layar normal untuk desktop (saya menggunakan Macbook Pro dan resolusinya "best scaled"), kamu perhatikan judul artikel di sisi kanan "Google Glass Photographer Makes Picture Taking Awkward". Kalau kamu lihat bagian yang di-highlight, kamu bisa melihat artikel punya judul dalam 2 baris dan beberapa deskripsi di bawahnya. Sekarang lihat gambar di bawah untuk ukuran layar iPad. Kalau kamu ingin mereplikasi ini, kamu hanya perlu memperkecil ukuran jendela browser. mashable ipad screen size Karena ukuran layar yang lebih kecil, judul artikel sekarang muncul dalam 4 baris, kita tidak punya ruang untuk deskripsi artikel lagi. Namun seperti yang bisa kamu lihat, layoutnya responsive dan tampilan kita masih optimal. Layout tidak rusak dan kamu masih bisa membaca konten dengan mudah. Contoh terakhir adalah ukuran layar smartphone untuk situs Mashable yang sama. Seperti yang kamu lihat, layoutnya berubah total untuk mengakomodasi ukuran layar kecil. Kamu hanya melihat bagian New di homepage. Navigasi utama berkurang menjadi tombol di pojok kiri atas. Kalau ingin ke bagian lain, kamu harus klik tombol itu. mashable iphone screen size

Mobile site: Menyajikan HTML berbeda secara dinamis di URL yang sama

Ketika pelanggan mengunjungi website-mu, webserver-mu bisa mendeteksi perangkat apa yang mereka gunakan dan menyajikan halaman kustom (HTML + CSS) di URL yang sama. Halaman kustom ini bisa dirancang untuk jenis perangkat apa saja—ponsel, tablet, komputer desktop dan bahkan Smart TV. Mendeteksi perangkat pengguna dan mengubah konten yang disajikan membutuhkan kustomisasi (misalnya stylesheet) yang perlu dikelola per perangkat.

URL mobile terpisah

Opsi lain untuk mengkustomisasi pengalaman pengguna berdasarkan tipe perangkat adalah membangun situs terpisah untuk traffic mobile, independen dari situs desktop asli. Browser mendeteksi kalau pengunjung di perangkat mobile dan mengarahkan mereka ke versi situs yang dioptimalkan untuk mobile (misalnya m.vnexpress.net). Situs mobile khusus memungkinkan kamu menyesuaikan situs khusus untuk pengguna mobile dan sering dibangun dan di-host secara independen. Solusi ini cukup umum digunakan di Vietnam. Beberapa portal berita terbesar di Vietnam menggunakan tipe implementasi ini seperti VnExpress, Vietnamnet (2013). vnexpress mobile site

Situs mobile friendly atau native mobile app?

Dari sudut pandang budget, opsi dengan budget terendah adalah memiliki situs mobile terpisah yaitu URL mobile terpisah. Responsive Web Design umumnya akan lebih mahal dibandingkan mobile site. Dan tentu saja, membangun mobile site dengan responsive design jauh lebih murah dibandingkan native app. Kalau kamu bertanya seberapa lebih murah tepatnya untuk mobile site vs native app, jawabannya tergantung. Saya memperkirakan rasionya antara 3-20 kali lebih mahal untuk native app tergantung fungsionalitasnya juga. Selain fakta bahwa biaya pembuatannya lebih rendah, mobile site punya keunggulan jangkauan, kompatibilitas lintas platform, browser. Pengguna bisa menemukan mobile site cukup mudah hanya dengan mencari di Google. Untuk situs responsive web design, mewarisi semua keunggulan mobile site di atas, plus menawarkan pengalaman pengguna yang jauh lebih baik di berbagai perangkat berkat layout kustom. Kalau kamu ingin mengupdate situs Responsive web design (RWD), kamu bisa melakukannya lewat CMS cukup mudah. Perubahannya langsung live di browser pengguna tanpa persetujuan pihak ketiga seperti kasus Apple AppStore. Baik mobile site "normal" maupun situs RWD punya beberapa kekurangan besar seperti:

  • Banyak yang tidak bisa berfungsi tanpa koneksi internet (Sepengetahuan saya yang terbatas, ada beberapa Web App yang menawarkan mode offline)
  • Mereka tidak bisa mengakses data pribadi pengguna di ponsel itu sendiri, kamera, kalender, foto stream, accelerometer dll... (Ini mungkin berubah di masa depan)
  • Umumnya tidak menawarkan pengalaman pengguna sekaya native app karena animasi kompleks, game, reporting, kalkulasi dll... tidak bisa diimplementasikan dengan mudah.
  • Kemampuan push: Kalau kamu ingin mobile site-mu (web app) berjalan di background dan mengirim notifikasi, itu tidak mungkin saat ini
  • Kemudahan monetisasi: Dengan Google Play dan Apple App Store atau marketplace lain, jauh lebih mudah memasarkan native app dan menjangkau audiens masif yang mungkin membayar untuk mendownload native app-mu, atau membeli item in-app. Untuk mobile site, model langganan tampaknya termasuk beberapa pilihan yang tersedia untuk monetisasi.

Satu kekurangan besar dari native app adalah untuk memberikan pengalaman pengguna terbaik, app perlu dikustomisasi/dibangun untuk setiap platform yaitu satu versi untuk iOS dan versi lain untuk Android. Ini berarti biaya pengembangan lebih tinggi untuk native app. Biaya maintenance lebih tinggi juga. Kekurangan mobile site secara alami menjadi keunggulan native app. Namun perlu diingat bahwa native app sama seperti aset media sosial atau website, begitu kamu membangunnya, kamu perlu mengeluarkan uang untuk mempromosikannya ke pengguna dan memeliharanya setelah itu. Jadi saya tidak merekomendasikan mengembangkan app hanya untuk kampanye 2 bulan lalu berhenti mendukungnya setelah itu.

Alur pengembangan native app

Kalau kamu ingin membangun native mobile app, alur umumnya seperti ini:

  • Ideation: ini termasuk konsep app, fungsionalitas utama. Biasanya lebih baik memikirkan manfaat jangka panjang dari app (untuk pengguna dan brand), bukan hanya untuk burst kampanye (1-2 bulan) karena biaya membangun app dan mempromosikannya agar pengguna mendownload tidak kecil.
  • Business analysis: menganalisis kebutuhan dan menyarankan solusi teknologi yang sesuai, foundation framework untuk setiap sistem operasi,
  • Wireframe, Design: Sama seperti membuat website, wireframe sangat penting untuk app karena merupakan fondasi dari user interface. Kalau ada sesuatu yang salah secara logis dengan wireframe, atau ada yang kurang, user experience akan terpengaruh secara parah.

Screen flow akan menjelaskan bagaimana animasi berfungsi. Dengan screen flow, klien bisa "memvisualisasikan" cara menggunakan app, apa yang terjadi ketika tombol ditekan.

  • Database, CMS dan API: tahap ini tentang mendesain database, coding CMS dan API sesuai kebutuhan. Kamu bisa coding CMS dan API menggunakan php atau Java atau .Net, terserah kamu. Perlu dicatat bahwa tim produksi web "normal"-mu bisa menangani bagian ini, mereka hanya perlu menghasilkan API sesuai yang diminta.
  • Programming untuk menghubungkan front end app dengan database, CMS dan API: di tahap ini kamu perlu programming menggunakan Apple/Android SDK, dengan bahasa seperti Objective C untuk iOS, dll.

Pertanyaan berikutnya yang harus kamu pertimbangkan adalah apakah kamu harus mengembangkan native app di Android atau iOS atau Windows?

Android atau iOS atau Windows?

Satu hal utama yang perlu dipertimbangkan adalah market share antara iOS dan Android di kalangan target audience-mu. Jelas Windows BUKAN platform umum jadi pilihanmu antara Android atau iOS. Rekomendasi saya adalah kalau kamu punya budget, pilih keduanya. Kalau kamu ingin memonetisasi app-mu, menggunakan pembayaran via store resmi maka iOS adalah jalannya. Pengguna Apple App jauh lebih mungkin membayar sesuatu vs Android karena salah satu alasannya, jauh lebih mudah menemukan versi crack dari app Android. monthly store revenue ios android and windows Dari App Annie kamu bisa lihat bahwa revenue iOS Store sekitar 4 kali lebih banyak dari Google Play secara bulanan. Kalau kamu harus memilih satu platform maka semuanya tergantung pada target audience-mu dan pilihan smartphone mereka. Sebagai marketer, kita harus mengikuti pengguna kita dan memancing di mana ikannya berada. Terakhir, di atas adalah kutipan dari bab "Mobile Asset" di buku terbaru saya tentang Vietnam Digital Marketing. Untuk membeli ebook, silakan gunakan link ini.

Lanjutkan Membaca

Perjalanan Saya
Terhubung
Bahasa
Preferensi