Penerapan Jquery Mobile Pada Sistem Informasi Potensi...

Penerapan Jquery Mobile Pada Sistem Informasi Potensi Akademik

SMA dan SMK di Palembang

Mentari Jalesi Rianto1, Ilman Zuhri Yadi2, Eka Puji Agustini3

Mahasiswa Teknik Inpformatika Universitas Bina Darma1,

Dosen Ilmu Komputer 2, Dosen Ilmu Komputer2 .

Jl Jend A.Yani No.12 Plaju, Palembang 30264

Email : [email protected], [email protected],

[email protected] .

Abstrak. Dalam mendapatkan informasi tentang pendidikan yaitu potensi akademik dimana masyarakat

harus datang langsung ke sekolah atau membuka website untuk mendapatkan informasi sekolah. Sistem

informasi potensi akademik berbasis mobile yang akan dibangun memanfaatkan perkembangan teknologi

informasi saat ini. Mobile dipilih karena tingkat perkembangan perangkat bergerak yang sangat tinggi,

tingkat penggunaan yang relatif mudah, dan harga perangkat yang semakin terjangkau, dibanding perangkat

komputer personal. Tujuan penelitian ini adalah untuk membangun sebuah sistem informasi potensi

akademik SMA dan SMK di Palembang dengan menerapkan jQuery Mobile. JQuery Mobile adalah sebuah

framework javascript untuk tampilan yang telah dioptimalkan untuk smartphone. Dalam perangkat lunak

ini dihasilkan sebuah sistem informasi potensi akademik SMA dan SMK di Palembang dengan penerapan

jQuery Mobile melalui smartphone. Metode pengembangan perangkat lunak yang digunakan dalam

penelitian ini adalah metode Mobile–D. Mobile-D yang terdiri dari lima tahap seperti : Explore, initialize,

productionize, stabilize, system tes and fix.

Kata Kunci : Sistem Informasi, Potensi Akademik, jQuery Mobile.

1. PENDAHULUAN

Di era masa kini telepon

genggam disebut menjadi smartphone, alat

yang dapat digunakan banyak hal selain

untuk berbicara jarak jauh maupun

mengirim pesan singkat. Smartphone atau

yang disebut juga piranti pintar dewasa ini

menjadi trend yang mewabah di Indonesia.

Dari data yang didapat penggunaan

smartphone di tanah air mengalami

peningkatan yang cukup signifikan. Hingga

kuartal pertama 2015 lonjakan penggunaan

smartphone mencapai angka 43% jika

dibandingkan dengan penetrasi yang terjadi

di tahun lalu yaitu 28% (Consumer

Barometer, 2015).

Lebih lanjut, data menunjukkan

bahwa 4 dari 10 orang di Indonesia lebih

memilih perangkat smartphone untuk

mengakses berbagai kebutuhan

dibanding gadget lainnya. Lengkapnya,

43% perangkat smartphone dipilih

pengguna dibanding komputer yang hanya

mailto:[email protected]



terpatok di angka 15% dan perangkat tablet

di angka 4 % saja (Consumer Barometer,

2015). Bentuk pemanfaatan dari kemajuan

teknologi informasi dapat menjadi sebagai

media pembelajaran, media bisnis, media

layanan kesehatan, media layanan

pendidikan, media hiburan, dan media

pemberian informasi. Dengan

perkembangan teknologi informasi saat ini

menuntut suatu sistem dimana pengguna

smartphone dapat mendapatkan informasi

yang dibutuhkan secara cepat.

Sama hal nya dalam mendapatkan

informasi tentang pendidikan yaitu potensi

akademik dimana masyarakat harus datang

langsung ke sekolah untuk menanyakan

seputar akreditasi, persayaratan untuk

mendaftar, proses pengurusan lintas rayon,

dan informasi sekolah, atau dengan cara

membuka website sekolah. Namun ada

beberapa website yang tidak memberikan

informasi tentang proses pengurusan lintas

rayon, informasi akreditasi, dan persyaratan

pendaftaran sekolah. Sama seperti SMA

dan SMK di Palembang, untuk mengetahui

informasi SMA dan SMK atau sebagai

bahan pertimbangan untuk memilih sekolah

yang akan di pilih, masyarakat dan orang

tua dapat datang langsung ke sekolah

sehingga membutuhkan waktu yang cukup

