IMPLEMENTASI ANDROID MATERIAL DESAIN TERHADAP PERANCANGAN APLIKASI MOBILE BERITA TEKNOLOGI Sujarwo, Herlina Harahap 12, Risko Liza 22 Jurusan Teknik Informatika Sekolah Tinggi Teknik Harapan Medan Jl.H.M. Jhoni No.70 C, Medan 20217
[email protected] Abstrak Perkembangan android yang semakin maju membuat munculnya teknologi baru yang terus mendukung perkembangannya. Material design ialah sebuah teknologi baru pada android yang menawarkan tampilan lebih bersih yang berpadu dengan efek bayangan dan pencahayaan yang natural. Penggunaannya kerap membuat developer kagum akan hasil yang diperoleh. Pada studi ini penulis akan memanfaatkan material desain pada android untuk menghasilkan sebuah aplikasi berita teknologi. Konsep aplikasi berita berupa sebuah portal berita online yang akan memuat berbagai informasi perihal perkembangan dunia teknologi dan informasi. Aplikasi ini diharapkan dapat menjadi portal berita yang dapat memenuhi kebutuhan penggunanya dalam memperoleh informasi secara realtime dengan user interface yang memukau. Kata Kunci :
Android, Material Disain, Berita Teknologi. Abstract
The development of increasingly advanced android makes the emergence of new technologies that continue to support its development. Material design is a new technology in the android that offers a cleaner combined with the effects of shading and natural lighting. Its use is often made developer amazed at the results. In this study the authors will take advantage of the design on the material to produce an android application technology news. The concept of a news app in the form of an online news portal that will contain a variety of information about the development of technology and information. This application is expected to be a news portal that can meet the needs of its users in obtaining information in real time with a stunning user interface. Keywords: Android, Material Design, Technology News
1. Pendahuluan Android telah menjadi system operasi perangkat mobile yang sangat populer dalam beberapa tahun belakangan ini. Hal ini disebabkan android, dilengkapi dengan berbagai kemampuan yang mumpuni mulai kemampuan multimedia hingga kemampuannya dalam beradaptasi terhadap system kerja client server. Pada tahun 2014 kemarin android semakin melebarkan sayapnya dengan peluncuran android versi Lolipop dimana system operasi pada versi ini telah dilengkapi dengan desain menawan berupa material desain.[1] Google sebagai pengembang dari android sangat menyanjung konsep desain baru yang disebut material design. Menurut Google, material design ini menawarkan tampilan lebih bersih yang berpadu dengan efek bayangan dan pencahayaan natural. Intinya, material design akan membuat Android Lollipop kian top. Android Material Design dikenal dari desainnya yang nampak seperti paper, mempunyai z-level atau elevasi dan lebih kaya akan animasi di banding style sebelumnya. Material Design memungkinkan developer untuk membuat aplikasi yang kaya akan animasi dan mempunyai UI/UX yang menarik.
Berdasarkan teknologi terbaru seperti yang sudah di jelaskan di atas, penulis memiliki sebuah ide untuk mengimplementasikan keunggulan dari trobosan terbaru android yaitu android material desain untuk menghasilkan sebuah aplikasi berita online berkonsep “Berita Teknologi”. Konsep aplikasi Berita Teknologi berupa sebuah portal berita online yang akan memuat berbagai informasi perihal perkembangan dunia teknologi dan informasi. Aplikasi ini diharapkan dapat menjadi portal berita yang dapat memenuhi kebutuhan penggunanya dalam memperoleh informasi secara realtime. Tujuan dari penelitian ini ialah: 1. Mengimplementasikan penggunaan Android Material Desain pada aplikasi android. 2. Menghasilkan aplikasi portal berita online untuk perangkat mobile. 3. Mengembangkan aplikasi mobile berbasis android. Selain memiliki tujuan penelitian ini juga memiliki manfaat yang dapat di simpulkan sebagai berikut:
1.
2.
3.
Merupakan peluang untuk memperluas wawasan akademis terutama dalam bidang mobile teknologi Bagi pembaca, dapat dijadikan sebagai bahan acuan atau kajian khususnya dalam hal pengembangan aplikasi mobile Bagi masyarakat, hasil penelitian ini akan memberikan kemudahan dalam memperoleh berita dan informasi melalui sebuah perangkat mobile.
Identifikasi Masalah Beberapa masalah yang dapat diidentifikasikan yakni 1. Bagaimana mengimplementasikan penggunaan android material desain terhadap aplikasi android. 2. Bagaimana merancang dan menghasilkan aplikasi portal berita online bertajuk Berita Teknologi yang berisi berbagai informasi perihal teknologi dan informasi. 3. Bagaimana merancang android material disain pada aplikasi android. 4. Penyusunan segmentasi berita teknologi 5. Tidak membahas mengenai keamanan pada aplikasi yang dirancang. 6. Android material Desain akan digunakan sebagai library UI aplikasi. 7. Perancangan aplikasi akan menggunakan bahasa pemrograman Java serta MySQL sebagai databasenya. 8. Untuk sistem administrator aplikasi akan dibangun dengan bahasa pemrograman PHP dan HTML. 9. Aplikasi akan dibangun dengan Android Studio sebagai editornya. 10. Konten pada aplikasi berupa berita dan informasi seputar perkembangan dunia teknologi. 11. Berita yang ada pada aplikasi akan dibagi menjadi beberapa kategori. 12. Aplikasi hanya dapat dijalankan pada smartphone dengan sistem operasi android di atas versi Ice Cream Sandwich.
Aplikasi akan di desain dengan memanfaatkan android material desain sebagai librarynya. Hal ini akan memungkinkan aplikasi yang dihasilkan akan memiliki kemampuan serta tampilan yang lebih apik dengan berbagai efek animasi didalamnya. Dalam implementasinya, aplikasi akan dibangun dengan menggunakan Android Studio sebagai editornya, hal ini dipilih sebab Android Studio kini telah menjadi editor resmi dalam mengembangkan sebuah aplikasi android. Selain itu, aplikasi ini akan dibangun dengan kolaborasi bahasa pemrograman Java, PHP dan database MySQL secara bertahap hingga menghasilkan sebuah aplikasi yang
mengedepankan kemudahan menerima berita serta membagikannya kepada pengguna lainnya . Penelitian ini meliputi tinjauan singkat tentang penggunaan aplikasi dalam system informasi mobile, Pengetahuan mengenai manfaat anroid material disain dalam membangun aplikasi brita serta memfokuskan terhadap interaksi antara program komputer dan pengguna agar menjadi lebih baik dan mudah serta menarik dalam penggunaannya.
2. Analsis dan Perancangan Sistem Analisis ini bertujuan untuk mengetahui tentang apa saja kebutuhan yang dibutuhkan dalam membangun aplikasi mobile berita teknologi. Pada tahap analisis ini akan didapat garis besar dari sistem yang akan dibangun hingga kebutuhan apa saja yang diperlukan dalam proses perancangan aplikasi. Adapun ruang lingkup pembahasan dalam perancangan sistem ini ialah mengenai penerapan android material desain dalam perancangan aplikasi mobile berita teknologi. Untuk itu berikut beberapa kebutuhan yang diperlukan dalam membangun aplikasi meliputi. 1. Android material desain library. 2. Bahasa pemrograman android meliputi Java dan XML. 3. Bahasa pemrograman web meliputi PHP dan HTML. 4. Database MySQL. 5. Notepad ++. 6. XAMPP. 7. Server Online dan, 8. UML sebagai tools perancangan. Perancangan aplikasi mobile berita teknologi ini akan menggunakan android material desain. Adapun material design sendiri merupakan konsep desain baru yang ditawarkan oleh Google sebagai pengembang android. Android material desain menawarkan tampilan lebih bersih yang berpadu dengan efek bayangan dan pencahayaan natural. Intinya, material design akan membuat Android Lollipop kian top.[3] Android Material Design dikenal dari desainnya yang nampak seperti paper, mempunyai z-level atau elevasi dan lebih kaya akan animasi di banding style sebelumnya. Material Design memungkinkan developer untuk membuat aplikasi yang kaya akan animasi dan mempunyai UI/UX yang menarik. Analisis Fungsional Analisis fungsional disini merupakan pemaparan mengenai fitur-fitur yang akan dimasukkan dalam aplikasi ini. Adapun fitur-fitur yang akan ada pada aplikasi mobile berita teknologi ialah sebagai berikut.
1.
2.
3.
4.
5.
List Berita Fitur ini merupakan fitur yang menyediakan list daftar berita teknologi yang akan dimuat pada aplikasi. Fitur ini meliputi berita terbaru, populer hingga berita per kategori. Kategori Berita Fitur ini merupakan fitur yang menyediakan berita teknologi sesuai kategori berita yang ada pada aplikasi. Pencarian Fitur ini berfungsi sebagai layanan pencarian berita khususnya yang menyangkut dunia teknologi. Login dan Register Merupakan fitur yang berfungsi untuk melakukan login dan register pengguna sebelum dapat memberikan komentar pada setiap berita. Komentar Fitur ini bertujuan untuk memfasilitasi pengguna hingga dapat berkomentar pada setiap berita yang dimuat aplikasi.
Use case pada gambar 1 diatas merupakan gambaran dari interaksi pengguna dengan aplikasi mobile berita teknologi. Dari use case di atas dapat dilihat bahwa pengguna dapat melakukan beberapa interaksi dengan aplikasi meliputi lihat berita, lihat kategori, cari berita, beri komentar serta melakukan register dan login pengguna. Sedangkan use case pada admin dapat dilihat pada gambar 2. Sistem
Kelola Berita
Kelola Kategori Login
Kelola Komentar
Admin
Kelola User
Gambar 2. Use Case Diagram Admin Perancangan Sistem Pada perancangan kali ini akan memaparkan secara umum mengenai sistem yang akan dibangun dengan menggunakan UML sebagai media visualisasinya. UML sistem berupa use case diagram dan activity diagram pada aplikasi mobile berita teknologi.[2] Use case akan menggambarkan secara grafis bagaimana interaksi antara sistem dengan pengguna. Berikut use case diagram dari aplikasi mobile berita teknologi yang di bagi menjadi use case diagram pengguna dan use case diagram admin.[2] Sistem
Pada use case admin diatas administrator dari aplikasi mobile berita teknologi dapat dilihat bagaimana interaksi antara administrator dengan aplikasi. Dimana seorang administrator dapat melakukan beberapa interkasi terhadap sistem atau aplikasi meliputi kelola berita, kelola kategori, kelola user dan kelola komentar pada aplikasi. Activity diagram ini akan menggambarkan tentang bagaimana proses yang terjadi pada aktivitas login admin pada aplikasi. Berikut Activity diagram login admin dari aplikasi mobile berita teknologi dapat dilihat pada gambar 3. Mulai
Berita
Akses Web
Kategori
Input username dan password
Validasi Username dan password
[ tidak valid ]
Cari
[ valid ]
Masuk ke Menu Utama
Pengguna Login dan Register
Selesai
Komentar
Gambar 3. Activity Diagram Login Admin Gambar 1. Use Case Diagram Pengguna
Activity diagram pada gambar 3 diatas merupakan gambaran dari aktivitas login admin pada aplikasi mobile berita teknologi. Dari activity di atas dapat dilihat bahwa aktivitas yang terjadi pada proses login diawali dengan seorang admin mengakses web dan diakhiri dengan masuk ke menu utama aplikasi.
3. Implementasi Sistem Pada implemenasi sistem ini hasil dari perancangan sebelumnya, akan dirubah serta diimplementasikan ke dalam bentuk bahasa pemrograman sehingga menghasilkan sebuah aplikasi. Adapun hasil implementasi disini diambil langsung menggunakan smartphone dengan sistem operasi android. Berikut hasil implementasinya. 1.
Tampilan aplikasi ini akan terlihat ketika pengguna pertama kali menjalankan aplikasi. Seperti pada gambar 4. berikut ini. Gambar 5. Tampilan Halaman Home Aplikasi Berita Pada tanpilan halaman diatas dapat dilihat hasil rancangan dari halaman home aplikasi mobile. Pada halaman ini terdapat sebuah gambar dengan desjripsi singkat mengenai aplikasi. 3.
Berikut ini adalah tampilan menu aplikasi, Sepaerti pada gambarb 6. berikut.
Gambar 4. Tampilan Aplikasi memuat halaman 2.
Setelah aplikasi memuat halaman berikutnya aplikasi akan masuk ke halaman home aplikasi, Seperti pada gambar 4.
Gambar 6. Tampilan Halaman Menu Aplikasi
Pada tanpilan halaman diatas dapat dilihat hasil rancangan dari halaman menu aplikasi mobile. Pada halaman ini terdapat sebuah list yang berisi menu yang akan membawa pengguna kepada halamanhaaman lainnya pada aplikasi. 4.
Pada gambar 7. menunjukkan tampilan halaman list berita.
Gambar 8. Tampilan Halaman Detail Berita Pada tanpilan halaman diatas dapat dilihat hasil rancangan dari halaman detail berita dari aplikasi mobile. Pada halaman ini terdapat sebuah gambar dengan judul dan deskripsi mengenai isi berita.
Gambar 7. Tampilan Halaman List Berita Pada tanpilan halaman diatas dapat dilihat hasil rancangan dari halaman list berita pada aplikasi mobile. Pada halaman ini terdapat sebuah list yang akan memuat daftar berita yang ada pada aplikasi. Pada halaman ini pengguna dapat melihat detail berita. 5.
Pada gambar 7. berikut ini merupakan tampilan salah satu halaman detail berita.
4. Kesimpulan Dari beberapa penjelasan dan uraian pada bab sebelumnya ditarik beberapa kesimpulan dalam penelitian ini yaitu sebagai berikut : 1. Dalam memaparkan proses yang terjadi pada sistem yang dibangun penulis menggunakan UML sebagai alat bantu visualisasi sistem. 2. Output dari perancangan ini berupa artikel atau informasi berita online yang mengupas seluk beluk dunia teknologi. 3. Tercapainya tujuan dari penelitian ini yaitu untuk menghasilkan aplikasi portal berita online. 4. Selain itu, hasil dari penelitian ini didapat pula database yang dijadikan sebagai media penyimpanan informasi pada aplikasi ini yang terdiri dari tabel-tabel berupa tabel admin, tabel kategori, tabel berita dan tabel komentar. 5. Pemanfaatan Android Material Desain dirasa cukup membuat tampilan aplikasi jauh lebih menarik dan interaktif
5. Daftar Pustaka [1]Nazruddin Safaat, 2012, Pemrograman Aplikasi Mobile Smartphone dan Table PC berbasis Android(Edisi Revisi, Penerbit Informatika Bandung, Bandung [2]Sugiarti, Yuni. 2013. Analisis & Perancangan UML [Unifield Modelling Language] Generated VB.6, Penerbit Graha Ilmu, Yogyakarta [3]Utomo, Victor, 2010, Pengembangan Sistem Pengumpulan Data Menggunakan Aplikasi Mobile dan Web Service, Naskah Pubilkasi STMIK PROVISI, Semarang, diakses pada tanggal 8 Juni 2016.
