Belajar Koding Melalui Eksplorasi: Micro:bit

BELAJAR KODING micro:bit
MELALUI EKSPLORASI
Apa itu micro:bit
• Ianya adalah sebuah mikropengawal.
• Mikropengawal adalah seperti sebuah komputer mini yang boleh diaturcarakan
(program) untuk melaksanakan pelbagai fungsi
• Micro:bit mempunyai beberapa fungsi terbina dalam yang boleh digunakan untuk
projek kita.
Peranti micro:bit
|2
Pengaturcaraan micro:bit
• Pelbagai platform dan Bahasa boleh digunakan, tetapi tutorial ini akan hanya
menggunakan Platform Online dan MakeCode
• Makeblock adalah kaedah pengaturcaraan berasaskan visual dan blok, seperti
permainan Lego
https://microbit.org/
|3
https://microbit.org/
|4
MakeCode Editor
|5
Mulakan Projek Baharu
|6
Antaramuka MakeCode
Simulator - micro:bit virtual ini
membolehkan kita melihat hasil
koding kita pada micro:bit.
Toolbox - ada beberapa blok

koding yang boleh ditarik ke
workspace. Blok-blok ini
dibahagikan kepada beberapa
kategori.
Workspace - tempat
Simulator Toolbox Workspace pengaturcaraan dibuat. Program
dibina dengan kaedah
mencantumkan blok.
|7
PAPARAN LED
5X5
|8
Klik [Basics] dan drag blok [show icon] dari Toolbox ke
Workspace
|9
Pemerhatian
[show icon] - blok untuk

memaparkan di paparan LED 5x5
microbit, beberapa bentuk ikon
sedia ada.
Blok [show icon] ini tidak aktif,

dan akan bewarna kelabu.
Klik ‘drop down arrow’ pada blok

[show icon]
|10
[show icon]
Pemerhatian
Klik ‘drop down arrow’ pada blok

[show icon] untuk memilih ikon-
ikon lain.
Setiap satu blok [show icon]

untuk satu bentuk ikon sahaja.
|11
#1 Mari cuba... Pemerhatian
Apa yang boleh dilihat pada warna

blok [show icon] selepas
1. Klik [Basics] dan drag blok disambungkan pada blok [on start] ?
[show icon] dari Toolbox ke Bertukar daripada kelabu ke biru
Workspace
2. Klik ‘drop down arrow’ pada Kenapa ia berlaku?

blok [show icon] untuk pilih Blok ini telah aktif
ikon ‘senyum’
3. Sambungkan blok [show icon] Apakah paparan di [Simulator]?

ke blok [on start]
|12
Apakah paparan di [Simulator]?

1. Klik [Basics] dan drag blok
[show icon] dari Toolbox ke
Workspace
2. Klik ‘drop down arrow’ pada

blok [show icon] untuk pilih
ikon ‘senyum’ mula statik

Workspace

ikon ‘masam’
5. Sambungkan blok [show icon]

ke blok [on start]
|13

Workspace

ikon ‘senyum’ mula berulang

Workspace

ikon ‘masam’
5. Sambungkan blok [show icon]

ke blok [forever]
|14

Bina aturcara seperti
yang ditunjukkan.
mula
berulang
|15
Apa yang berlaku..? Pemerhatian
Blok [on start] (jika ada) adalah yang

MULA-MULA akan run setiap kali
program bermula (setiap kali device
ON atau restart). Blok ini akan run
SEKALI sahaja. mula
Blok [forever] akan run selepas blok

[on start]. Blok ini akan run
BERULANG-ULANG sehingga device
diOFF berulang
|16
Muat turun aturcara ke dalam micro:bit
• Klik [Download] untuk muat turun program ke PC. Fail program ini
dalam format .hex.
• Sambungkan micro:bit pada port USB. Ia akan kelihatan seperti
satu ‘removable drive’ (i.e. pen drive).
• Salin fail program tadi ke dalam micro:bit
|17
Bina aturcara seperti
mula
yang ditunjukkan.
berulang
|18
Bina aturcara seperti yang
mula
ditunjukkan.
Klik [Basics] dan drag blok