lama atau dapat juga dengan membuka satu

persatu website sekolah tersebut.

Berdasarkan permasalahan yang

ada maka akan dibangun sebuah sistem

informasi potensi akademik berbasis

mobile yang memanfaatkan perkembangan

teknologi informasi saat ini. Dengan

perkembangan teknologi informasi banyak

masyarakat yang sudah memiliki

smartphone dengan berbagai macam

kegunaan salah satunya seperti, ada yang

memiliki smartphone karena status sosial,

atau ada juga yang memiliki smartphone

karena tingkat pemahaman yang mudah

dimengerti dan praktis dalam mendapatkan

apa yang dibutuhkan.

Setiap smartphone dengan tipe dan

jenis yang berbeda maka menggunakan

platform yang berbeda pula, ada yang

menggunakan android, iOs, windows

phone dan blackberry. Dengan menerapkan

jquery mobile dapat membangun sistem

informasi potensi akademik dengan baik di

berbagai piranti operasi mobile. Contoh

piranti yang didukung jquery mobile antara

lain android, blackberry, iOs, windows

phone dan platform symbian sehingga

informasi tersebut dapat didapatkan di

berbagai piranti operasi mobile.

Dengan penerapan jquery mobile

pada sistem informasi potensi SMA dan

SMK di Palembang yang akan dibangun ini

diharapkan, dapat membantu masyarakat

dan calon pendaftar mendapatkan informasi

seputar SMA dan SMK yang dituju melalui

berbagai smartphone dan piranti operasi

mobile yang ada.

2. METEDOLOGI PENELITIAN

2.1. Metode Penelitian

Dalam penelitian ini metode

yang digunakan ialah metode penelitian

deskriptif menurut Nazir (2003 : 54) dalam

Lukman (2014 : 57) metode deskriptif

adalah suatu metode dalam meneliti status

sekelompok manusia, suatu objek, suatu set

kondisi, suatu sistem pemikiran ataupun

suatu kelas peristiwa pada masa sekarang.

Tujuan dari penelitian deskriptif ini adalah

untuk membuat deskripsi, gambaran atau

lukisan secara sistematis, faktual dan akurat

mengenai fakta-fakta, sifat-sifat serta

hubungan antar fenomena yang diselidiki.

2.2. Metode Pengumpulan Data

Metode yang digunakan dalam

pengumpulan data yaitu :

1. Metode Pengamatan. Dalam metode ini

akan melakukan pengumpulan data-data

melalui pengamatan dan mencatat hal-

hal yang berhubungan dengan data

dalam pembuatan potensi akademik

seperti data akreditasi sekolah,

persyaratan sekolah, prestasi sekolah

dan profil sekolah.

2. Metode Dokumentasi. Pada tahap ini

dilakukan dengan melihat arsip sekolah

tentang data yang dibutuhkan oleh

peneliti dalam pembangunan penerapan

jquery mobile pada sistem informasi

potensi akademik SMA dan SMK di

Palembang

2.3. Metode Pengembangan

Perangkat Lunak

Pada penelitian ini metode

pengembangan perangkat lunak yang

digunakan adalah metode mobile-d. Metode

pengembangan yang digunakan dalam

penelitian ini adalah metode Mobile–D.

Mobile-D memiliki spesifikasi yang

komprehensif untuk setiap fase dan tahap,

dan untuk tugas-tugas yang terkait. Metode

pengembangan Mobile-D terdiri dari

Explore, Initialize, Productionist, Stabilize,

dan System test and Fix.

3. Perancangan penerapan jquery

mobile pada sistem informasi

potensi akademik SMA dan SMK

di Palembang

3.1. Explore

Penulis merencanakan dan

menyusun proyek yang akan dikerjakan

berikut tahapan pada explore :

3.1.1 Stakeholder Establishment.

Pada tahap stakeholder

establishment terdapat beberapa hal yang

terdiri dari:

1. Pemilik Sistem (Owner System)

Pemilik sistem penerapan jqeury

mobile pada sistem informasi potensi

akademik SMA dan SMK di

Palembang ialah peneliti sendiri.

2. Pengguna Sistem (System User)

Pengguna sistem yang akan

menggunakan ialah orang tua calon

pendaftar, calon pendaftar, pihak

sekolah, dan masyarakat umum.

3. Desainer Sistem (System Designer)

