Image Representation

Can you guess, what the picture is?
4,11
4,9,2,1
4,9,2,1
4,11
4,9
4,9
5,7
0,17
1,15
‪#‎imagerepresentation‬, Computer Science Activitiy. Learn Computer without a computer

Masih dengan tema yang sama yaitu Pixel. Materi sebelumnya ada di sini dan di sana. Revisi sedikit pada slide, untuk update terbaru dapat dilihat di bawah ini.

Tebak gambar di atas adalah bagian dari permainan mengenal Image Representation.

Bagaimana hubungan piksel dengan metode kompresi data pada mesin fax? Tidak hanya pada mesin fax, metode ini juga berlaku pada komputer. Pilihan mesin fax merujuk pada sebuah teknologi yang telah ada sejak sebelum lahirnya komputer, yang telah menerapkan metode kompresi data.

Jadi, begini, perhatikan gambar di bawah ini.
glumanda_pixel_art_by_beffra-d6whfrw

Gambar di atas dibentuk dari sekumpulan piksel yang diwakili oleh kotak-kotak kecil.
Jika gambar di atas kamu kirimkan sebagai data maka akan berbunyi seperti:
hitam hitam hitam hitam
hitam oranye oranye oranye oranye hitam dstnya

Terlalu panjang, bukan? Bisakah kita menyingkatnya seperti ini?
4 hitam
1 hitam 3 oranye 1 hitam

Di atas adalah salah satu kompresi mendasar pada mesin fax, walaupun mesin fax itu sendiri lebih rumit dari sekedar hal di atas. Kamu akan mempelajarinya lebih dalam pada jenjang akademik yang lebih tinggi.

Tugas Praktik 1-Scratch

Berikut adalah karya siswa kelas XI berupa pemrograman animasi sederhana. Yang ada di bawah ini adalah karya yang dibuat dengan menggunakan program online Scratch melalui laman mereka di http://scratch.mid.edu

Kelas XI MIA 4
1. Cut Nirwana. Klik di sini.
2. AnnisaHanifa. Klik di sini.
3. Ainani Tajrian. Klik di sini.
4. Dyah liftyawati. Klik di sini.
5. Shafira. Klik di sini.
6. indira fadhilah. Klik di sini.
7. Azmi Rafi. Klik di sini.
8. Natalia Chiquita. Klik di sini.
9. Ghea Samantha. Klik di sini.
10. rafidah fauziah. Klik di sini.
11. Hermon David, klik di sini.

Kelas XI MIA 2
1. Bilqis Nabilah M. Klik di sini.
2. Nabilah Hana L. Klik di sini.
3. aisyah ardine. Klik di sini.
4. Nattaya Salsabila. Klik di sini.
5. Farah Muthia Miladyah(11), klik di sini.
6. Pinastika H. Klik di sini.
7. Raihana Abida XI MIA 2. Klik di sini.
8. raziqa fadhlan xi mia 2. Klik di sini.
9. Amelia Nasyahta XI MIA 2. Klik di sini.

Kelas XI MIA 3
1. Nadhifa-26. Klik di sini.
2. ika fitri ariyani. Klik di sini.
3. Alphira Septiani Tabita. Klik di sini.
4. Evania. Klik di sini.
5. Fathur Fadhila. Klik di sini.
6. Teuku augibran. Klik di sini.
7. Allya Safitri (2). Klik di sini.
8. SYALZABILA. Klik di sini.
9. Indira Nur Anissa (21). Klik di sini.
10. Faiz Hadiyan. Klik di sini.
11. fikri octama. Klik di sini.
12. Ryan Naufal P. Klik di sini.
13. Rihan Fathirizza A. Klik di sini.
14. fildzah Zhafarina. Klik di sini. Nice job :)