[pause(ms)] dari Toolbox
ke Workspace. Guna drop
down button atau taip Tunggu 1 saat
‘1000’ untuk ubah nilai.
Tunggu 1 saat
berulang Tunggu 1 saat
|19
Apa yang berlaku..?
Blok [pause (ms)] akan

‘memberhentikan’ sementara
perjalanan program. Ianya sangat
berguna dalam pengaturcaraan tetapi
penggunaan yang berlebihan akan
mengurangkan kecekapan program.
Blok [show number] membolehkan

kita memaparkan nombor. Jika nombor
itu lebih daripada satu digit, paparan
akan skrol nombor itu ke kanan.
|20
mula
ditunjukkan.

[show string] dari Toolbox
ke Workspace. Taip untuk
ubah nilai
berulang
|21
mula
ditunjukkan.

ubah nilai skrol
berulang
|22
Apa yang berlaku..?
Blok [show string] akan memaparkan

‘rentetan’ (abjad/aksara dan teks).
Jika lebih dari satu abjad/aksara,
teks akan di skrol secara automatik
|23
mula
ditunjukkan.
Klik [Basics], kemudian klik

[…more] dan drag blok
[clear screen] dari Toolbox
ubah nilai

[show icon] dari Toolbox
ke Workspace. Klik ‘drop
down arrow’ pada blok kekal
[show icon] untuk pilih
ikon ‘heart’
|24
mula
Blok [clear screen] akan memadamkan
paparan di skrin LED
Oleh kerana aturcara ini diletakkan

pada blok [on start], ianya cuma akan
dilaksanakan SEKALI dan tidak
berulang.
kekal
|25
mula
ditunjukkan.
Klik [Basics], kemudian klik

[…more] dan drag blok
[clear screen] dari Toolbox
ubah nilai

[show icon] dari Toolbox
ke Workspace. Klik ‘drop
down arrow’ pada blok
[show icon] untuk pilih
ikon ‘heart’
|26
mula
Blok [clear screen] akan memadamkan
paparan di skrin LED
Oleh kerana aturcara ini diletakkan

pada blok [forever], ianya akan
berulang-ulang. Blok [clear screen]
membuatkan ikon ‘hearts’ kelihatan
berdenyut-denyut.
berulang
|27
INPUT
ditunjukkan.
Klik [Input], dan drag blok

[on button] dari Toolbox
ke Workspace. Tekan/klik [button A] pada simulator.
ke Workspace. Tukar
paparan ke “A”
|29
Apa yang berlaku..?
Perhatikan blok [on button] ini:

• Tidak mempunyai ‘lekok’ untuk
disambungkan ke dalam blok [on
start] atau blok [forever].
• tidak bewarna kelabu (i.e. aktif)
apabila diletakkan di luar blok [on
start] atau blok [forever].
Oleh yang demikian:

• Blok [on button] berfungsi di luar
blok [on start], dan blok [forever].
• Sekiranya blok [on button] ini
diaktifkan (button A ditekan),
aturcara akan terus melaksanakan
blok [on button] ini dan setelah
selesai aturcara akan kembali ke
blok [forever]
|30
Bina aturcara seperti yang Nombor 1, 2, dan 3 akan dipaparkan satu
ditunjukkan. persatu dan akan dulang-ulang
Tekan/klik [button A] pada simulator

KETIKA ia memaparkan nombor “2”.
Huruf A akan dipaparkan, sebelum Kembali
memaparkan nombor 3, 1, 2, 3 ….
|31
Blok [on button] ini akan pulang mula
semula ke blok [forever] pada
‘tempat’ ianya diaktifkan
Tekan button A
berulang
|32
ditunjukkan.
Tekan/klik [button A] pada simulator KETIKA ia

memaparkan ikon “hearts”. Apakah paparan di
[Simulator]?
Tekan/klik [button B] pada simulator KETIKA ia

[Simulator]?
|33

Bina aturcara seperti yang memaparkan huruf “A”. Apakah paparan di
ditunjukkan. [Simulator]?
|34