Desainer sistem pada tahap ini yang

mendesain sistem ialah peneliti sendiri.

4. Pembangun Sistem (System Bulider)

Pembangun sistem pada tahap ini

spesialis teknis yang membangun

sistem ialah peneliti sendiri.

5. Analisis Sistem (System Analyst)

Analis sistem adalah spesialis yang

mempelajari masalah dan kebutuhan

sebuah organisasi untuk menentukan

bagaimana orang, data, proses dan

teknologi informasi dapat mencapai

kemajuan terbaik untuk bisnis.

3.1.2 Scope definition.

Tahapan yang dilakukan pada tahap

scope definition adalah :

1. Menetapkan waktu penerapan jquery

mobile pembangunan sistem informasi


Palembang yang diperkirakan dari

bulan Oktober 2015 dan berakhir pada

bulan Januari 2015.

2. Sistem informasi potensi akademik

SMA dan SMK di Palembang yang akan

dibangun ini berbasis mobile dengan

penerapan jQuery Mobile, mendukung

sistem operasi android, blackberry, iOs,

dan Windows Phone. Namun dalam

penelitian ini penulis menggunakan

smartphone dengan samsung galaxy j1

Ace dengan layar sebesar 4.3″ dengan

menggunakan OS Android Kitkat 4.4.4.

3.1.3 Project establishment.

Berikut beberapa tahapan yang

dilakukan pada tahapan project establishment :

1. Pada pembangunan sistem informasi

potensi akademik ini menggunakan PHP,

HTML5, CSS, dreamweaver dan javascript.

2. Penulis mempersiapkan data-data yang

diambil dari SMA N 1 sampai dengan SMA

N 22 dan SMK N 1 sampai dengan SMK N

8 kecuali SMA N 9, SMA N 13, SMA N 19,

dan SMK N 2 Palembang. Data yang

diambil berupa data akreditasi, persyaratan

masuk, pengurusan lintas rayon, syarat

pindah ke sekolah, syarat pindah dari

sekolah, prestasi, dan profil sekolah.

3.2. Initialize

Adapun tahapan dari initialize sebagai

berikut :

3.2.1 Project Set-U

Berikut beberapa tahapan yang

dilakukan pada tahap project set-u terdiri dari :

1. Software.

Mempersiapkan software yang akan

digunakan yaitu dreamwever dan php my

admin.

2. Data.

Data-data potensi akademik SMA dan SMK

di Palembang yang meliputi data akreditasi,

persyaratan masuk, pengurusan lintas rayon,

syarat pindah ke sekolah, syarat pindah dari

sekolah, prestasi, dan profil sekolah.

3. Hardware.

Hardware yang menunjang pembangunan

penerapan jquery mobile pada sistem

informasi potensi akademik SMA dan SMK

di Palembang ini, yakni:

a. Laptop Acer Aspire V5-431, dengan

RAM 2 GB, processor intel celeron.

b. Smartphone Samsung Galaxy j1 ace

dengan menggunakan andoid KitKat

4.4.4.

3.2.2 Planning day.

Berikut tahapan yang dilakukan pada

planning day yaitu :

1. Penulis mengelompokkan data-data yang

didapat sesuai dengan isi perangkat lunak

yang akan dibangun.

2. Penulis mempersiapkan coding yang dibuat

masih dalam bentuk pseudocode.

Pseudocode, berarti bukanlah kode program

yang sebenarnya, melainkan dengan

menggunakan simbol-simbol yang mirip

atau menyerupai kode program yang ditulis

dengan menggunakan suatu bahasa

pemograman tertentu (Rahmat, 2010).

3. Penulis membuat jadwal pembangunan

sistem informasi potensi akademik SMA

dan SMK di Palembang, yaitu :

a. Oktober penulis melakukan pengajuan

judul proposal, menyusun proposal,

membuat surat izin untuk melakukan

penelitian dan setelah surat keluar

penulis memasukan surat izin ke SMA

dan SMK Negeri di Palembang

b. November penulis melakukan penyusan

proposal, mengumpulkan data-data,

ujian proposal, dan revisi dari hasil ujian

proposal.

c. Desember penulis melanjutkan

pengumpulan data, mengelompokkan

data dan menyusun skripsi.

d. Januari penulis melanjutkan penyusunan

skripsi, melakukan pengcodingan yang

