Projek akhir untuk kelas XI MIA adalah membuat aplikasi digital di Android. Tugas ini sebagai penutup materi semester genap mengenai teknologi tepat guna, yang saya aplikasikan pada bidang teknologi digital.

Sebelumnya siswa dikenalkan cara untuk membuat aplikasi di android, baik melalui situs dan menggunakan tool Appinventor. Pembuatan melalui situs adalah cara paling mudah membuat aplikasi di Android. Untuk pembelajaran tersebut siswa belajar melalui situs Appgeyser di sini. selanjutnya, siswa dikenalkan dengan tool Appinventor, untuk materi yang lebih advance.

Berikut ini adalah beberapa kreasi aplikasi yang dibuat oleh siswa kelas XI MIA. Semoga pengenalan terhadap materi ini dapat membuka wawasan dan pengetahuan serta membukakan jalan bagi mereka untuk mencintai dunia pemrograman. Kelak, siapa tahu, dari mereka akan lahir banyak pengembang aplikasi dari tanah air yang mumpuni yang karyanya dapat memberikan manfaat bagi banyak orang. Semoga ya, Nak :).

Aplikasi dapat diunduh di sini.

App Inventor atau AI adalah tool untuk membuat aplikasi android. Kelebihan AI adalah karena berbasis visual block programming sehingga kita bisa membuat aplikasi tanpa harus menuliskan kode program. Disebut block programming karena kita dapat langsung menyusun blok-blok yang berisikan simbol-simbol perintah dan fungsi tertentu dalam membuat aplikasi. Dengan App Inventor kamu dapat menggunakan imajinasi seluas-luasnya, seperti membuat games, tool barcode reader, aplikasi berbasis lokasi, aplikasi toko online, aplikasi untuk mengontrol LEGO robot dan lain-lain.

Selain untuk membuat aplikasi, App Inventor juga dapat digunakan untuk mengasah logika seperti halnya menyusun puzzle. Untuk programmer, App Inventor menyediakan opsi advance.

AI dapat dijalankan secara online dan offline. Untuk online, silakan langsung masuk ke laman AI di sini. Lalu klik Create apps.

Untuk offline, lakukan persiapan seperti di bawah ini.
Siapkan beberapa program aplikasi, sebagai berikut:
1. File Java JDK 1.7 (disarankan untuk menggunakan Java JDK versi 1.7 agar bisa membuka fitur Blocks pada App Inventor). File bisa diunduh di sini (sesuaikan dengan jenis processor PC/Laptop kita)
2. File AI2LiveComplete, unduh di sini
3. aistarter program (optional)
Program ini dibutuhkan ketika kita ingin menggunakan Emulator atau USB cable untuk melakukan uji coba aplikasi yang sedang dibuat. aiStarter berfungsi untuk menghubungkan antara App Inventor yang berjalan di browser dengan perangkat lain, misalnya HP Android atau Emulator.
(Jika kamu menggunakan AI Companion, maka tidak perlu menginstal program ini).

Selanjutnya, install Java Development Kit (JDK 1.7)
Double klik pada file jdk-7u79-windows-x64.exe (untuk komputer 64 bit) atau jdk-7u79-windows-i586.exe (untuk 32 bit). Lakukan instalasi seperti biasa. Jika instalasi berhasil, pada folder c:\program files\java akan terlihat folder jdk1.7.0_79

Kemudian, lakukan pengaturan pada Evironment variables dengan klik kanan This PC. Pilih Properties. Pada kotak dialog System, pilih Advance System Settings. Maka kotak dialog System Properties akan ditampilkan dan pilih Environment variables.