Blok [on button] ini akan pulang semula ke blok memaparkan huruf “A”. Apakah paparan di
[forever] sebelum boleh dipanggil oleh blok [Simulator]?
[on button] semula
|35
Apakah yang berlaku pada [Simulator]?
ditunjukkan. Muncul satu button
‘virtual’ untuk simulasi
tekan button A dan button
B serentak
Tekan/klik [button A+B] pada simulator KETIKA ia

[Simulator]?
|36
Peranti micro:bit
mempunyai sensor Muncul satu button
accelerometer terbina ‘virtual’ untuk simulasi
dalam. Ini membolehkan goncangan
peranti ini mengesan
goncangan.

ditunjukkan.
Tekan/klik [shake] pada simulator KETIKA ia
Perhatikan pada
[Simulator]?
[Simulator] ada virtual
button ‘shake’ muncul dan
micro:bit juga boleh
digerak-gerakkan
|37
Pembolehubah
• Pembolehubah (variable) sangat penting dan berguna dalam
pengaturcaraan.
• Kita boleh mencipta pembolehubah kita sendiri.
• Nilai pembolehubah boleh berubah-ubah sepanjang aturcara
berjalan
|39
#16 Mari cuba...
1. Klik [Variables]
2. klik [Make a Variable]. Blok pembolehubah ‘dadu’ untuk
3. Satu dialog box akan muncul digunakan dalam aturcara
4. Taip ‘dadu’ sebagai nama

pembolehubah dan klik [OK]
5. Tiga ‘objek’ akan muncul
dalam [Variables] Blok untuk menetapkan nilai
pembolehubah ‘dadu’ secara tetap
Blok untuk mengubah nilai

pembolehubah ‘dadu’ dengan satu
nilai tetap setiap kali digunakan.
|40
Bina aturcara seperti yang Paparan LED akan memaparkan nombor menaik (+1)
ditunjukkan. bermula daripada nombor 1.
|41
Apa yang berlaku..? Carta Alir Aturcara
mula
Pada blok [ob start],

pembolehubah [dadu] kita dadu = 0
setkan kepada nilai ‘0’ (nilai
awal)
Pada blok [forever],

nilai [dadu] akan: dadu = dadu+1
1. Blok [change..by..]
akan manambah ‘1’
pada nilai dadu Paparkan nilai dadu
semasa.
2. Paparkan nilai dadu
|42
Bina aturcara seperti yang Paparan LED akan memaparkan nombor menaik (+1)
ditunjukkan. bermula daripada nombor 0.
|43
mula
Pada blok [on start],

pembolehubah [dadu] kita dadu = 0
setkan kepada nilai ‘0’ (nilai
awal)
Pada blok [forever],

nilai [dadu] akan: Paparkan nilai dadu
1. Paparkan nilai dadu
2. Blok [change..by..]
akan manambah ‘1’ dadu = dadu+1
pada nilai dadu
semasa.
|44

Bina aturcara seperti yang Paparan LED akan memaparkan nombor 0.
ditunjukkan.
Apakah yang berlaku pada [Simulator] apabila
[Button A] ditekan?
Paparan LED akan menaik sebanyak 1.

[Button B] ditekan?
Paparan LED akan menurun sebanyak 1.
Ini merupakan satu aplikasi

PAPAN MARKAH ELEKTRONIK
|45

Bina aturcara seperti yang ditunjukkan. Paparan LED tidak memaparkan apa-apa.
Klik [Math], dan drag blok [pick random…] dari

Toolbox ke Workspace. Taip untuk ubah nilai
[shake] ditekan?
Paparan LED akan memaparkan nombor antara 1 hingga 6
secara rawak
Ini merupakan satu aplikasi

DADU ELEKTRONIK
|46
Logic
Logic
• Blok [logic] membolehkan aturcara
‘membuat keputusan’untuk melaksanakan
bahagian aturcara berbeza berdasarkan
blok [conditionals] yang digunakan.
• Blok [conditionals] akan melaksanakan blok
di dalamnya jika diberikan nilai TRUE oleh
blok true
|48
Comparison
Ekspresi 1 Ekspresi 2
Pernyataan yang memenuhi kriteria ini akan
menghasilkan ‘TRUE’
Operator
Ekspresi 1 sama dengan Ekspresi 2
Ekspresi 1 tak sama dengan Ekspresi 2
Untuk perbandingan Ekspresi 1 kurang daripada Ekspresi 2

