Tag Archives: aplikasi

Template Layout Aplikasi Android

Kalau Anda memperhatikan, beberapa aplikasi Android (yang non-game) sebenarnya memiliki kesamaan template layout. Beberapa di antaranya:

SuperSU

SuperSU

Runkeeper

Runkeeper

Quora

Quora

Tweetcaster

Tweetcaster

Google PlayStore

Google PlayStore

Path

Path

Foursquare

Foursquare

Facebook

Facebook

Gmail

Gmail

Toresto

Toresto

—————————————————————————————————————

Hmm… coba tebak apa persamaan dari layout aplikasi-aplikasi di atas? 😀

Bagi yang pernah mengembangkan aplikasi Android (atau mungkin juga aplikasi mobile lainnya) tentu akan paham. Pada layout aplikasi-aplikasi tersebut terdapat adanya pengelompokan yang jelas antara action button dan view control.

Di design principles yang ditulis Google di dokumentasi pengembangan aplikasi Android di http://developer.android.com/design/patterns/actionbar.html juga sudah digambarkan secara mendetail bagaimana ‘seharusnya’ layout suatu aplikasi Android didesain. Yak, mengutip dari link tersebut, kurang lebih secara umum bisa dijelaskan seperti ini:

Layout aplikasi

Layout aplikasi (sumber: developer.android.com)

  1. Main Action Bar 

Kalau di web mungkin bisa dibayangkan seperti header. Umumnya di align kiri terdapat icon dan nama aplikasi. Lalu di align kanan terdapat item-item action menu.

  1. Top Bar

Biasanya berupa view controls atau navigation bar. Fungsinya adalah memudahkan user untuk berpindah antar halaman view

Varian bentuknya cukup banyak. Aplikasi-aplikasi di atas selain Google PlayStore, Facebook, dan Foursquare adalah contoh bentuk fixed tabs. Semua tab langsung terlihat dalam satu layar. 

Sedangkan PlayStore sendiri menggunakan scrollable tabs. Tidak semua tab view ditampilkan dalam satu layar. Untuk melihat tab-tab yang lain, kita perlu men-swipe layar ke kiri atau ke kanan.

Facebook dan Foursquare adalah contoh aplikasi yang menggunakan bentuk drawers. Memang secara eksplisit sangat berbeda ‘penampakan’-nya dengan top bar pada aplikasi standar. Action button untuk menampilkan drawers itu biasanya berupa icon berbentuk strip 3 horizontal menggantikan icon atau nama aplikasi di bagian kiri action bar.

  1. Bottom Bar

Fungsinya persis dengan top bar. Bedanya tentu adalah letaknya di dalam aplikasi itu. Pada gambar aplikas-aplikasi di atas, Toresto dan  Gmail adalah salah satu yang menggunakan bottom bar tersebut.

Sejauh ini rasanya aku belum pernah menemui sebuah aplikasi yang bersamaan menggunakan top dan bottom bar. Selain karena kegunaannya yang sama, juga karena pertimbangan space yang tersedia untuk konten menjadi berkurang ketika keduanya muncul bersamaan.

—————————————————————————————————————

Untuk mengetahui lebih detail design principle dalam membangun aplikasi Android, bisa baca-baca di http://developer.android.com/design/index.html. Nah, untuk tulisan berikutnya aku akan mencoba membagi pengetahuan mengenai apa saja library yang bisa kita manfaatkan untuk memudahkan pekerjaan kita dalam membangun aplikasi Android yang sesuai dengan guideline tersebut. Because sharing is caring. 🙂

Synergy, Banyak Komputer 1 Mouse+Keyboard

Baru dikasih tahu sama teman (thanks to master Jiwo :D) tentang sebuah aplikasi bernama Synergy. Aplikasi ini berguna sekali ketika kita bekerja dengan dua komputer (PC/notebook), tetapi hanya ingin menggunakan 1 mouse dan 1 keyboard saja. 

Dua komputer 1 mouse+keyboard

Dua komputer 1 mouse+keyboard