sudah dirancangan sampai selesai,

kemudian melakukan system test and fix

terhadap perangkat lunak yang telah

dibangun.

Jadwal diatas dapat dilihat pada gambar

1 jadwal penelitian sebagai berikut :

Gambar 1. Jadwal Penelitian

3.2.3 Hari Percobaan (Working Day dan

Release Day).

Penulis membuat rancangan sistem

informasi potensi akademik SMA dan SMK di

Palembang dan akan merilis yang telah dibuat.

Pada tahap perancangan model sistem untuk

penerapan jquery mobile pada sistem informasi


Palembang terdiri dari use case diagram,

diagram activity, rancangan database,

rancangan antar muka.

3.2.3.1 Use case diagram.

Berikut use case diagram yang

menjelaskan apa yang akan dilakukan oleh

sistem dengan pengguna dapat dilihat pada

gambar 2 use case diagram dibawah ini :

Gambar 2. Use Case Diagram

3.2.3.3 Rancangan Basis Data

Rancangan basis data untuk

perangkat lunak yang akan dibangun ini terdiri

dari tabel sekolah, tabel akreditasi, tabel syarat,

tabel prestasi, dan tabel kontak yang akan

dijelaskan dibawah ini :

a. Rancangan Tabel Akreditasi

Pada tabel sekolah terdiri dari no, nama,

type, size¸ dan keterangan yang berisikan

record idAkreditasi yang merupakan primary

key, nama merupakan nama akreditasi,

keterangan merupakan keterangan dari

akreditasi, dan instansi merupakan nama

instansi dari akreditasi. Rancangan tabel

akreditasi dapat dilihat pada tabel 1 tabel

akreditasi sebagai berikut :

Tabel 1. Tabel Akreditasi

b. Rancangan Tabel Jenis

Pada tabel jenis terdiri dari no, nama, type,

size¸ dan keterangan yang berisikan record

idJenis sebagai primary key, nama merupakan

nama dari jenis sekolah dan keterangan yaitu

keterangan dari jenis sekolah. Dapat dilihat

pada tabel 2 rancangan tabel jenis sebagai

berikut :

Tabel 2 Tabel jenis

No Nama Type Size Keterangan

1 IdJenis Int 4 Primary Key

2 Nama Varchar 10

3 keterangan Varchar 25

c. Rancangan Tabel Pengguna

Pada tabel pengguna terdiri dari no, nama,


record userid sebagai primary key, passid yaitu

password dari user, level yaitu level dari

usserid. Dapat dilihat pada tabel 3 tabel

pengguna sebagai berikut :

Tabel. 3 Tabel Pengguna


1 Userid Varchar 10 Primary Key

2 Passid Varchar 200

3 Level Varchar 10

d. Racangan Tabel Prestasi

Pada tabel prestasi terdiri dari no, nama,


record idPrestasi sebagai primary key,

idSekolah yaitu id dari sekolah, nama yaitu

nama dari prestasi, level merupakan level dari

prestasi, event yaitu event dari prestasi, tahun

yaitu tahun dari prestasi yang didapat.

Rancangan tabel prestasi dapat dilihat pada

tabel 4 tabel prestasi sebagai berikut :


1 IdAkreditasi Int 4 Primary Key

2 Nama Varchar 10

3 keterangan Varchar 20

4 instansi Varchar 25

System

Pengguna Admin

Login

Edit Informasi

Delete Informasi

Tambah Informasi

Lihat Informasi Potensi Akademik

Tabel. 4 Tabel Prestasi


1 idPrestasi Int 4 Primary Key

2 idSekolah Int 4

3 nama text

4 level Varchar 20

5 event Varchar 100

6 tahun Int 4

e. Rancangan Tabel Sekolah

Pada tabel sekolah terdiri dari no, nama,


record idSekolah sebagai primary key idJenis

yaitu id dari jenis sekolah, nama yaitu nama

dari sekolah, idAkreditasi yaitu id dari

akreditasi jenis sekolah, alamat yaitu alamat

dari sekolah, telepon adalah nomor telepon dari

sekolah, dan syarat yaitu syarat masuk ke

sekolah. Rancangan tabel sekolah dapat dilihat

pada tabel 5 tabel sekolah sebagai berikut :

Tabel. 5 Tabel Sekolah


1 idSekolah Int 4 Primary Key

2 idJenis Int 4