Kelas: XI MIA 1
1. Theresia Rosaria. Klik di sini. Good. But don’t forget to write down the instructions.
2. ‏Rafikadwisthiya. Klik di sini. Excellent :)
3. GabrielleK.S. Klik di sini. Where is the instructions?
4. Hadlina Rahmadinni. Klik di sini. The istructions, please.
5. Glenn Arthur S. Klik di sini. The istructions, please.
6. ‏Karinka Anisariandina. Klik di sini.
7. Senopati Yudhistira. Klik di sini. Write down the instructions.
8. Agung. Klik di sini. Good. The instruction, please.
9. Naufal S. Klik di sini. ?? The instructions, name and class.
10. Roudhotul Sofa Nurauliya. Klik di sini. Great :)
11. Adelia Safaira. Klik di sini. Nice :)
12. Natalia Christiani. Klik di sini. Good. But there is a little bug in that program. Don’t forget to write down the instruction.
13. Ghina Nisa Salsabiela. Klik di sini. Excellent :)
14. Ardini Ridhanila. Klik di sini.
15. Nadya Nazla. Klik di sini. Good.
16. Nareswarie. Klik di sini. Nice :)

Animasi Kucing Bergerak Sesuai Alur Bentuk

Beberapa karya siswa dari kelas X MIA 3. Ada banyak yang memilih objek serupa, karena itu yang saya tampilkan di sini mewakili objek-objek yang ada.

Kucing bergerak membentuk segi enam

Kucing bergerak membentuk segi delapan

Kucing bergerak membentuk lingkaran

Kucing bergerak membentuk bintang

Kucing bergerak membentuk segi dua belas

Kucing bergerak membentuk segi lima

Bab 3 – Diagram Alur

Untuk pertemuan selanjutnya di kelas XI materi yang akan diberikan adalah pembuatan diagram alur.

Berikut ini adalah slide presentasinya.

Tugas 1 yang dikerjakan di sekolah adalah:
1. Membuat diagram alur untuk contoh sehari-hari.
(Temukan masalah terlebih dahulu).
contoh: tahapan untuk mengambil uang tunai di ATM
Urutannya adalah sebagai berikut:
a. Cari mesin ATM
b. Antre.
c. Masukkan kartu ATM
d. Masukkan PIN ATM
e. Pilih opsi penarikan
f. Pilih jumlah nominal yang akan diambil
g. Tunggu mesin ATM memproses
h. Tarik kartu ATM
i. Ambil uang
j. Ambil tanda bukti pembayaran

Buat Diagram Alur (Flowchart)

alur copy

Masalah tidak boleh sama baik seperti dontoh di atas atau dengan kawan lainnya. Cari prsedur atau urutan yang ada di dalam kehidupan sehari-hari yang kalian temui. Misalnya, urutan membuat kue donut, dan lain sebagainya. Kerjakan di program pengolah kata. Kirimkan ke email Ibu paling lambat besok jam 9 malam ya.
Terima kasih.

Pertemuan 2 – Inkscape

Untuk materi desain grafis program yang digunakan adalah Inkscape. Inkscape adalah program pengolah gambar grafis vektor yang dapat kalian unduh secara gratis di internet. Kalian bisa mengunduhnya di sini.

Mengapa disebut vektor? Karena pengolah gambar ini menggunakan unsur garis dan kurva sebagai objek gambar.
Kelebihan vektor adalah jika ukuran gambar diperbesar maka gambar tidak pecah, seperti pengolah gambar bitmap.

Pada pertemuan 2 fitur yang akan dipelajari adalah:
1. Mengatur posisi kertas.
2. Membuat teks yang mengikuti alur sebuah objek.
3. Memodifikasi teks.

I. Mengatur posisi kertas, langkahnya adalah sebagai berikut:
1. Pilih menu File, lalu klik Document Properties.
2. Pada kotak dialog Document Properties, di tab Pages pada pilihan Orientation, beri tanda centang pada pilihan Portrait untuk posisi kertas vertical. Dan pilih Landscape untuk posisi mendatar atau horisontal.
inkscape