Sekedar menekankan saja, dua komputer di sini memang literally dua komputer lho, bukan satu komputer dengan dua monitor (menggunakan mode extended monitor). Kalau yang satu itu mah, tanpa perlu memasang aplikasi ini juga sudah bisa menggunkan mouse keyboard untuk kedua layar.

Namun, konsep kegunaan aplikasi ini memang sama seperti itu. Dengan aplikasi ini, kita cukup menggunakan satu mouse dan keyboard pada salah satu komputer yang berperan sebagai server, lalu dapat menggunakannya pula di satu atau lebih komputer ‘client lainnya. Enak kan?

Caranya, cukup menggerakkan mouse hingga ke arah sisi komputer yang bertetanggaan dengan komputer kita. ‘Bertetanggaan’ di sini merupakan konsep virtual bukan secara fisik. Untuk itu kita dapat mengatur konfigurasi ‘jaringan’ kita terlebih dahulu.

Mengkonfigurasi 'jaringan' komputer-komputer yang digunakan

Mengkonfigurasi ‘jaringan’ komputer-komputer yang digunakan

Ingin mengunduh aplikasi ini? Bisa di sini » http://synergy-foss.org/download/. Tidak perlu mengeluarkan uang sepeser pun untuk mengunduhnya alias gratis. Namun, tak ada salahnya apabila ingin mendonasikan $1 atau lebih untuk men-support mereka.

iMoney: Aplikasi untuk Manajemen Keuangan

Seringkali kita menetapkan budget pengeluaran kita tiap bulan atau tiap harinya. Lantas, apakah pernah kita benar-benar mengontrolnya. Kata ‘mengontrol’ di sini dalam artian kita memang benar-benar konsisten mencatat pengeluaran kita tiap hari atau tiap bulannya sehingga mengetahui bahwa pengeluaran kita telah sesuai atau melebihi budget yang telah kita tentukan. Nah, untuk mempermudah pengaturan atau manajemen keuangan itu, ada satu aplikasi yang dapat membantu kita, yaitu iMoney.

Tampilan home iMoney

Tampilan home iMoney

Dengan iMoney ini kita dapat mendefinisikan akun keuangan kita serta menentukan jenisnya, apakah berupa cash flow, asset, atau investment. Selain itu kita juga dapat mengkustomisasi sendiri kategori-kategori pengeluaran dan pemasukan yang akan kita gunakan. Namun, default-nya sih sudah tersedia kategori-kategori pengeluaran dan pemasukan, didefinisikan oleh iMoney.

Dari beragam fitur yang tersedia, namun fitur yang paling sesuai dengan kebutuhanku adalah fitur budgeting dan reporting. Dengan fitur budget itu kita bisa menetapkan berapa budget yang kita berikan untuk kategori tertentu. Misalkan kategori tersebut adalah ‘makanan’ dan diberi budget Rp400.000 per bulan. Dengan fitur itu kita dapat mengetahui berapa persentase pengeluaran kita untuk kategori ‘makanan’ terhadap budget yang ditetapkan.

Untuk fitur report (laporan), dengannya kita dapat melihat detail pengeluaran dan pemasukan kita dalam periode waktu tertentu. Report tersebut dapat disajikan baik dalam bentuk tabel maupun grafik. Fitur printing juga tersedia pada menu report tersebut.

Reporting

Reporting

Budgeting

Budgeting

Untuk dapat memanfaatkan secara maksimal kegunaan aplikasi ini, yang paling dibutuhkan adalah konsistensi. Yup, mau tidak mau kita harus rajin mencatatkan arus keluar masuk keuangan kita pada aplikasi ini. Kalau tidak begitu, tentu fitur budgeting dan reporting tadi tidak akan dapat menggambarkan kondisi keuangan kita yang sesungguhnya.

SeekDroid: Aplikasi untuk Melacak HP Android

SeekDroid

SeekDroid

HP Anda hilang? Ingin tahu HP Anda di mana posisinya? SeekDroid bisa menjadi solusinya. Tinggal buka website SeekDroid di http://www.seekdroid.com, Anda bisa langsung mengecek posisi HP Anda sekarang di mana. Jika perlu, Anda juga bisa mengirimkan pesan kepada HP Anda dan menyalakan alarm HP Anda via website tersebut. Jika perlu lagi, Anda bisa menghapus seluruh data pada HP Anda via website itu pula, demi keamanan data Anda. Yap, SeekDroid ini boleh dibilang bekerja layaknya remote control saja. Objeknya adalah HP Anda dan remote control-nya adalah aplikasi website tersebut.