3 nama Varchar 50

4 idAkreditasi Int 4

5 alamat text

6 telepon Varchar 15

7 syarat text

3.2.3.4 Rancangan Antar Muka

Berikut gambar rancangan antar

muka yang akan dirilis dapat dililhat pada

gambar di bawah ini :

a. Rancangan Menu

Rancangan Menu. Pada gambar 3.3

memperlihatkan tampilan menu awal saat

membuka sistem informasi potensi akademik

SMA dan SMK di Palembang yang berisikan

akreditasi, syarat, prestasi dan profil sekolah.

Berikut gambar dari rancangan menu :

Gambar 3. Rancangan Menu

a. Rancangan Akreditasi

Rancangan akreditasi memperlihatkan

akreditasi dari sekolah yang ingin dilihat. Jika

ingin melihat daftar sekolah yang memiliki

akreditas A, B dan C sebelumnya harus

memilih akreditasi yang ingin di lihat

sekolahnya seperti gambar 4 di bawah ini :

Gambar 4 Rancangan Akreditasi

Setelah memilih nama sekolah langsung pilih

lihat akreditasi sekolah, maka akan keluar

informasi berupa daftar nama sekolah yang

akreditasi sekolahnya yang telah dipilih

sebelumnya, dapat dilihat pada gambar 5

sebagai berikut :

Gambar 5 Rancangan Isi Akreditasi

b. Rancangan Syarat

Rancangan syarat memperlihatkan syarat

dari sekolah yang ingin dilihat. Pilih sekolah

yang ingin dilihat informasi syarat masuknya

dapat dilihat pada gambar 6 berikut :

Gambar 6 Rancangan Syarat

Setelah memilih sekolah yang ingin dilihat

informasi syarat masuknya selanjutnya pilih

cek syarat masuk dan akan tampil isi dari

informasi syarat masuk sekolah yang telah

dipilih, dapat dilihat pada gambar 7 sebagai

berikut :

Gambar 7 Rancangan Isi Syarat

c. Rancangan Prestasi

Rancangan prestasi memperlihatkan

prestasi dari sekolah yang ingin dilihat. Jika

ingin mengetahui prestasi yang didapat oleh

sekolah baik didapat melalui ekstrakulikuler

maupun akademik dapat milih sekolah yang

ingin dilihat prestasinya, dapat dilihat pada

gambar 8 sebagai berikut :

Gambar 8 Rancangan Prestasi

Setelah memilih sekolah selanjutnya pilih lihat

prestasi maka akan keluar informasi dari

prestasi yang didapat oleh sekolah yang telah

dipilih sebeumnya, dapat dilihat pada gambar 9

berikut :

Gambar 9 Rancangan Isi Prestasi

d. Rancangan Profil

Rancangan profil memperlihatkan profil

dari sekolah yang ingin dilihat. Rancangan

profil akan menampilkan pilih sekolah dan lihat

prestasi, jika ingin melihat profil dari sekolah

sebelumnya harus memilih sekolah yang ingin

dilihat profilnya, dapat dilihat pada gambar 10

berikut :

Gambar 10 Rancangan Profil

Setelah memilih sekolah yang ingin dilihat

selanjutnya pilih lihat profil maka akan tampil

isi dari profil sekolah yang ingin dilihat, dapat

dilihat pada gambar 11 sebagai berikut :

Gambar 11 Rancangan Isi Profil

4. HASIL

Tahapan mobile-d yang terdapat pada hasil

pembuatan penerapan jquery mobile pada sistem


Palembang, yaitu productionize, stabilize,

system test and fix.

4.1.1 Productionize

Ada tiga tahapan pada productionize

terdiri dari tahapan sebagai berikut :

4.1.1.1 Planning Day

Penulis mempersiapkan data-data yang

telah dikelompokkan untuk di input ke dalam

perangkat lunak yang akan dibangun.

4.1.1.2 Working Day

Dalam tahap working day penulis

melakukan pencarian coding program untuk

perangkat lunak penerapan jquery mobile pada

sistem informasi potensi akademik SMA dan

SMK di Palembang yang akan dibangun.

4.1.1.3 Release Day

Adapun tahapan pada release day yaitu

mengumpulkan coding program yang

berkemungkinan tidak terjadi error dan

menangani setiap kesalahan dalam

pembangunan perangkat lunak ini.

