MEMBUAT GAME AI KELAS XA

Hari ini saya mengajak siswa kelas 10 untuk mencoba sesuatu yang berbeda: praktik membuat game dengan bantuan kecerdasan buatan. Tujuannya bukan sekadar menghasilkan sebuah permainan sederhana, tetapi juga memahami bagaimana konsep dasar struktur data dan algoritma berperan di balik layar.

Dalam praktik ini, kami fokus pada empat materi penting: searching, sorting, stack, dan queue. Searching kami gunakan untuk membantu karakter dalam game menemukan item atau lokasi tertentu. Sorting muncul saat siswa mencoba mengurutkan skor pemain dari yang tertinggi ke terendah. Stack menjadi menarik ketika dipraktikkan sebagai logika “undo–redo” dalam permainan, sedangkan queue membantu siswa memahami bagaimana giliran karakter atau musuh berjalan secara bergantian.

Dengan bantuan AI, siswa dapat lebih cepat melihat hasil kerja mereka. AI memberikan ide kode, visual sederhana, hingga saran perbaikan logika. Namun, saya tetap menekankan bahwa inti dari pembelajaran adalah memahami mengapa sebuah algoritma digunakan, bukan hanya bagaimana membuat game itu terlihat menarik.

Melalui pengalaman ini, saya berharap siswa menyadari bahwa game bukan sekadar hiburan, melainkan juga ruang belajar algoritma yang nyata dan menyenangkan.

Tugas membuat game berdasarkan materi : Searching, Sorting, Stack, Queue

Kelompok XA:

1. Dayi dan Rian : the9.com

2. Marcel dan Paul : rosebud.ai

3. Baltasar dan Gabriel : riseangle.com

4. Leon dan Elang : replit.com

5. Gerry dan Kevin : mit.appinventor.com

6. Rere dan Devlin : mgx.dev

7. Aloy dan Klemen : astrocate.com

8. Novel dan Panca : ludo.ai

9. Wilson dan Diktus : meshy.ai

10. Satrio dan Marcelus : stickygame.com 

11. Kraeng dan Ivan : blackbox.ai

12. Jose dan Greg : app.scenario.com

Read More

MEMBUAT RANGKAIAN LAMPU STROBO DENGAN ARDUINO

Dalam pembelajaran informatika kelas 12, siswa tidak hanya diajak memahami teori pemrograman, tetapi juga bagaimana ilmu tersebut dapat diterapkan secara nyata dalam kehidupan sehari-hari. Salah satu proyek sederhana namun menarik adalah membuat lampu strobo menggunakan Arduino Uno.

Proyek ini memanfaatkan papan mikrokontroler Arduino Uno yang diprogram untuk mengatur nyala dan padam LED dengan kecepatan tertentu sehingga menghasilkan efek cahaya strobo, mirip dengan yang sering digunakan pada pertunjukan musik atau pencahayaan khusus. Dengan menyusun rangkaian sederhana—menghubungkan LED, dan kabel jumper—serta menuliskan kode program di Arduino IDE, siswa dapat langsung melihat hasil kerjanya dalam bentuk lampu yang berkedip cepat.

Melalui kegiatan ini, siswa belajar menghubungkan logika pemrograman dengan perangkat keras, sekaligus melatih kreativitas dalam merancang variasi kedipan, kecepatan, maupun pola cahaya. Proyek lampu strobo bukan hanya seru untuk dicoba, tetapi juga membuka wawasan siswa tentang bagaimana teknologi embedded system bekerja di dunia nyata.

Skematik Strobo

Script Arduino