nombor perpuluhan
(decimal) Ekspresi 1 kurang atau sama dengan Ekspresi 2
Ekspresi 1 lebih daripada Ekspresi 2

Untuk perbandingan
nombor aksara dan Ekspresi 1 lebih atau sama dengan Ekspresi 2
rentetan (string)
|49
Input
Jika pin ditekan (sambungan ke GROUND). Boleh pilih P0, P1 atau P3
Jika ada goncangan. Dikesan dengan accelerometer terbina dalam micro:bit
Jika button A ditekan. Boleh pilih button A atau button B atau button A+B
|50

Bina aturcara seperti yang ditunjukkan. Paparan LED memaparkan ‘A’ (sentiasa). Ini kerana blok [if]
akan sentiasa aktif kerana ia sentiasa mendapat TRUE
disebabkan tiada blok dalam TRUE.
|51

Bina aturcara seperti yang ditunjukkan. Paparan LED kosong
Klik [Inputs], dan drag blok [button….is Tekan dan tahan (hold) button A. Apakah yang
pressed] dari Toolbox ke Workspace. berlaku pada [Simulator]?
Paparan LED akan memaparkan ‘A’
Sambungkan ke blok [if]
Lepaskan button A. Apakah yang berlaku pada
[Simulator]?
Paparan LED tetap memaparkan ‘A’
|52
Apa yang berlaku..? mula
Carta Alir Aturcara
NO Button A
ditekan?
YES
Paparkan ‘A’
|53

Tekan dan tahan (hold) button A. Apakah yang

berlaku pada [Simulator]?
Paparan LED akan memaparkan ‘A’, tetapi dapat diperhatikan
ada ‘kelipan’ berlaku.

[Simulator]?
Paparan LED kosong
|54
mula
Button A YES
ditekan?
NO
Paparkan ‘A’
Padamkan
paparan
|55

Tekan dan tahan (hold) button A. Apakah yang

berlaku pada [Simulator]?
Paparan LED akan memaparkan ‘A’. Tiada kerlipan
diperhatikan

[Simulator]?
Paparan LED kosong
|56
mula
Button A YES
ditekan?
NO
Padamkan Paparkan ‘A’

paparan
|57

Tekan dan tahan (hold) button A. Apakah yang berlaku

pada [Simulator]?
Paparan LED akan memaparkan ‘A’. Tiada kerlipan diperhatikan
Lepaskan button A. Apakah yang berlaku pada [Simulator]?

Paparan LED kosong
Tekan dan tahan (hold) button B. Apakah yang berlaku pada

[Simulator]?
Paparan LED akan memaparkan ‘B’. Tiada kerlipan diperhatikan
Lepaskan button B. Apakah yang berlaku pada [Simulator]?

Paparan LED kosong
|58
mula
Button A YES
Paparkan
ditekan? ‘A’
NO
Button B YES
Paparkan
ditekan? ‘B’
NO
Padamkan
paparan
|59
Comparison
Ekspresi 1 Ekspresi 2
Operator
Ekspresi 1 sama dengan Ekspresi 2
Ekspresi 1 tak sama dengan Ekspresi 2
Untuk perbandingan Ekspresi 1 kurang daripada Ekspresi 2

nombor perpuluhan
(decimal) Ekspresi 1 kurang atau sama dengan Ekspresi 2
Ekspresi 1 lebih daripada Ekspresi 2

Untuk perbandingan
nombor aksara dan Ekspresi 1 lebih atau sama dengan Ekspresi 2
rentetan (string)
|60

Bina aturcara seperti yang ditunjukkan. Muncul virtual slider untuk mensimulasikan bacaan suhu. Paparan
LED kosong
Cipta satu pembolehubah nama ‘suhu’
Gerakkan slider temperature ke maksimum (50°C). Apakah
yang berlaku pada [Simulator]?
Paparan LED akan memaparkan ‘X’.
Gerakkan slider temperature ke minimum (-5°C). Apakah