4.1.2 Stabilize

Pada tahap stabilize terdapat empat

tahapan terdiri dari :


Dalam tahapan planning day penulis

melakukan tes penggunaan, yaitu apakah

terdapat error pada perangkat lunak penerapan

jquery mobile pada sistem informasi potensi

akademik SMA dan SMK di Palembang, tes

dilakukan menggunakan emulator.

4.1.2.2 Working Day

Ada dua tahap yang dilakukan pada

tahap working day terdiri dari :

a. Memecahkan masalah dalam pembuatan

perangkat lunak penerapan jquery mobile

pada sistem informasi potensi akademik

SMA dan SMK di Palembang, yakni

setiap ada terjadi kesalahan maka akan

dilakukan perbaikkan.

b. Kegiatan memulai pembangunan

penerapan jquery mobile pada sistem

informasi potensi akademik SMA dan

SMK di Palembang.

4.1.2.3 Documentation wrap-up

Pada tahap documentation wrap-up

melakukan dokumentasi dalam pembangunan



Palembang yaitu berupa screenshoot coding

program dan hasil perangkat lunak yang sudah

dibuat. Dapat dilihat pada gambar 4 coding

jquery sebagai berikut :

Gambar 4. Coding jquery

4.1.2.4 Release Day

Dalam tahap release day memastikan

bahwa perangkat lunak penerapan jquery

mobile pada sistem informasi potensi akademik

SMA dan SMK di Palembang sudah siap untuk

digunakan, dan memastikan sesuai dengan

rancangan awal. Berikut tampilan dari

perangkat lunak penerapan jquery mobile pada

sistem informasi potensi akademik SMA dan

SMK di Palembang dapat dilihat pada gambar

dibawah ini :

a. Tampilan Menu

Tampilan menu adalah tampilan yang

menampilkan menu – menu dari aplikasi

potensi akademik, pengguna aplikasi ini dapat

melihat informasi sekolah yang meliputi

informasi akreditasi, syarat masuk, prestasi dan

profil sekolah. Dapat dilihat pada gambar 5

tampilan menu sebagai berikut :

Gambar 5. Tampilan Menu

b. Tampilan Akreditasi

Pada tampilan akreditasi jika pengguna

ingin melihat akreditasi sekolah, dari menu

utama pilih akreditasi selanjutnya pengguna

akan menemukan sub menu yaitu pilih

akreditasi dan lihat akreditas sekolah. Berikut

gambar dari tampilan akreditasi :

Gambar 6. Tampilan akreditasi

Pada tampilan sub menu akreditasi terdapat

menu pilih akreditasi yaitu berisikan akreditasi

dari A sampai dengan C dimana untuk dapat

melihat akreditasi SMA dan SMK N pengguna

harus memilih akreditasi terlebih dahulu. Dapat

dilihat pada gambar tampilan sub menu

akreditasi dibawah ini :

Gambar 6. Tampilan pilih akreditasi

Setelah pengguna memilih sekolah yang ingin

dilihat akreditasinya selanjutnya pengguna

dapat memilih lihat akreditas sekolah, sebagai

contoh penulis memilih akreditasi A. Untuk

lebih jelasnya dapat digambarkan pada gambar

lihat akreditasi sebagai berikut :

Gambar 7 Tampilan Lihat Akreditas Sekolah

Setelah pengguna memasukan akreditasi dan

memilih lihat akreditas sekolah selanjutnya

akan tampil informasi berupa daftar sekolah

yang akreditasinya adalah A dan jika pengguna

ingin melihat akreditasi dari sekolah lainnya

pengguna dapat memilih kembali sekolah yang

ingin dilihat dan jika pengguna ingin kembali

ke menu awal dapat memilih tombol yang

bersimbolkan home disebelah kiri atas. Untuk

lebih jelas dapat dilihat pada gambar isi dari

akreditasi SMA N 1 Palembang sebagai berikut

:

Gambar 8 Tampilan Isi Akreditasi

c. Tampilan Syarat Masuk

Pada tampilan syarat masuk jika pengguna

ingin melihat syarat – syarat untuk mendaftar,

syarat untuk lintas rayon, dan syarat pindah

sekolah, dari menu utama pilih syarat masuk,

selanjutnya pengguna akan menemukan sub

menu yaitu pilih sekolah dan cek syarat masuk.