int m1 = 2; int m2 = 3; int m3 = 4; int m4 = 5; int m5 = 6; int b1 = 7; int b2 = 8; int b3 = 9; int b4 = 10; int b5 = 11; void setup() { // put your setup code here, to run once: pinMode(m1,OUTPUT); pinMode(m2,OUTPUT); pinMode(m3,OUTPUT); pinMode(m4,OUTPUT); pinMode(m5,OUTPUT); pinMode(b1,OUTPUT); pinMode(b2,OUTPUT); pinMode(b3,OUTPUT); pinMode(b4,OUTPUT); pinMode(b5,OUTPUT); } void loop() { // put your main code here, to run repeatedly: //========================================================================================== Flash Kanan Kiri ============================================= digitalWrite(m1,HIGH); digitalWrite(m2,HIGH); digitalWrite(m3,HIGH); digitalWrite(m4,HIGH); digitalWrite(m5,HIGH); digitalWrite(b1,LOW); digitalWrite(b2,LOW); digitalWrite(b3,LOW); digitalWrite(b4,LOW); digitalWrite(b5,LOW); delay(100); digitalWrite(m1,LOW); digitalWrite(m2,LOW); digitalWrite(m3,LOW); digitalWrite(m4,LOW); digitalWrite(m5,LOW); digitalWrite(b1,LOW); digitalWrite(b2,LOW); digitalWrite(b3,LOW); digitalWrite(b4,LOW); digitalWrite(b5,LOW); delay(100); digitalWrite(m1,HIGH); digitalWrite(m2,HIGH); digitalWrite(m3,HIGH); digitalWrite(m4,HIGH); digitalWrite(m5,HIGH); digitalWrite(b1,LOW); digitalWrite(b2,LOW); digitalWrite(b3,LOW); digitalWrite(b4,LOW); digitalWrite(b5,LOW); delay(100); digitalWrite(m1,LOW); digitalWrite(m2,LOW); digitalWrite(m3,LOW); digitalWrite(m4,LOW); digitalWrite(m5,LOW); digitalWrite(b1,LOW); digitalWrite(b2,LOW); digitalWrite(b3,LOW); digitalWrite(b4,LOW); digitalWrite(b5,LOW); delay(100); digitalWrite(m1,HIGH); digitalWrite(m2,HIGH); digitalWrite(m3,HIGH); digitalWrite(m4,HIGH); digitalWrite(m5,HIGH); digitalWrite(b1,LOW); digitalWrite(b2,LOW); digitalWrite(b3,LOW); digitalWrite(b4,LOW); digitalWrite(b5,LOW); delay(100); digitalWrite(m1,LOW); digitalWrite(m2,LOW); digitalWrite(m3,LOW); digitalWrite(m4,LOW); digitalWrite(m5,LOW); digitalWrite(b1,LOW); digitalWrite(b2,LOW); digitalWrite(b3,LOW); digitalWrite(b4,LOW); digitalWrite(b5,LOW); delay(100); //============================================================================================ digitalWrite(m1,LOW); digitalWrite(m2,LOW); digitalWrite(m3,LOW); digitalWrite(m4,LOW); digitalWrite(m5,LOW); digitalWrite(b1,HIGH); digitalWrite(b2,HIGH); digitalWrite(b3,HIGH); digitalWrite(b4,HIGH); digitalWrite(b5,HIGH); delay(100); digitalWrite(m1,LOW); digitalWrite(m2,LOW); digitalWrite(m3,LOW); digitalWrite(m4,LOW); digitalWrite(m5,LOW); digitalWrite(b1,LOW); digitalWrite(b2,LOW); digitalWrite(b3,LOW); digitalWrite(b4,LOW); digitalWrite(b5,LOW); delay(100); digitalWrite(m1,LOW); digitalWrite(m2,LOW); digitalWrite(m3,LOW); digitalWrite(m4,LOW); digitalWrite(m5,LOW); digitalWrite(b1,HIGH); digitalWrite(b2,HIGH); digitalWrite(b3,HIGH); digitalWrite(b4,HIGH); digitalWrite(b5,HIGH); delay(100); digitalWrite(m1,LOW); digitalWrite(m2,LOW); digitalWrite(m3,LOW); digitalWrite(m4,LOW); digitalWrite(m5,LOW); digitalWrite(b1,LOW); digitalWrite(b2,LOW); digitalWrite(b3,LOW); digitalWrite(b4,LOW); digitalWrite(b5,LOW); delay(100); digitalWrite(m1,LOW); digitalWrite(m2,LOW); digitalWrite(m3,LOW); digitalWrite(m4,LOW); digitalWrite(m5,LOW); digitalWrite(b1,HIGH); digitalWrite(b2,HIGH); digitalWrite(b3,HIGH); digitalWrite(b4,HIGH); digitalWrite(b5,HIGH); delay(100); digitalWrite(m1,LOW); digitalWrite(m2,LOW); digitalWrite(m3,LOW); digitalWrite(m4,LOW); digitalWrite(m5,LOW); digitalWrite(b1,LOW); digitalWrite(b2,LOW); digitalWrite(b3,LOW); digitalWrite(b4,LOW); digitalWrite(b5,LOW); delay(100); //======================================================================== digitalWrite(m1,HIGH); digitalWrite(m2,HIGH); digitalWrite(m3,HIGH); digitalWrite(m4,HIGH); digitalWrite(m5,HIGH); digitalWrite(b1,LOW); digitalWrite(b2,LOW); digitalWrite(b3,LOW); digitalWrite(b4,LOW); digitalWrite(b5,LOW); delay(100); digitalWrite(m1,LOW); digitalWrite(m2,LOW); digitalWrite(m3,LOW); digitalWrite(m4,LOW); digitalWrite(m5,LOW); digitalWrite(b1,LOW); digitalWrite(b2,LOW); digitalWrite(b3,LOW); digitalWrite(b4,LOW); digitalWrite(b5,LOW); delay(100); digitalWrite(m1,HIGH); digitalWrite(m2,HIGH); digitalWrite(m3,HIGH); digitalWrite(m4,HIGH); digitalWrite(m5,HIGH); digitalWrite(b1,LOW); digitalWrite(b2,LOW); digitalWrite(b3,LOW); digitalWrite(b4,LOW); digitalWrite(b5,LOW); delay(100); digitalWrite(m1,LOW); digitalWrite(m2,LOW); digitalWrite(m3,LOW); digitalWrite(m4,LOW); digitalWrite(m5,LOW); digitalWrite(b1,LOW); digitalWrite(b2,LOW); digitalWrite(b3,LOW); digitalWrite(b4,LOW); digitalWrite(b5,LOW); delay(100); digitalWrite(m1,HIGH); digitalWrite(m2,HIGH); digitalWrite(m3,HIGH); digitalWrite(m4,HIGH); digitalWrite(m5,HIGH); digitalWrite(b1,LOW); digitalWrite(b2,LOW); digitalWrite(b3,LOW); digitalWrite(b4,LOW); digitalWrite(b5,LOW); delay(100); digitalWrite(m1,LOW); digitalWrite(m2,LOW); digitalWrite(m3,LOW); digitalWrite(m4,LOW); digitalWrite(m5,LOW); digitalWrite(b1,LOW); digitalWrite(b2,LOW); digitalWrite(b3,LOW); digitalWrite(b4,LOW); digitalWrite(b5,LOW); delay(100); //============================================================================================ digitalWrite(m1,LOW); digitalWrite(m2,LOW); digitalWrite(m3,LOW); digitalWrite(m4,LOW); digitalWrite(m5,LOW); digitalWrite(b1,HIGH); digitalWrite(b2,HIGH); digitalWrite(b3,HIGH); digitalWrite(b4,HIGH); digitalWrite(b5,HIGH); delay(100); digitalWrite(m1,LOW); digitalWrite(m2,LOW); digitalWrite(m3,LOW); digitalWrite(m4,LOW); digitalWrite(m5,LOW); digitalWrite(b1,LOW); digitalWrite(b2,LOW); digitalWrite(b3,LOW); digitalWrite(b4,LOW); digitalWrite(b5,LOW); delay(100); digitalWrite(m1,LOW); digitalWrite(m2,LOW); digitalWrite(m3,LOW); digitalWrite(m4,LOW); digitalWrite(m5,LOW); digitalWrite(b1,HIGH); digitalWrite(b2,HIGH); digitalWrite(b3,HIGH); digitalWrite(b4,HIGH); digitalWrite(b5,HIGH); delay(100); digitalWrite(m1,LOW); digitalWrite(m2,LOW); digitalWrite(m3,LOW); digitalWrite(m4,LOW); digitalWrite(m5,LOW); digitalWrite(b1,LOW); digitalWrite(b2,LOW); digitalWrite(b3,LOW); digitalWrite(b4,LOW); digitalWrite(b5,LOW); delay(100); digitalWrite(m1,LOW); digitalWrite(m2,LOW); digitalWrite(m3,LOW); digitalWrite(m4,LOW); digitalWrite(m5,LOW); digitalWrite(b1,HIGH); digitalWrite(b2,HIGH); digitalWrite(b3,HIGH); digitalWrite(b4,HIGH); digitalWrite(b5,HIGH); delay(100); digitalWrite(m1,LOW); digitalWrite(m2,LOW); digitalWrite(m3,LOW); digitalWrite(m4,LOW); digitalWrite(m5,LOW); digitalWrite(b1,LOW); digitalWrite(b2,LOW); digitalWrite(b3,LOW); digitalWrite(b4,LOW); digitalWrite(b5,LOW); delay(100); //======================================================================================== Running masuk =================================== digitalWrite(m1,HIGH); digitalWrite(m2,LOW); digitalWrite(m3,LOW); digitalWrite(m4,LOW); digitalWrite(m5,LOW); digitalWrite(b1,LOW); digitalWrite(b2,LOW); digitalWrite(b3,LOW); digitalWrite(b4,LOW); digitalWrite(b5,HIGH); delay(100); digitalWrite(m1,HIGH); digitalWrite(m2,HIGH); digitalWrite(m3,LOW); digitalWrite(m4,LOW); digitalWrite(m5,LOW); digitalWrite(b1,LOW); digitalWrite(b2,LOW); digitalWrite(b3,LOW); digitalWrite(b4,HIGH); digitalWrite(b5,HIGH); delay(100); digitalWrite(m1,HIGH); digitalWrite(m2,HIGH); digitalWrite(m3,HIGH); digitalWrite(m4,LOW); digitalWrite(m5,LOW); digitalWrite(b1,LOW); digitalWrite(b2,LOW); digitalWrite(b3,HIGH); digitalWrite(b4,HIGH); digitalWrite(b5,HIGH); delay(100); digitalWrite(m1,HIGH); digitalWrite(m2,HIGH); digitalWrite(m3,HIGH); digitalWrite(m4,HIGH); digitalWrite(m5,LOW); digitalWrite(b1,LOW); digitalWrite(b2,HIGH); digitalWrite(b3,HIGH); digitalWrite(b4,HIGH); digitalWrite(b5,HIGH); delay(100); digitalWrite(m1,HIGH); digitalWrite(m2,HIGH); digitalWrite(m3,HIGH); digitalWrite(m4,HIGH); digitalWrite(m5,HIGH); digitalWrite(b1,HIGH); digitalWrite(b2,HIGH); digitalWrite(b3,HIGH); digitalWrite(b4,HIGH); digitalWrite(b5,HIGH); delay(100); //============================================================================= Running Keluar ====================================================== digitalWrite(m1,HIGH); digitalWrite(m2,HIGH); digitalWrite(m3,HIGH); digitalWrite(m4,HIGH); digitalWrite(m5,LOW); digitalWrite(b1,LOW); digitalWrite(b2,HIGH); digitalWrite(b3,HIGH); digitalWrite(b4,HIGH); digitalWrite(b5,HIGH); delay(100); digitalWrite(m1,HIGH); digitalWrite(m2,HIGH); digitalWrite(m3,HIGH); digitalWrite(m4,LOW); digitalWrite(m5,LOW); digitalWrite(b1,LOW); digitalWrite(b2,LOW); digitalWrite(b3,HIGH); digitalWrite(b4,HIGH); digitalWrite(b5,HIGH); delay(100); digitalWrite(m1,HIGH); digitalWrite(m2,HIGH); digitalWrite(m3,LOW); digitalWrite(m4,LOW); digitalWrite(m5,LOW); digitalWrite(b1,LOW); digitalWrite(b2,LOW); digitalWrite(b3,LOW); digitalWrite(b4,HIGH); digitalWrite(b5,HIGH); delay(100); digitalWrite(m1,HIGH); digitalWrite(m2,LOW); digitalWrite(m3,LOW); digitalWrite(m4,LOW); digitalWrite(m5,LOW); digitalWrite(b1,LOW); digitalWrite(b2,LOW); digitalWrite(b3,LOW); digitalWrite(b4,LOW); digitalWrite(b5,HIGH); delay(100); digitalWrite(m1,LOW); digitalWrite(m2,LOW); digitalWrite(m3,LOW); digitalWrite(m4,LOW); digitalWrite(m5,LOW); digitalWrite(b1,LOW); digitalWrite(b2,LOW); digitalWrite(b3,LOW); digitalWrite(b4,LOW); digitalWrite(b5,LOW); delay(100); //======================================================================================== Running masuk =================================== digitalWrite(m1,HIGH); digitalWrite(m2,LOW); digitalWrite(m3,LOW); digitalWrite(m4,LOW); digitalWrite(m5,LOW); digitalWrite(b1,LOW); digitalWrite(b2,LOW); digitalWrite(b3,LOW); digitalWrite(b4,LOW); digitalWrite(b5,HIGH); delay(100); digitalWrite(m1,HIGH); digitalWrite(m2,HIGH); digitalWrite(m3,LOW); digitalWrite(m4,LOW); digitalWrite(m5,LOW); digitalWrite(b1,LOW); digitalWrite(b2,LOW); digitalWrite(b3,LOW); digitalWrite(b4,HIGH); digitalWrite(b5,HIGH); delay(100); digitalWrite(m1,HIGH); digitalWrite(m2,HIGH); digitalWrite(m3,HIGH); digitalWrite(m4,LOW); digitalWrite(m5,LOW); digitalWrite(b1,LOW); digitalWrite(b2,LOW); digitalWrite(b3,HIGH); digitalWrite(b4,HIGH); digitalWrite(b5,HIGH); delay(100); digitalWrite(m1,HIGH); digitalWrite(m2,HIGH); digitalWrite(m3,HIGH); digitalWrite(m4,HIGH); digitalWrite(m5,LOW); digitalWrite(b1,LOW); digitalWrite(b2,HIGH); digitalWrite(b3,HIGH); digitalWrite(b4,HIGH); digitalWrite(b5,HIGH); delay(100); digitalWrite(m1,HIGH); digitalWrite(m2,HIGH); digitalWrite(m3,HIGH); digitalWrite(m4,HIGH); digitalWrite(m5,HIGH); digitalWrite(b1,HIGH); digitalWrite(b2,HIGH); digitalWrite(b3,HIGH); digitalWrite(b4,HIGH); digitalWrite(b5,HIGH); delay(100); //============================================================================= Running Keluar ====================================================== digitalWrite(m1,HIGH); digitalWrite(m2,HIGH); digitalWrite(m3,HIGH); digitalWrite(m4,HIGH); digitalWrite(m5,LOW); digitalWrite(b1,LOW); digitalWrite(b2,HIGH); digitalWrite(b3,HIGH); digitalWrite(b4,HIGH); digitalWrite(b5,HIGH); delay(100); digitalWrite(m1,HIGH); digitalWrite(m2,HIGH); digitalWrite(m3,HIGH); digitalWrite(m4,LOW); digitalWrite(m5,LOW); digitalWrite(b1,LOW); digitalWrite(b2,LOW); digitalWrite(b3,HIGH); digitalWrite(b4,HIGH); digitalWrite(b5,HIGH); delay(100); digitalWrite(m1,HIGH); digitalWrite(m2,HIGH); digitalWrite(m3,LOW); digitalWrite(m4,LOW); digitalWrite(m5,LOW); digitalWrite(b1,LOW); digitalWrite(b2,LOW); digitalWrite(b3,LOW); digitalWrite(b4,HIGH); digitalWrite(b5,HIGH); delay(100); digitalWrite(m1,HIGH); digitalWrite(m2,LOW); digitalWrite(m3,LOW); digitalWrite(m4,LOW); digitalWrite(m5,LOW); digitalWrite(b1,LOW); digitalWrite(b2,LOW); digitalWrite(b3,LOW); digitalWrite(b4,LOW); digitalWrite(b5,HIGH); delay(100); digitalWrite(m1,LOW); digitalWrite(m2,LOW); digitalWrite(m3,LOW); digitalWrite(m4,LOW); digitalWrite(m5,LOW); digitalWrite(b1,LOW); digitalWrite(b2,LOW); digitalWrite(b3,LOW); digitalWrite(b4,LOW); digitalWrite(b5,LOW); delay(100); }

Read More

BERPIKIR KOMPUTASIONAL KELAS X

Di era digital, kemampuan berpikir komputasional menjadi keterampilan penting yang harus dimiliki siswa. Berpikir komputasional bukan sekadar belajar kode, tetapi bagaimana kita melatih otak untuk menyelesaikan masalah secara logis, sistematis, dan efisien.

Salah satu penerapannya terlihat pada searching dan sorting. Searching mengajarkan kita cara menemukan informasi dengan cepat di tengah banyak data, seperti mencari file di komputer atau kata kunci di mesin pencari. Sedangkan sorting melatih kita mengurutkan data agar lebih mudah dipahami, misalnya mengurutkan nilai siswa dari tertinggi hingga terendah atau mengatur nama berdasarkan abjad.

Konsep lain yang tak kalah penting adalah stack dan queue. Stack bekerja dengan prinsip Last In First Out (LIFO), mirip dengan tumpukan piring—piring terakhir yang ditaruh di atas akan dipakai lebih dulu. Sementara queue menggunakan prinsip First In First Out (FIFO), sama seperti antrean di kasir, di mana siapa yang datang lebih dulu akan dilayani terlebih dahulu.

Melalui pemahaman sederhana ini, siswa tidak hanya belajar algoritma, tetapi juga menanamkan cara berpikir terstruktur dalam menghadapi permasalahan sehari-hari. Inilah inti literasi digital: tidak sekadar menggunakan teknologi, tetapi memahaminya dengan cara berpikir yang cerdas dan kritis.

MATERI PRESENTASI

https://bab2-berpikir-komputasio-ukog58n.gamma.site/

Pengumpulan LKPD hasil literasi digital Berpikir Komputsional

KELAS XA

https://drive.google.com/drive/folders/1l7u1g4i5LO7abm5LnwWvU9TdwyCurz0v?usp=sharing

KELAS XB
https://drive.google.com/drive/folders/1gXB-JvuxhS38xJqohRXD2o14EhQGTr4R?usp=sharing

Read More

SISTEM KOMPUTER KELAS 12 SEMESTER 1 - PENGANTAR ARDUINO

Arduino adalah platform elektronik berbasis mikrokontroler yang dirancang agar mudah digunakan, baik oleh pemula maupun pengembang berpengalaman. Dengan Arduino, kita dapat membuat berbagai proyek interaktif seperti sensor suhu, lampu otomatis, hingga robot sederhana. Keunggulan Arduino terletak pada kemudahan pemrograman dan ketersediaan banyak pustaka (library) yang siap digunakan.

Sebelum mulai membuat program pada papan Arduino, kita perlu menginstal perangkat lunak bernama Arduino IDE (Integrated Development Environment) di komputer. Arduino IDE adalah aplikasi yang digunakan untuk menulis kode, mengompilasi, dan mengunggah program ke papan Arduino.

Cara Instalasi Arduino IDE:

1. Unduh Arduino IDE
   Kunjungi situs resmi Arduino di https://www.arduino.cc/en/software. Pilih versi sesuai sistem operasi yang digunakan (Windows, macOS, atau Linux).

2. Proses Instalasi

   • Untuk Windows: jalankan file installer yang sudah diunduh, lalu ikuti langkah-langkah instalasi dengan menekan tombol Next hingga selesai.

   • Untuk macOS: cukup seret ikon Arduino IDE ke folder Applications.

   • Untuk Linux: ekstrak file yang diunduh, kemudian jalankan file install.sh.

3. Hubungkan Papan Arduino
   Setelah instalasi selesai, sambungkan papan Arduino (misalnya Arduino Uno) ke komputer menggunakan kabel USB.

4. Pengaturan Awal
   Buka Arduino IDE, kemudian pilih jenis papan (Board) dan port USB yang sesuai pada menu Tools.

Setelah semua langkah di atas selesai, Arduino IDE sudah siap digunakan untuk menulis program pertama. Sebagai latihan awal, kita bisa mencoba program sederhana Blink untuk menyalakan dan mematikan LED bawaan pada papan Arduino.

MATERI PRESENTASI

1. Pengenalan Sistem Komputer.

https://docs.google.com/presentation/d/1fS2CBqnP5yI0LvtrR9LowJ9xQjQCQk2T/edit?usp=sharing&ouid=101129253085954039145&rtpof=true&sd=true

2. Pengenalan Arduino - Single Board Computer & Single Board Controller.  

https://docs.google.com/presentation/d/1ns_ZeMdnkCnvUYFwu4X-WhlMBMLH1e1Z/edit?usp=sharing&ouid=101129253085954039145&rtpof=true&sd=true

Read More

Membuat tampilan website sederhana menggunakan kode HTML [Kelas XI]

Hari ini, siswa kelas XI melakukan praktik membuat halaman website sederhana menggunakan bahasa HTML. Kegiatan dimulai dengan mengenal struktur dasar dokumen HTML, mulai dari <html>, <head>, hingga <body>.

Siswa kemudian menambahkan elemen-elemen dasar seperti judul halaman, teks paragraf, gambar, dan tautan. Tujuannya adalah agar mereka memahami bagaimana setiap tag HTML memiliki fungsi tertentu dalam membangun tampilan dan isi halaman.

Melalui praktik ini, siswa belajar bahwa membuat website tidak selalu membutuhkan software canggih. Cukup dengan teks editor sederhana dan browser, mereka sudah bisa menciptakan halaman web sendiri. Semoga keterampilan ini menjadi langkah awal untuk mengembangkan kreativitas dan kemampuan di bidang teknologi.

latihan6.html 

<html> 

<head> 

   <title> .:: SITUSKU ::. </title> 

</head> 

<body bgcolor="#000000" text="#FFFFFF"> 

 <table border="1" align="center" width="80%"> 

     <tr> 

  <td colspan="2" align="center" height="100" bgcolor="#3A2BD1"> 

           <font size="16" face="Arial">SITUSKU.COM </font><br> 

   <hr width="500"> <br> 

<marquee direction="right">Terdepan Dalam Berita dan 

Gosip</marquee> 

  </td> 

     </tr> 

     <tr valign="top"> 

                 <td width="200" height="450" bgcolor="green">

 

Home <br>

<a href=informatika.html>

Informatika</a>

 

</td> 

  <td bgcolor="#F75454">Selamat Datang di <b><i>SITUSKU.COM</i></b> <br> 

Situsku.Com akan selalu konsisten dengan berita-berita terbaru dari 

segala penjuru Indonesia.<br><br> 

Dapatkan berita-berita menarik tentang: politik, hukum, keamanan, gosip 

artis dan kuliner di Indonesia. 

            </td> 

    </tr> 

 </table> 

</body> 

</html> 

informatika.html

<html> 

<head> 

   <title> .:: SITUSKU ::. </title> 

</head> 

<body bgcolor="#000000" text="#FFFFFF"> 

 <table border="1" align="center" width="80%"> 

     <tr> 

  <td colspan="2" align="center" height="100" bgcolor="#3A2BD1"> 

           <font size="16" face="Arial">SITUSKU.COM </font><br> 

   <hr width="500"> <br> 

<marquee direction="right">Terdepan Dalam Berita dan 

Gosip</marquee> 

  </td> 

     </tr> 

     <tr valign="top"> 

                 <td width="200" height="450" bgcolor="green">

 

<a href=latihan6.html>Home</a> <br>

Informatika

 

 

</td> 

 

  <td bgcolor="#F75454">Halaman Informatika <b><i>

            </td> 

    </tr> 

 </table> 

</body> 

</html>

Ketentuan Pengumpulan Tugas:

Semua file latihan Kode HTML mulai dari file:

Folder 1 berisi:

    - latihan.html

    - latihan2.html

    - latihan3.html

    - latihan4.html

    - latihan5.html

    - latihan6.html

Folder 2 berisi:

    - home.html

    - profile.html

    - gallery.html

    - gambar.jpg

Kedua folder dimasukkan ke dalam satu folder dan diberi nama kemudia upload ke alamat di bawah ini!

KELAS 11A

https://drive.google.com/drive/folders/1aaw5_V3pzaMAzx92uera0wLDHf8s9LEf?usp=sharing

KELAS 11B

https://drive.google.com/drive/folders/1LbNXzrVO8zEBnHGgPupIo-QPbyQHhf1k?usp=sharing

Materi selanjutnya: https://informatikasegar.blogspot.com/2025/09/konfigirasi-xampp-server-kelas-11.html

Read More

LATIHAN MEMBUAT TABEL (HTML) KELAS XI

Kali ini, siswa kelas 11 mempraktikkan cara membuat tabel menggunakan bahasa markup HTML. Tabel adalah elemen penting di halaman web untuk menampilkan data secara terstruktur. Siswa mempelajari tag dasar seperti <table>, <tr> (table row), <th> (table header), dan <td> (table data).

Kami memulai dengan contoh sederhana — membuat tabel daftar nilai mata pelajaran. Langkah demi langkah, siswa mengetikkan kode di editor, menyimpan file dengan ekstensi .html, lalu melihat hasilnya di browser. Dari sini, mereka mulai memahami bagaimana baris dan kolom tersusun, serta bagaimana menambahkan border, menggabungkan sel, atau memberi warna latar menggunakan atribut dan CSS sederhana.

Praktik ini bukan hanya melatih keterampilan teknis, tetapi juga membiasakan siswa untuk berpikir terstruktur dalam menyajikan informasi. Dari tabel nilai, siapa tahu besok mereka bisa membuat tabel jadwal, katalog produk, atau data statistik di situs web mereka sendiri.

<html> 

<head> 

   <title> Latihan Table </title> 

</head> 

<body> 

Tabel 1

 <table border="1" width="500"> 

   <tr> 

      <td align="center">1</td> 

      <td align="center">2</td> 

      <td align="center">3</td> 

  </tr> 

  <tr>

      <td align="center">4</td> 

      <td align="center">5</td> 

      <td align="center">6</td> 

  </tr>

  <tr>

      <td align="center">7</td> 

      <td align="center">8</td>

      <td align="center">9</td>   

  </tr>

</table>

 <p> 

 Hasil Preview kode HTML tabel 1:

1	2	3
4	5	6
7	8	9

 Tabel 2

 <table border="1" width="500"> 

  <tr> 

      <td align="center">1</td> 

      <td colspan="2" align="center">2</td> 

  </tr> 

  <tr>

      <td align="center">3</td> 

      <td align="center">4</td> 

      <td align="center">5</td> 

  </tr>

  <tr>

      <td colspan="2" align="center">6</td> 

      <td align="center">7</td>   

  </tr>

</table> 

<p>

Hasil Preview kode HTML tabel 2:

1	2
3	4	5
6		7

 

Tabel 3

<table border="1" width="500"> 

  <tr> 

      <td colspan="3" align="center">1</td> 

  </tr> 

  <tr>

      <td colspan="2" align="center">2</td> 

      <td align="center">3</td> 

  </tr>

  <tr>

      <td align="center">4</td> 

      <td align="center">5</td>

      <td align="center">6</td>   

  </tr>

</table> 

<p>

Hasil Preview kode HTML tabel 3:

1
2		3
4	5	6

Tabel 4

<table border="1" width="300"> 

  <tr> 

      <td rowspan="2" align="center">1</td> 

      <td align="center">2</td> 

  </tr> 

  <tr>

      <td align="center">3</td> 

  </tr>

</table> 

<p>

Hasil Preview kode HTML tabel 4:

1	2
	3

 

Tabel 5

<table border="1" width="300"> 

  <tr> 

      <td align="center">1</td> 

      <td rowspan="2" align="center">2</td> 

  </tr> 

  <tr>

      <td align="center">3</td> 

  </tr>

</table> 

<p>

Hasil Preview kode HTML tabel 5:

1	2
3

Tabel 6

 <table border="1" width="600"> 

   <tr> 

      <td align="center" width="200">1</td> 

      <td colspan="2" align="center" width="400">2</td> 

   </tr> 

   <tr>

      <td align="center">3</td> 

      <td colspan="2" align="center"> 

  

          <table border="1" width="350">

              <tr>

<td colspan="2" align="center">4</td>

              </tr>

              <tr>

<td align="center">5</td>

<td align="center">6</td>

              </tr>

          </table>

      </td> 

  </tr>

  <tr>

      <td colspan="2" align="center"> 

          <table border="1" width="350">

    <tr>

<td rowspan="2">7</td>

<td align="center">8</td>

    </tr>

    <tr>

<td align="center">9</td>

    </tr>

          </table>

      </td> 

      <td align="center" width="200">10</td>   

  </tr>

  </table> 

Hasil Preview kode HTML tabel 6:

1	2
3	4 5 6
7 8 9		10

</body>

</html>

Read More

INFORMATIKA DAN KETERAMPILAN GENERIK - KELAS X

Di era digital saat ini, informatika bukan sekadar tentang memahami komputer, tetapi juga mengasah keterampilan yang bisa diterapkan di berbagai bidang kehidupan. Siswa kelas 10 perlu membangun keterampilan generik—yaitu kemampuan dasar yang fleksibel dan relevan di banyak situasi.

Beberapa keterampilan generik yang penting antara lain berpikir komputasional (menyelesaikan masalah secara sistematis), literasi digital (memahami, menilai, dan memanfaatkan informasi di dunia maya), kolaborasi daring (bekerja sama menggunakan teknologi), dan kreativitas digital (menciptakan solusi atau karya dengan memanfaatkan alat TIK).

Dengan menguasai keterampilan ini, siswa tidak hanya siap menghadapi tantangan akademis, tetapi juga mampu beradaptasi di dunia kerja dan kehidupan sehari-hari. Informatika menjadi bekal penting untuk berpikir kritis, bekerja sama, dan menciptakan inovasi yang bermanfaat.

Materi Presentasi 
P1 : https://gamma.app/docs/Selamat-Datang-di-Kelas-Informatika-Kelas-10-5tkiw8pzbsaxr12
P2 : https://docs.google.com/presentation/d/1mTDj1WxxvdSyCfZP1O4jb4Exvc8Yx7Bj/edit?usp=sharing&ouid=101129253085954039145&rtpof=true&sd=true

LKPD
https://padlet.com/andreasyohanes/kelas-x-ts42qy1chlzty277

Refleksi Pembelajaran

Kelas XA:

https://drive.google.com/drive/folders/1AOHZHssI8Fhe0ShyzSTzOx4rwDjxXFdx?usp=sharing

Kelas XB: 

https://drive.google.com/drive/folders/1aVFDIGzIu_OUwu9yR1g4Bl4J1fiYHP9H?usp=sharing

Read More