Namun, sebelum dapat menggunakannya, kita harus menginstal aplikasi SeekDroid pada HP kita. Kemudian melakukan registrasi ke server SeekDroid via aplikasi HP tersebut. Username dan password yang kita daftarkan melalui aplikasi itulah yang akan kita gunakan juga untuk login ke website SeekDroid.

Requirement untuk dapat menjalankan SeekDroid ini di antaranya versi Android yang digunakan harus sudah 2.2 (Froyo) atau di atasnya, HP harus terkoneksi dengan jaringan internet, dan fungsi GPS pada HP harus aktif. Ya, tentu saja, tanpa adanya koneksi internet dan GPS, fitur-fitur SeekDroid ini tidak dapat bekerja.

Beberapa screenshot aplikasi SeekDroid:

Locate your phone

Locate your phone

Alert your phone

Alert your phone

Alert HP

Alert pada HP

 

Balsamiq: Recommended Mockups Application

Saat ini aku sedang ikut dalam sebuah pengerjaan proyek web bersama beberapa orang kawan. Dalam proyek ini aku berkenalan dengan aplikasi baru bernama “Balsamiq”. Pertama kali mendengar nama ini entah kenapa aku kok langsung teringat “balsem” — salep yang biasa dipakai untuk menghangatkan badan) — ya, hehehe :D.

Ya, Balsamiq bukanlah sebuah nama merek sebuah balsem, tapi ia adalah sebuah aplikasi komputer yang digunakan untuk merancang sebuah mockup dari web yang akan dikerjakan. Dalam pengerjaan sebuah web, adanya mockup akan sangat membantu. Sang programmer akan menjadi lebih fokus dalam proses coding karena desain sudah ada.

Selain itu, mockup juga dapat berperan sebagai media komunikasi yang baik antara klien dan perusahaan serta antara project manager (PM), desainer, dan programmer sebagaimana digambarkan dalam Balsamiq manifesto. Adanya mockup dapat membuat perusahaan, khususnya para developer, untuk memahami requirement yang diminta oleh klien.

mockupsInTheMiddle [balsamiq.com]

mockups in the middle (balsamiq.com)

Installer Balsamiq bisa diunduh di situs Balsamiq langsung. Aplikasi ini dapat berjalan di multiplatform, termasuk WIndows, Linux, dan Mac. Sayangnya aplikasi ini tidak gratis. Untuk dapat menggunakan seluruh fungsionalitasnya (full functionality) kita harus membelinya terlebih dahulu seharga $79 atau sekitar 700 ribu rupiah. Namun, kita bisa mengambil kesempatan untuk mencoba (trial) aplikasi itu secara full functionality selama 7 hari.

Tapi dari beberapa komentar yang kubaca di beberapa forum terkait Balsamiq ini sih kata mereka walaupun harus membayar mahal untuk mendapatkan aplikasi ini, tapi aplikasi ini menurut mereka benar-benar worthy. Banyak ikon/simbol UI (user interface) yang bisa kita gunakan untuk desain mockup kita mulai dari textbox, textarea, image, radio button, checkbox, hingga map, webcam, dan simbol-simbol antah berantah lainnya. Semua ikon/simbol UI itu ditampilkan dalam bentuk gambar sketchy (seperti coret-coretan pensil), termasuk ketika kita memasukkan sebuah gambar atau foto, misal logo atau banner untuk dipasang di web kita. Kita bisa mengkonversinya ke bentuk sketchy juga. Jadi kelihatannya memang lebih artistik dan menunjukkan kalau itu memang mockup sih :).

Screenshoot Balsamiq

Screenshoot Balsamiq