Dapat dilihat pada gambar tampilan syarat

masuk sebagai berikut :

Gambar 9. Tampilan syarat masuk

Pada tampilan sub menu syarat masuk terdapat

menu pilih sekolah yaitu berisikan nama –

nama dari SMA N dan SMK N di Palembang

dimana untuk dapat melihat syarat masuk

pengguna harus memilih nama sekolah terlebih

dahulu. Dapat dilihat pada gambar tampilan sub

menu syarat masuk berikut :

Gambar 10 Tampilan Pilih Sekolah Syarat

Masuk

Setelah pengguna memilih sekolah yang syarat

masuknya ingin dilihat selanjutnya pengguna

dapat memilih cek syarat masuk, sebagai

contoh penulis memilih SMA N 1 Palembang

untuk melihat syarat masuk dari SMA N 1

tersebut. Dapat dilihat pada gambar cek syarat

masuk dibawah ini :

Gambar 11 Tampilan Cek Syarat Masuk

Setelah pengguna memasukan nama sekolah

dan memilih cek syarat masuk selanjutnya akan

tampil informasi berupa syarat – syarat dari

SMA N 1 Palembang yang telah dipilih

sebelumnya dan jika pengguna ingin melihat

syarat masuk dari sekolah lainnya pengguna

dapat memilih kembali sekolah yang ingin

dilihat dan jika pengguna ingin kembali ke

menu awal dapat memilih tombol yang

bersimbolkan home disebelah kiri atas. Untuk

lebih jelas dapat dilihat pada gambar isi dari

syarat SMA N 1 Palembang dibawah ini :

Gambar 12 Tampilan Isi Syarat Masuk

d. Tampilan Prestasi

Pada tampilan prestasi jika pengguna ingin

melihat prestasi yang di dapat oleh sekolah baik

akademik maupun prestasi dari ekstrakulikuler

dapat memilih dari menu utama pilih prestasi,

selanjutnya pengguna akan menemukan sub

menu yaitu pilih sekolah dan lihat prestasi.

Dapat dilihat pada gambar tampilan prestasi

sebagai berikut :

Gambar 13 Tampilan Prestasi

Pada tampilan sub menu prestasi terdapat menu

pilih sekolah yaitu berisikan nama – nama dari

SMA N dan SMK N di Palembang dimana

untuk dapat melihat prestasi yang didapat

sekolah pengguna harus memilih nama sekolah

terlebih dahulu. Dapat dilihat pada gambar

tampilan sub menu prestasi berikut :

Gambar 14 Tampilan Pilih Sekolah Prestasi

Setelah pengguna memilih sekolah yang

prestasinya ingin dilihat selanjutnya pengguna

dapat memilih lihat prestasi, sebagai contoh

penulis memilih SMA N 1 Palembang untuk

melihat prestasi dari SMA N 1 tersebut. Untuk

lebih jelas dapat dilihat pada gambar tampilan

lihat prestasi sebagai berikut :

Gambar 15 Tampilan Lihat Prestasi


dan memilih lihat prestasi selanjutnya akan

tampil informasi berupa prestasi yang didapat

oleh SMA N 1 Palembang yang telah dipilih

sebelumnya dan jika pengguna ingin melihat

prestasi dari sekolah lainnya pengguna dapat

memilih kembali sekolah yang ingin dilihat dan

jika pengguna ingin kembali ke menu awal

dapat memilih tombol yang bersimbolkan home

disebelah kiri atas. Untuk lebih jelas dapat

dilihat pada gambar isi dari prestasi SMA N 1

Palembang dibawah ini :

Gambar 16 Tampilan Isi Prestasi

Jika pengguna ingin melihat lebih detail dari

prestasi yang didapat pengguna dapat memilih

salah satu dari nama prestasi sekolah tersebut

maka akan tampil detail dari prestasi yang di

dapat oleh SMA N 1 Palembang jika pengguna

ingin melihat detail lainnya dari SMA N 1

pengguna tinggal memilih tombol tanda X di

sebelah kiri atas dari tabel detail prestasi.

Gambar detail prestasi SMA N 1 Palembang

dapat dilihat pada gambar sebagai berikut :

Gambar 17 Tampilan detail prestasi

e. Tampilan Profil Sekolah

Pada tampilan profil sekolah jika pengguna

ingin melihat profil sekolah sekolah yang