yang berlaku pada [Simulator]?
Paparan LED akan tetap memaparkan ‘X’.
|61
Apa yang berlaku..? mula Carta Alir Aturcara
Suhu = bacaan
sensor
Suhu = YES
Paparkan
40? ‘X’
NO
|62

LED kosong
Gerakkan slider temperature ke 40°C. Apakah yang berlaku

pada [Simulator]?
Gerakkan slider temperature ke selain daripada 40°C.

Paparan LED akan memaparkan ‘hearts’.
|63
Suhu = bacaan
sensor
Suhu = YES
Paparkan
40? ‘X’
NO
Paparkan
‘hearts’
|64

LED kosong

pada [Simulator]?
Paparan LED akan memaparkan ‘hearts’.

Paparan LED akan memaparkan ‘hearts’ apabila suhu di bawah 40°C
Paparan LED akan memaparkan ‘X’ apabila suhu di atas 40°C
|65
Suhu = bacaan
sensor
Suhu > YES

Paparkan
40? ‘X’
NO
Paparkan
‘hearts’
|66

LED kosong

pada [Simulator]?

Paparan LED akan memaparkan ‘hearts’ apabila suhu di bawah 40°C
Paparan LED akan memaparkan ‘X’ apabila suhu di atas 40°C
|67
Suhu = bacaan
sensor
Suhu >= YES

Paparkan
40? ‘X’
NO
Paparkan
‘hearts’
|68
Apakah yang berlaku pada [Simulator] apabila slider

Bina aturcara seperti yang ditunjukkan. digerakkan?
30°C
24°C
|69
Suhu = bacaan
sensor
Suhu >= YES

Paparkan
30? ‘X’
NO
Suhu >= YES

Paparkan
25? ‘heats’
NO
Paparkan
‘X’
|70
Boolean
Boolean
1 2 Pernyataan yang memenuhi KEDUA-DUA kriteria ini akan

1 2 Pernyataan yang memenuhi SALAH SATU ATAU KEDUA-
DUA kriteria ini akan menghasilkan ‘TRUE’
1
Pernyataan ‘TRUE’ akan jadi ‘FALSE’ dan sebaliknya
|72

30°C
24°C
|73
Suhu = bacaan
sensor
YES Paparkan
30>Suhu >= 25?
‘heats’
NO
Paparkan
‘X’
|74

30°C
24°C
|75
Suhu = bacaan
sensor
Suhu <24 atau YES Paparkan

suhu >=30? ‘X’
NO
Paparkan
‘hearts’
|76
Apakah yang berlaku pada [Simulator] apabila button A

Bina aturcara seperti yang ditunjukkan. ditekan?
|77
LED = False
Button A
YES Paparkan
ditekan DAN LED =False
LED=true? ‘✓’
NO
Button A
YES Paparkan
ditekan DAN LED =True
LED=false? ‘X’
|78

|79
Carta Alir Aturcara
LED = False
Button A YES LED=

ditekan? false?
NO
Paparkan Paparkan
‘X’ ‘✓’
LED =True LED =False
|80

|81
Carta Alir Aturcara
LED = False
Button A YES LED=

ditekan? false?
NO
Paparkan Paparkan
‘X’ ‘✓’
LED =NOT LED
|82
Loops
• Loops membolehkan kita mengulang sebahagian aturcara
sebanyak yang kita mahu.
• Ia membantu dalam rekabentuk aturcara yang efisyen
|84

Bina aturcara Paparan LED memaparkan ikon ‘hearts’ dan berkelip
seperti yang sebanyak 10 kali. Selepas itu ikon ‘betul’ akan dipaparkan
ditunjukkan. selama 2 saat. (ulang semula)
Apakah faedah menggunakan [loops]?

Ianya dapat memendekkan penulisan aturcara
|85
Apa yang berlaku..?
Dalam blok [forever],
Blok [repeat], akan melaksanakan

perkara berikut sebanyak 10 kali:
1. Paparkan ikon ‘hearts’
2. Pause selama 200ms
3. Padamkan paparan
4. Pause selama 200ms
Paparkan ikon ‘hearts’