II. Membuat teks yang mengikuti alur sebuah objek (Put on Path)
Di bawah ini adalah langkah-langkahnya:
1. Klik ikon Create and edit text objects. Buatlah teks.
inkscape2
2. Klik ikon Select and transform objects untuk mengatur ukuran gambar (mengecilkan atau membesarkan teks).
inkscape3
3. Untuk mengubah atribut huruf (seperti jenis huruf, ukuran huruf, dll), klik objek teks sampai muncul bingkai di sekelilingnya. Kemudian, klik ikon Text and Font (berhuruf T).
3. Selanjutnya, klik ikon Create Spirals untuk membuat alur objek. (catatan: untuk alur objek dapat berupa objek apapun, bisa lingkaran, bisa garis atau objek buatanmu sendiri dengan menggunakan ikon Draw Bezier Curves).
4. Pilih kedua objek. Caranya, klik ikon Select and transform objects. Lalu klik teks. Sambil menekan tombol Shift, klik juga ikon spiral sehingga kedua objek terpilih.
inkscape4
5. Kemudian pilih menu Text. Lalu klik Put on Path. Lihat, teks akan mengikuti alur objek spiral.
6. Untuk menghapus objek bantu, klik kanan mouse dan pilih Fill and Stroke. Atau bisa juga dengan mengeklik kanan ikon Fill di status bar jendela Inkscape. Pilih tab Fill Stroke dan klik tanda silang untuk menghapus garis tepi objek bantu.
inkscape5

III. Memodifikasi teks
Sebuah objek teks dapat diubah-ubah bentuknya. Sebagai contoh, objek teks dapat diberi warna yang berbeda untuk setiap karakter serta dimodifikasi bentuknya.
1. Ketikkan teks.
2. Klik objek teks. Pilih menu Path. Pilih Object to Path.
3. Selanjutnya, klik menu Object. Lalu pilih Ungroup.
4. Klik teks. Lihatlah, setiap teks akan memisah menjadi banyak karaker. Kamu dapat memberi wwarna yang berbeda untuk setiap huruf.
path
5. Untuk memodifikasi bentuk karakter, klik ikon Edith path by nodes. Berikutnya, klik huruf yang akan diubah bentuknya. Tariklah node-node yang ada disekeliling huruf tersebut sesuai keinginanmu.
path1
6. Kamu bisa me-rotate huruf dengan cara mengeklik mouse dua kali pada huruf yang ingin diputar. Klik sampai muncul tanda panah melengkung disekeliling objek huruf tersebut. Klik dan putar tanda panah melengkug tersebut ke posisi yang kamu sukai.
path2
7. Jika telah selesai, jangan lupa sisipkan nama-kelas-latihan1.

Membuat Notasi Algoritma

Tugas untuk kelas XI membuat algoritma scrathy (kucing) berjalan mengikuti alur objek tertentu.

Tuliskan di buku tugas kalian ya. Berikut adalah contohnya:

Judul: Algoritma kucing berjalan mengikuti objek segiempat

scratch

Isi:
Kucing berjalan
Kucing berputar ke kanan sebanyak 90 derajat
Kucing berjalan
Kucing berputar ke kanan sebanyak 90 derajat
Kucing berjalan
Kucing berputar ke kanan sebanyak 90 derajat
Kucing berjalan
Kucing berputar ke kanan sebanyak 90 derajat

Isi algoritma di atas bisa kita ubah menjadi pengulangan. Bentuk pengulangannya adalah sebagai berikut:

Ulangi aksi sebanyak 4 kali
Kucing berjalan
Kucing berputar ke kanan sebanyak 90 derajat

Bagaimana kalau si karakter (kucing) berjalan mengikuti alur objek segitiga atau pun bentuk objek lainnya?
Nah, coba pikirkan algoritmanya ya :)

Bab 2 – Kelas X

Materi: Kewirausahaan (Presentasi) dan Pengenalan Program Pengolah Gambar Grafis

Alokasi Waktu: 2 JP
(Satu jam untuk presentasi tokoh wirausaha di bidang TIK dari setiap kelompok dan satu jam berikutnya adalah membuat dan memodifikasi teks dengan menggunakan program pengolah grafis Inkscape).

Jam kedua, siswa mulai mempraktikkan membuat desain grafis dengan mengggunakan program Inkscape. Kali ini fitur yang digunakan adalah mengatur halaman kertas, membuat teks yang mengikuti alur sebuah objek dan memodifikasi atribut huruf (memberi warna berbeda pada setiap karakter, mengatur posisi huruf, dan lain-lain)

Slide presentasi untuk bab 2 dapat diunduh di sini.