berisikan informasi no telepon dan alamat

lengkap dari sekolah tersebut pengguna dapat

memilih yaitu dari menu utama pilih profil

sekolah selanjutnya pengguna akan

menemukan sub menu yaitu pilih sekolah dan

lihat profil. Berikut gambar dari tampilan profil

sekoolah :

Gambar 18 Tampilan Profil Sekolah

Pada tampilan sub menu profil sekolah terdapat

menu pilih sekolah yaitu berisikan nama –

nama dari SMA N dan SMK N di Palembang

dimana untuk dapat melihat profil sekolah

pengguna harus memilih nama sekolah terlebih

dahulu. Dapat dilihat pada gambar tampilan sub

menu profil sekolah dibawah ini :

Gambar 19. Tampilan Pilih Sekolah

Setelah pengguna memilih sekolah yang ingin

dilihat profilnya selanjutnya pengguna dapat

memilih lihat profil, sebagai contoh penulis

memilih SMA N 1 Palembang unuk melihat

profil dari SMA N 1 tersebut. Untuk lebih

jelasnya dapat digambarkan pada gambar lihat

profil sebagai berikut :

Gambar 20. Tampilan Lihat Profil


dan memilih lihat profil selanjutnya akan tampil

informasi berupa profil dari SMA N 1

Palembang yang telah dipilih sebelumnya dan

jika pengguna ingin melihat profil dari sekolah

lainnya pengguna dapat memilih kembali

sekolah yang ingin dilihat dan jika pengguna

ingin kembali ke menu awal dapat memilih

tombol yang bersimbolkan home disebelah kiri

atas. Untuk lebih jelas dapat dilihat pada

gambar isi dari profil SMA N 1 Palembang

sebagai berikut :

Gambar 21. Tampilan Lihat Profil

4.1.3 System test and fix

Dalam tahap system test and fix melihat

apakah penerapan jquery mobile pada sistem


Palembang menghasilkan fungsi dengan baik

dan telah memperbaiki kekurangan yang

ditemukan. Adapun tahapan dari system test

and fix ialah sebagai berikut :

4.1.3.1 System test

Pada tahap system test melakukan tes

pada penerapan jquery mobile pada sistem


Palembang, tes dilakukan dengan emulator.


Dalam tahap planning day

meningkatkan proses pembangunan perangkat

lunak penerapan jquery mobile pada sistem


Palembang agar sesuai dengan kebutuhan yang

sudah direncanakan dan memperbaiki

terjadinya error saat tes pada emulator.

4.1.3.3 Working Day

Dalam tahap working day akan

melakukan perbaikan pada perangkat lunak



Palembang agar sesuai dengan yang sudah

direncanakan.

4.1.3.4 Release Day

Pada tahap release day perangkat lunak

potensi akademik sudah siap untuk digunakan

sudah melalui tahap tes dan perbaikan pada saat

terjadinya error.

5. KESIMPULAN

Berdasarkan hasil dari penenlitian yang

telah dilakukan dapat disimpulkan sebagai

berikut :

1. Penerapan jquery mobile pada sistem

informasi potensi akademik SMA dan

SMK di Palembang telah dilakukan

pengujian menggunakan black box, hasil

dari pengujian adalah pengujian berhasil

sesuai dengan harapan.

2. Setelah dilakukan uji coba terhadap 10

pengguna diketahui bahwa penerapan

jquery mobile pada sistem informasi ini

adalah baik untuk digunakan, karena dapat

membantu pengguna dalam mendapatkan

informasi yang dibutuhkan.

DAFTAR RUJUKAN

Consumer Barometer.(2015), “Trended

Data” dari :

https://www.consumerbaromet

er.com/en/trending/?countryCo

de=ID&category=TRN-

NOFILTER-ALL Dilihat 21

November 2015

Lukman, Oktaviani. “Peran pamong satuan

karya pramuka wanabakti

dalam membina kemandirian

anggota melalui penerapan

sistem among”. “Skripsi

Universitas Pendidikan

Indonesia (2014):1-123”.

https://www.consumerbarometer.com/en/trending/?countryCode=ID&category=TRN-NOFILTER-ALL




Penerapan Jquery Mobile Pada Sistem Informasi Potensi...

Documents

Transcript of Penerapan Jquery Mobile Pada Sistem Informasi Potensi...