Pause selama 200ms
|86
#36 Mari cuba...
1. Klik [Variables]
2. klik [Make a Variable].
3. Satu dialog box akan muncul
4. Taip ‘nombor’ sebagai nama

pembolehubah dan klik [OK]
5. Tiga ‘objek’ akan muncul
dalam [Variables]

Bina aturcara seperti yang ditunjukkan. Paparan LED memaparkan nombor 0, 1, 2 …..hingga 9 dan
berhenti
|88
Carta Alir Aturcara
nombor = 0
NO
Nombor <10?
YES
Paparkan nilai
nombor
Nombor = nombor+1
|89

ulang semula
|90
Carta Alir Aturcara
nombor = 0
NO
Nombor <10?
YES
Paparkan nilai
nombor
Nombor = nombor+1
|91

ulang semula
Tukar ke ‘≤’
|92
Carta Alir Aturcara
nombor = 0
NO
Nombor ≤10?
YES
Paparkan nilai
nombor
Nombor = nombor+1
|93

ulang semula
|94
Carta Alir Aturcara
index = 0
NO
Nombor ≤10?
YES
Paparkan nilai index
Nombor = nombor+1
|95

Belajar Koding Melalui Eksplorasi: Micro:bit

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Belajar Koding Melalui Eksplorasi: Micro:bit

Uploaded by

Copyright:

Available Formats

BELAJAR KODING micro:bit

Toolbox - ada beberapa blok

[show icon] - blok untuk

Blok [show icon] ini tidak aktif,

Klik ‘drop down arrow’ pada blok

Klik ‘drop down arrow’ pada blok

Setiap satu blok [show icon]

Apa yang boleh dilihat pada warna

2. Klik ‘drop down arrow’ pada Kenapa ia berlaku?

3. Sambungkan blok [show icon] Apakah paparan di [Simulator]?

Apakah paparan di [Simulator]?

2. Klik ‘drop down arrow’ pada

3. Klik [Basics] dan drag blok

4. Klik ‘drop down arrow’ pada

5. Sambungkan blok [show icon]

Apakah paparan di [Simulator]?

2. Klik ‘drop down arrow’ pada

3. Klik [Basics] dan drag blok

4. Klik ‘drop down arrow’ pada

5. Sambungkan blok [show icon]

Apakah paparan di [Simulator]?

Apakah paparan di [Simulator]?

Blok [on start] (jika ada) adalah yang

Blok [forever] akan run selepas blok

Klik [Basics] dan drag blok

berulang Tunggu 1 saat

Blok [pause (ms)] akan

Blok [show number] membolehkan

Klik [Basics] dan drag blok

Klik [Basics] dan drag blok

Blok [show string] akan memaparkan

Klik [Basics], kemudian klik

Klik [Basics] dan drag blok

Oleh kerana aturcara ini diletakkan

Klik [Basics], kemudian klik

Klik [Basics] dan drag blok

Oleh kerana aturcara ini diletakkan

Klik [Input], dan drag blok

Perhatikan blok [on button] ini:

Oleh yang demikian:

Tekan/klik [button A] pada simulator

Tekan/klik [button A] pada simulator KETIKA ia

Tekan/klik [button B] pada simulator KETIKA ia

Tekan/klik [button B] pada simulator KETIKA ia

Tekan/klik [button B] pada simulator KETIKA ia

Tekan/klik [button A+B] pada simulator KETIKA ia

Bina aturcara seperti yang

4. Taip ‘dadu’ sebagai nama

Blok untuk mengubah nilai

Pada blok [ob start],

Pada blok [forever],

Pada blok [on start],

Pada blok [forever],

Apakah yang berlaku pada [Simulator]?

Apakah yang berlaku pada [Simulator] apabila

Ini merupakan satu aplikasi

Apakah yang berlaku pada [Simulator]?

Klik [Math], dan drag blok [pick random…] dari

Ini merupakan satu aplikasi

Ekspresi 1 tak sama dengan Ekspresi 2

Untuk perbandingan Ekspresi 1 kurang daripada Ekspresi 2

Ekspresi 1 lebih daripada Ekspresi 2

Jika pin ditekan (sambungan ke GROUND). Boleh pilih P0, P1 atau P3