Pada kotak dialog Environment variables, arahkan mouse pada opsi JAVA_HOME. Klik Edit. Periksa apakah variable value berada di direktory yang benar (untuk contoh di komputer kami, file jdk berada di C:\Program Files\Java\jdk1.7.0_79

Jika di menu Edit belum ada atau kosong, maka pilih New dan isikan sebagai berikut:
Variable name : JAVA_HOME
Variable value : Isikan direktory dimana file jdk1.7.0_79 disimpan. Klik OK.

Memasang AI2Livecomplete
Ekstrak file AI2Livecomplete yang telah diunduh.

Menjalankan AI
Buka folder AILiveComplete. Double klik file WinstartAIServer.cmd
Tunggu sampai muncul jendela AiLiveComplete App Inventor

Selanjutnya, double klik file WinStartBuildServerWithHeap.cmd untuk menjalankan Build Server App Inventor, sehingga nanti kamu dapat melakukan compile file project menjadi file .apk

Kemudian, buka browser dan ketikkan http://localhost:888 di address bar untuk menampilkan halaman App Inventor. Ketikkan alamat email (alamat ini hanya sebagai syarat saja). Klik Login. Halaman App Inventor versi offline sudah tampil 🙂

App Inventor adalah salah satu tool untuk membuat aplikasi Android. App Inventor membuat fasilitas prototyping yang sangat baik karena kamu dapat langsung melihat hasilnya. Untuk menggunakan AI tidak harus bisa pemrograman. Namun demikian memiliki keterampilan bahasa pemrograman akan lebih baik nantinya. AI membantu kamu melatih pemahaman algoritma dan logika.

Untuk menggunakan App Inventor (AI) ada 2 cara, online dan offline.

Untuk online, silakan masuk ke official web site mereka di http://appinventor.mit.edu/explore/ atau klik langsung di sini.
Oya, kamu harus memiliki akun gmail.

Langkah berikutnya, membuat aplikasi Talk To Me.
Talk To Me adalah aplikasi berisi sebuah message (pesan) tertulis yang disuarakan. Sederhananya, ketika kamu menekan sebuah tombol maka akan mengeluarkan suara. Suara itu hasil sebuah pesan tertulis yang diterjemahkan ke dalam suara (sound).

Cara membuat aplikasi Talk To Me:
1. Klik Create apps.
3. Klik Start new project di tampilan MIT App Inventor 2
4. Ketikkan nama aplikasi yang diinginkan. Klik Ok.
5. Akan muncul App Inventor Designer, tampilan ini berfungsi untuk merancang dan membuat antarmuka atau interface pengguna aplikasi kita.

Designer dibagi menjadi 4 kolom, yaitu:
– Palette, menyediakan komponen yang digunakan untuk membangun UI (user interface). Palet ini dibagi menjadi beberapa bagian (section) sesuai dengan jenis komponen.
– Viewer, merepresentasikan layar smartphone dan digunakan untuk tata letak komponen UI.
– Components pane memperlihatkan pandangan berbeda yang telah kita tempatkan di Viewer. Kita bisa mengatur pandangan agar tumpukan komponen tersusun secara teratur.
– Properties pane berisi daftar semua pengaturan untuk komponen yang saat itu kita pilih. Kita akan menggunakan ini untuk menyesuaikan setiap komponen.

6. Klik User Interface di palette. Klik Button dan tarik ke kolom Viewer. Untuk mengubah teks, perhatikan menu Properties. Ketikkan Click here.

7. Selanjutnya, pilih menu Media. Klik TextToSpeech. Tombol TextToSpeech tidak akan tampak di viewer namun kamu bisa melihatnya di kolom Components.

8. Jika telah selesai, saatnya membuat program agar aplikasi dapat dijalankan. Klik opsi Blocks di sudut kanan jendela AppInventor.

9. Buat programnya. Klik Button1. Pilih block seperti di bawah ini.

10. Klik tombol TextToSpeech1 dan pilih block seperti tampak di gambar Tempatkan seperti gambar berikut ini.

11. Selanjutnya, klik tombol Text. klik block dengan tanda kutip. Susun seperti gambar di bawah ini. Ketikkan teks pesanmu. Contoh: Hello World.

12. Arti program di atas adalah:
Jika tombol Button1 di klik maka lakukan panggil teks berisi pesan yang akan disuarakan.

13. Jika telah selesai, simpan file mu.
14. Untuk menguji hasil aplikasi pilih menu Build. Klik App(save .apk to my computer). Opsi ini akan menyimpan file apk ke dalam kmputermu.

15. Selanjutnya, transfer file ke gawai (gadget android). Langkahnya sama seperti kamu memindahkan file .apk di praktik pembuatan aplikasi dengan Appsgeyser.

Nah, kamu sudah berhasil membuat aplikasi pertama dengan AppInventor 🙂

catatan:
Appinventor memberikan fitur simulator telepon genggam untuk menguji hasil aplikasi yang kita buat. Dengan menggunakan simulator maka akan memudahkan kamu untuk melihat hasil aplikasi dengan cepat. Langkah yang harus kamu lakukan adalah menginstall software Android emulator dan desainer. Keduanya adalah aplikasi java. Jangan lupa, kamu harus memastikan bahwa Java dan browser (Firefox) yang terinstal di komputermu adalah versi terbaru. Untuk memeriksa dapat dengan melihat di Java test Page di sini.

Jika Java sudah terinstall, unduh App Inventor Setup software package di sini (101 MB).

Jika semua persyaratan di atas telah terpenuhi, maka untuk menguji aplikasi yang telah kita buat cukup dengan mengeklik menu Connect. Klik Emulator. Sebelumnya jangan lupa untuk membuka file emulator yang ada di desktop dengan cara mengeklik ikon aistarter dua kali sampai muncul gambar di bawah ini.

Kemudian, tunggu lah sampai muncul simulator gadget dengan tampilan aplikasi buatanmu di layar HP.

Fitur ini sangat berguna bagi kamu terutama yang tidak memiliki telepon genggam android. Dengan demikian kamu tetap bisa membuat aplikasi. Asyik, bukan? 🙂

Selanjutnya, cara melakukan instalasi offline AppInventor, di tulisan berikut ya 🙂

Oya, ini suasana kelas ketika belajar membuat aplikasi sederhana di AppInventor dan belajar melakukan instalasi softaware emulator dan desainer.

Android merupakan salah satu platform yang banyak digunakan oleh ponsel pintar di seluruh dunia. Tak heran jika kemudian bermunculan banyak peluang bagi pengembangan aplikasi ini. Membuat aplikasi yang dulunya terkesan sulit saat ini tidak lagi.

Pada pertemuan minggu ini siswa akan belajar mencoba mengembangkan aplikasi Android secara mudah dan cepat dengan Appsgeyser. Appsgeyser adalah tool yang dapat diakses melalui browser untuk membangun sebuah aplikasi di Android.

Pertama kali, buat akun baru di laman ini. Kemudian Create apps. Appsgeyser memberikan banyak pilihan aplikasi yang dapat dibuat, seperti game, ebook, messenger, aggregator berita, toko online dan sebagainya.

Setelah aplikasi berhasil dibuat, kamu dapat mengunduhnya. Kemudian salin file .apk ke dalam ponsel pintarmu dengan menggunakan kabel data atau cara lain yang mudah menurutmu. Selanjutnya buka file unduhan di dalam file manajer yang ada di ponsel pintar. Dan jalankan.

Oya, kamu juga dapat mempublikasikan aplikasi buatanmu ini di google playstore atau melalui web sendiri atau aplikasi khusus website. Kamu juga bisa menerbitkan aplikasi langsung pada amazon appstore atau memonetasi aplikasi (memperoleh uang). Syaratnya, kamu harus memiliki akun di kedua toko aplikasi ini yang selanjutnya disinkronisasi dengan appsgeyser. Selain itu untuk menerbitkan aplikasi dikenakan biaya sekitar 25$ (pada saat tulisan ini dibuat).

Tak ketinggalan, dalam AppsGeyser ini pembaca atau developer bisa melihat perkembangan jumlah pengunduh aplikasi Android yang telah diterbitkan pada toko aplikasi. Sementara itu, pembaca atau developer dapat mengembangkan aplikasi Android lainnya dan menggunakan template yang berbeda-beda pada halaman utama AppsGeyser.

Karena gratis, aplikasi yang ada memang memiliki keterbatasan. Namun demikian sebagai tahap awal belajar, laman ini layak untuk dicoba.

Berikut adalah situasi belajar siswa kelas XI MIPA ketika membuat aplikasi di Appsgeyser. Hasil aplikasi mereka menyusul ya :).