Fitur lain yang juga cukup penting dan akan sangat useful adalah fitur full screen. Full screen ini akan membantu kita untuk mempresentasikan mockup yang sudah dibuat. Bagusnya, kursor yang ditampilkan saat kita dalam mode full screen bukan pointer kecil putih seperti biasanya, tapi pointer yang berwarna biru yang berukuran besar sehingga tampak lebih jelas.

Mode Full Screen Balsamiq

Mode Full Screen Balsamiq

Sebenarnya aplikasi mockup, khususnya untuk desain web, ada juga aplikasi lain selain Balsamiq ini. Salah satunya adalah Pencil. Aplikasi ini gratis, tapi sayangnya kumpulan simbol UI untuk desain webnya kurang kaya. Tapi sudah lumayanlah untuk kategori aplikasi gratisan :). Mungkin Anda punya rekomendasi aplikasi mockup yang lain?

Screenshoot Pencil

Screenshoot Pencil

Aplikasi Android untuk Remote Slide Presentasi

Awalnya aku cuma tahu saja bahwa ada aplikasi Android yang bisa digunakan untuk me-remote aplikasi di komputer, entah itu aplikasi media player, slide presentasi, ataupun me-remote desktop langsung. Nah, tiba-tiba saja ketika aku sedang mempersiapkan diri untuk seminar Tugas Akhir II hari ini tadi aku teringat tentang aplikasi Android yang bisa digunakan untuk me-remote slide presentasi tadi. Aku pun mulai mencari-cari aplikasi apa yang user friendly, nggak ribet, dan (yang paling penting) gratis.

Akhirnya, setelah googlinggoogling, dapat satu link menuju situs http://www.vrallev.net/do/apps/android/pptodp_remote/start. Nama aplikasinya adalah PowerPoint OpenOffice Remote atau disebut juga dengan Remote PPT ODP.

PowerPoint OpenOffice Remote is an app for Android OS to remote control PowerPoint and OpenOffice presentations.

Dari situs tersebut aku mendapatkan link menuju halaman review aplikasi itu di situs Android Market. Wow, lumayanlah, ratingnya 4,1 dari skala 5. Yang ngevote juga sudah 91 orang. Persebaran suaranya: 56 orang bintang 5, 13 orang bintang 4, 7 orang bintang 3, 5 orang bintang 2, dan 10 orang bintang 1. Komentar-komentar yang kubaca di halaman itu sebagian besar juga menunjukkan kepuasan. Akhirnya langsung kuputuskan saja mengunduhnya.

Untuk dapat menggunakan aplikasi remote ini, selain (tentu saja) memasang aplikasi tersebut di HP Android, kita juga perlu memasang aplikasi satunya lagi buat yang di desktop. Aplikasi desktop itulah yang akan digunakan untuk menjalin koneksi antara HP dengan PC. Koneksi yang dilakukan adalah via Wi-Fi. Jadi, HP Android itu sebelumnya perlu kita set agar menjadi portable Wi-Fi hotspot sehingga keberadaan HP tersebut terbaca oleh PC.

Aplikasi desktop untuk Remote PPT ODP

Aplikasi desktop untuk Remote PPT ODP

Lalu pada aplikasi desktop kita di-set IP address milik HP itu dan nomor port tempat aplikasi Remote PPT ODP berjalan. Apabila koneksi antar aplikasi sudah terjalin, program akan menjalankan proses screenshot halaman-halaman slide presentasi dan mengeloadnya ke dalam aplikasi pada HP. Setelah itu kita tinggal melakukan navigasi melalui HP (touchscreen) dengan mudah. Cukup touch sekali, slide sudah berganti (next, previous, jump). Bisa juga dengan cara sliding untuk berpindah antar slide (next maupun previous). Oh iya, waktu aku coba kemarin, aplikasi ini ternyata selain bisa digunakan untuk PPT dan ODP, juga bisa untuk PDF.

Dari yang aku googling-googling kemarin sih memang ada aplikasi-aplikasi sejenis lainnya. Tapi karena aplikasi pertama yang aku coba adalah aplikasi ini dan kebetulan pas begitu, akhirnya malas juga mencoba yang lain karena waktu yang terbatas (harus menyiapkan seminar TA II). Aplikasi ini punya dua versi: versi free dan versi berbayar. Yang versi berbayar, katanya ada beberapa fitur tambahan. Hanya saja, saya nggak begitu tahu apa sajakah fitur tambahan itu.