Sumber tulisan: http://teknojurnal.com/cara-membuat-aplikasi-android-mudah/

Selain appsgeyser, kita akan maju sedikit mempelajari cara membuat aplikasi android dengan menggunakan AppInventor. Klik di sini untuk mengenal Appinventor.
sumber:
klik di sini dan ini.

Belajar pemrograman tidak selalu harus menggunakan peranti keras atau pun terkoneksi ke internet. Sebaliknya, kita dapat menggunakan alat-alat tulis seperti kertas, pensil, gunting, pun bahan-bahan seperti gelas minum bekas dan lain-lain. Salah satu permainan yang bisa kita lakukan untuk mengenalkan konsep algoritma, coding (pemrograman), fungsi, debug dan parameter adalah permainan yang diberi nama My Robotic Friends.

Pada kegiatan ini siswa akan belajar:
1. mengkonversi (mengubah) kegiatan dunia nyata ke dalam instruksi (perintah)
2. mempraktekkan pemetaan instruksi (perintah) ke dalam simbol
3. memperoleh pemahaman atas perlunya ketepatan dalam pemrograman
4. mempraktekkan pencarian sumber kesalahan program
5. memahami kegunaan fungsi dan parameter

Istilah yang dipelajari pada kegiatan ini:
Algoritma: urutan langkah untuk menyelesaikan sebuah kegiatan (memecahkan masalah)
Coding (Pemrograman): mengubah instruksi ke dalam bahasa simbol
Debugging: menemukan dan memperbaiki masalah dalam kode
Function: potongan kode yang dapat dipanggil berulang kali
Parameters: variabel yang dimasukkan ke dalam fungsi untuk diolah

Alat yang digunakan: gelas minum bekas atau karton berbentuk gelas.

Cara permainan:
1. Bagi siswa ke dalam kelompok. Setiap kelompok terdiri dari 4 orang (idealnya 3)
2. Setiap kelompok akan memperoleh gelas minum atau karton berbentuk gelas sebanyak 6 (jumlah boleh bebas)
3. Setiap kelompok ditugaskan untuk menyusun gelas
4. Selanjutnya, setiap kelompok menuliskan urutan langkah susunan gelas yang telah mereka buat dengan mengggunakan simbol-simbol yang telah disepakati (lihat lampiran simbol yang digunakan di bawah)
5. Tukarkan kertas yang berisi kode berupa simbol kepada kelompok lain. Tugaskan mereka untuk mengikuti instruksi yang ada pada kertas untuk menyusun gelas-gelas tersebut
6. Jika ditemukan kesalahan dalam penulisan kode berupa simbol minta siswa untuk memperbaiki

Simbol yang digunakan:
 Pick Up

Move Right

Move Left

Put down

Turn right (90)

Turn left (90)

Untuk detail permainan dapat dilihat di laman code.org di sini. Pilih pada opsi No device or internet? Try ‘unplugged’ computer science. Pilih My Robotic Friends.

catatan: Kita dapat memodifikasi ketentuan yang ada pada permainan ini untuk memudahkan dan memberi banyak pilihan.

Beberapa kegiatan siswa selama proses pembelajaran unplugged programming bisa dilihat di bawah ini.

Pertemuan: 2
Semester: Genap
Tugas: Pembuatan web CSS dan HTML

Buatlah file dengan format CSS dan HTML untuk tabel di bawah ini

Soal A

ketentuan:
Untuk tabel hedaing isikan dengan teks, tema bebas
Untuk isi, ceritakan sesuai tema. Minimal 2 paragraf.
Untuk sidebar, berikan link untuk daftar anggota kelompok dan link untuk foto dan video (simpan untuk file kedua dan ketiga dengan format *.html)

Soal B

ketentuan:
sama dengan soal A, hanya tabel hedaing diisi dengan gambar atau foto.

Pengayaan:
Format tabel boleh bebas