Namun, ada satu hal kekurangan dari aplikasi ini menurutku. Dari sisi waktu aplikasi ini memerlukan waktu untuk proses loading (screenshot + download screenshot) ke HP yang cukup lama, bergantung pada jumlah slide. Mungkin ada aplikasi sejenis yang tidak perlu proses tersebut? Simpel, tinggal klak klik next/previous/jump saja?

# Halaman download aplikasi : http://www.vrallev.net/do/apps/android/pptodp_remote/start

Blaast

Mungkin sebagian sudah ada yang pernah mendengar tentang judul di atas. Blaast? Makanan apaan sih itu :D? Saya sendiri pertama kali mendengar tentang “Blaast” adalah sekitar bulan Maret lalu ketika ada teman yang memosting di milis jurusan bahwa ‘mereka’ akan datang ke ITB jauh-jauh dari Finlandia untuk mengadakan sosialisasi dan kerja sama dengan civitas ITB. Namun, saat itu saya sendiri belum begitu menaruh perhatian, hingga akhirnya kemarin ada kakak angkatan yang memosting kembali di milis dan memberikan sedikit informasi mengenai Blaast.

Buat yang ingin tahu Blaast itu apa, mengutip dari salah satu postingan di milis jurusan saya, Blaast itu adalah suatu mobile development platform yang berbasis cloud service. Kalau teman-teman buka situsnya, di sana jelas tertera tagline mereka: “forget hardware, your next phone is in the cloud”. Selain itu, dalam sedikit company profile sebagaimana yang tertera di situs ArcticStartup mereka (Blaast Ltd) menyatakan, “At Blaast, we believe that everything from your mobile apps to personal data, from email to settings, will be in the cloud. That’s why we’re building the world’s first cloud-based mobile platform.” Dari situ tampaknya sudah jelas bahwa aplikasi-aplikasi Blaast akan bersifat cloud-based alias semua aplikasi itu akan di-hosting di cloud (baca: internet).

Sebelumnya, perlu diketahui bahwa aplikasi-aplikasi Blaast itu dicoding dengan menggunakan Javascript. Jenis-jenis mobile devices yang support J2ME otomatis akan support juga terhadap Blaast ini. Untuk platform Android, kabarnya saat ini mereka tengah mengusahakan untuk compatible juga di sana.

Rencana ke depannya mereka juga akan membuat market place sendiri (Blaast App Store), di mana semua aplikasi akan disimpan di cloud server mereka. Untuk mendorong pertumbuhan developer Blaast, mereka pun mengadakan kompetisi membuat aplikasi Blaast yang dimulai dari tanggal 14 Mei sampai 11 Juli 2011. Hadiah yang ditawarkan pun sangat menarik, di antaranya Macbook Pro, Trip to Europe, dan Smartphones. Kalau dilihat dari salah satu hadiahnya, yakni ‘Trip to Europe’, agaknya mereka memang mengincar developer-developer dari luar Eropa, khususnya Asia. Bahkan, kabarnya mereka akan melakukan launching secara resmi di Indonesia (simak video di bawah).

Wah, saya jadi tertarik untuk ngoprek nih. Mudah-mudahan di tengah kesibukan Tugas Akhir (TA) ini masih bisa menyisihkan waktu untuk ngoprek kakas yang satu ini. Buat teman-teman yang mungkin tertarik juga untuk ngoprek dan bahkan ikutan bikin aplikasi Blaast bisa download SDK-nya di sini. Kecil kok ukurannya, cuma 10 MB. Di salah satu menu di sana juga terdapat tutorial/guide serta referensi untuk bekerja dengan SDK tersebut. Tetapi untuk bisa mengunduh dan membaca guide dan referensi tersebut, kita harus sign up dulu ke situs developer.blaast.com. Dalam paket SDK itu juga terdapat beberapa contoh aplikasi yang dapat kita jalankan dan pelajari source code-nya. So, happy exploring! 😀

Screenshoot Blaast Rocket

Screenshoot Blaast Rocket developer tool