Asas Sains Komputer (Tingkatan 1) - Bab 1.pdf

Bab 1 akan mengajar tentang Asas Pemikiran Komputasional. Dalam Bab ini kebanyakan ialah teori. Oleh itu, murid-murid mesti ingat definisi setiap perkataan. Tapi, saya cuba ambil satu contoh untuk menerangkan setiap konsep dalam dokumen ini. Harap membantu semua. Terima kasih.

1. Bab 1 Konsep Asas
Pemikiran Komputasional
Qing Hao Chai

2. Bab ini akan menjawab soalan berikut:
1.Apakah itu Pemikiran Komputasional?
2.Apakah tujuan Pemikiran Komputasional?
3.Apakah itu Teknik dalam Pemikiran Komputasional?
4.Macam mana kita menggunakan Teknik Pemikiran Komputasional semasa
menyelesaikan sesuatu masalah?

3. Sebelum kita mula
Bayangkan diri-sendiri sekarang ialah seorang Software Developer macam Encik
Ali. Saya ialah Encik Abu, ialah supervisor Encik Ali.

ABU
ALI
Selamat pagi Encik Ali. Hari ini, pelanggan kita dari EFG
Sdn. Bhd. ingin menukar sedikit dalam modul Payment
dalam sistem.
Selamat pagi Encik Abu. Boleh saya tahu lebih lanjut
tentang modifikasi ini?
ABU
Saya menerima feedback dari Encik Chai, QA Executive dari
EFG Sdn. Bhd., dia cakap tajuk “Payment” terlalu besar dalam
skrin, dan warna fon itu menyebabkan pengguna susah nak
tengok. Juga, warna untuk butang “Back” macam tak setanding
dengan butang yang lain.
Hari ini 9.05AM
Hari ini 9.07AM
Hari ini 9.08AM

4. Sebelum kita mula (teruskan…)
ABU
ALI
Ini-lah screenshot yang Encik Chai bagi. Sila semakkan
kod. Kalau boleh, kita siapkan sebelum masa lunch.
Tak ada masalah, saya akan menyemak isu ini selepas
progress meeting pada pukul 9.15AM.
Attachment_20250914_Payment_Screen.jpeg
Hari ini 9.08AM

5. Murid-murid, sekarang Encik Ali ada apa info penting?
ABU
Saya menerima feedback dari Encik Chai, QA Executive dari
EFG Sdn. Bhd., dia cakap tajuk “Payment Completed” terlalu
besar dalam skrin, dan warna fon itu menyebabkan pengguna
susah nak tengok. Juga, warna untuk butang “Back” macam tak
sama dengan butang yang lain.
Hari ini 9.08AM
1.Tajuk “Payment” terlalu besar dalam skrin
2.Warna fon itu menyebabkan pengguna susah nak tengok.
3.Warna untuk butang “Back” macam tak sepandan dengan butang yang
lain.

6. Ada lagi info tak?
4. Imej yang diberikan.
ABU
Ini-lah screenshot yang Encik Chai bagi. Sila semakkan
kod. Kalau boleh, kita siapkan sebelum masa lunch.

Attachment_20250914_Payment_Screen.jpeg
Hari ini 9.08AM

7. Imej yang diberikan oleh Encik Abu
Payment
Successful
Payment Date:14 September 2025
Payment Time: 8:30:45 PM
Reference Number: ABC123
Payment Method: TNG
Back
This font size is
too big. And the
colour is too light,
difficult to see…
Why this button
colour is not tally
with the Back
button in other
screen?

8. Sampai sini, Encik Ali telah menggunakan Teknik apa?
Jawapan: Teknik Leraian
Sebab: Encik Ali tahu sekarang pelanggan nak menukar sedikit dalam modul “Payment”. Lepas
itu, Encik Ali mendapat info lebih lanjut tentang modifikasi ini dari Encik Abu.

Masalah: Tugasan untuk menukar sedikit dalam modul “Payment” (Skop besarnya…)
Pemecahan: (Pecahkan masalah kepada bahagian-bahagian yang lebih kecil)
-Tajuk “Payment” terlalu besar dalam skrin
-Warna fon itu menyebabkan pengguna susah nak tengok.
-Warna untuk butang “Back” macam tak sepandan dengan butang yang lain.

9. Apakah definisi Teknik Leraian?
-Melibatkan pemecahan suatu masalah atau sistem yang kompleks
-Pecahkan masalah tertentu kepada bahagian-bahagian kecil
-Tujuannya untuk memudahkan pemahaman dan penyelesaian.
-Masalah utama dipecahkan kepada masalah kecil yang lebih ringkas
Task ID: 12345
Task Type: Customer Request
Task Name: Modifikasi dalam Modul Payment
Task Description:





Created by: Abu
Assigned to: Ali
Last updated on: 14 September 2025 9:02:35 AM
Priority: 2

1.Payment Successful terlalu besar dalam aspek saiz fon. Perlu tukar saiz.
2.Payment Successully warnanya terlalu terang, pengguna susah nampak. Perlu
tukar warna.
3.Warna butang “Back” tak sepandan dengan butang lain. Perlu tukar

10. Encik Ali sudah tahu apa masalah yang perlu selesai
-Saiz fon untuk “Payment Successful”
-Warna fon untuk “Payment Successful”
-Jadikan warna butang “Back” sama dengan butang “Back” dalam skrin lain

Sila nyatakan, apakah ciri-ciri yang sama dalam masalah-masalah atas?
-Modifikasi melibatkan perkataan “Payment Successful” dalam aspek
saiz dan warna fon.
-Butang “Back” terdapat dalam skrin yang lain.

11. Kenapa nak tahu ciri-ciri sama?
Jawapan: Untuk menyelesaikan masalah dengan lebih senang.
Sebab:
-Sekarang Encik Ali tahu “Payment Successfully” yang terlibat. Oleh itu, dia
cuma perlu semak kod pada bahagian itu sahaja.
-Encik Ali juga tahu skrin-skrin lain ada butang “Back”. Oleh itu, dia cuma perlu
bandingkan kod butang “Back” dengan skrin yang lain.
Apakah teknik yang telah digunakan?
Jawapan: Teknik pengecaman corak

12. Apakah definisi Teknik Pengecaman Corak?
-Masalah-masalah kecil yang dipisahkan tadi akan dianalisis.
-Analisis tersebut adalah untuk mengenal pasti corak tertentu.
-Corak-corak tersebut terdiri daripada ciri-ciri yang sama untuk masalah kecil.

Perkara Ciri-ciri yang sama
Perkataan “Payment Successful” Pernukaran saiz dan warna fon perlu dibuat
kepada perkataan ini.
Butang “Back” Butang terdapat dalam skrin yang lain dan
boleh berbading dengannya. Akhirnya,
tukar kepada warna yang sama.

13. Encik Ali telah semak kod dan dokumen yang disediakan
Dokumen Functional Specification ada menentukan butang “Back” dalam skrin
“Payment Successful” perlu menggunakan warna Hijau yang sekarang digunakan.
Warna ini memang tidak sepadan dengan butang “Back” yang lain.

Kalau murid-murid ialah Encik Ali, apakah perkara yang perlu teruskan?
Nak terus kekalkan warna butang?
Nak terus tukar warna butang?
Ataupun tanya Encik Abu dulu?
Ingat: Soalan ini tidak ada jawapan yang semestinya
betul atau salah. Tapi, kalau Encik Ali tidak mempunyai
bukti-bukti yang secukupnya untuk pasti perkara ini
perlu merujuk kepada dokumen atau feedback dari
Encik Chai, Encik Ali mesti tanya Encik Abu dulu.

14. Encik Ali tanya Encik Abu tentang soalan butang tadi
ALI
ABU
Encik Abu, soalan butang tadi nak macam mana?
Hai Encik Ali. Saya sudah tanya Encik Chai tadi dengan
menggunakan emel. Saya ada CC kamu. Kita tunggu dia
reply.
ALI
Oh, Encik Chai sudah reply. Dia cakap kita mengikut warna
yang ditentukan dalam dokumen Functional Specification. Tapi,
warna dan saiz fon “Payment Successful” masih perlu tukar.
Hari ini 10.15AM
Hari ini 10.20AM
Hari ini 10.25AM
ABU
Bagus. Saya sudah bagi tahu Puan Aina untuk
mengemaskini dokumen Functional Specification. Harap
hari ini boleh sign-off.Hari ini 10.20AM

15. Murid-murid, Encik Ali perlu menukar warna butang tak?
Jawapan: Tidak
Sebab: Encik Chai sudah mengatakan bahawa warna butang mengikut apa yang dituliskan
dalam dokumen Functional Specification.

Soalan Tambahan 1: Encik Ali perlu tukar saiz dan warna untuk “Payment Successful” tak?
Jawapan: Ya, perkara ini perlu dilakukan.
Soalan Tambahan 2: Encik Ali perlu mengemas-kini dokumen Functional Specification tak?
Jawapan: Tidak. Perkara ini akan dilakukan oleh Puan Aina.

16. Apakah teknik yang telah digunakan?
Jawapan: Teknik Peniskalaan
Sebab: Encik Ali telah mengenal-pasti bahagian butang tidak memerlukan
modifikasi. Oleh itu, dia dapat fokus dalam masalah yang lebih penting iaitu
penukaran saiz dan warna “Payment Successful”.
Task ID: 12345
Task Type: Customer Request
Task Name: Modifikasi dalam Modul Payment
Task Description:





Created by: Abu
Assigned to: Ali
Last updated on: 14 September 2025 10:21 AM [By: Ali]
Priority: 2

1.Payment Successful terlalu besar dalam aspek saiz fon. Perlu tukar saiz.
2.Payment Successully warnanya terlalu terang, pengguna susah nampak. Perlu
tukar warna.
3.Warna butang “Back” tak sepandan dengan butang lain. [202509141020: Tidak
perlu]

17. Apakah definisi untuk Teknik Peniskalaan?
-Tinggalkan aspek-aspek yang kurang penting yang terdapat dalam corak
yang dicamkan
-Fokus kepada aspek-aspek penting dalam penyelesaian masalah.
Perkara Status
Perkataan “Payment Successful” Pernukaran saiz dan warna fon perlu dibuat
kepada perkataan ini.
Butang “Back” Batal. Encik Chai sudah kata perkara ini
tidak perlu modifikasi.

18. Sebelum mula pertukaran
Encik Ali perlu tahu warna dan saiz yang perlu digunakan oleh “Payment
Successful”. Oleh itu, dia terus tanya Puan Aina, seorang System Analyst yang
bertanggungjawab untuk menyediakan dokumen Functional Specification.
ALI
AIN
Hai Aina. Saya belum dapat dokumen Functional
Specification. Boleh saya tahu warna and saiz baru yang
telah digunakan?
Minta maaf, hari ini saya ada banyak dokumen yang kena
siap. Tadi saya tanya UI/UX designer, Encik Ng, dia cakap
warna ialah #000000 (hitam) dan saiz ialah 40px. Nanti
saya share dokumen baru ya. Terima kasih.
Hari ini 10.15AM
Hari ini 10.20AM

19. Encik Ali senaraikan apakah yang diperlukan
Sistem: SystemA, bahagian front-end
Skrin: Payment Successful (Fail: pymtsuccess.vue)
Teknik: HTML dan Vue.JS
Formula: Warna ialah #000000 dan saiz ialah 40px
Peraturan: Warna dan saiz mesti menggunakan formula yang dibagikan untuk perkataan “Payment Successful”
Langkah-langkah:
1.Buka projek SystemA
2.Buka fail pymtsuccess.vue
3.Cari objek atau perkataan “Payment Successful”
4.Semak warna dan saiz yang telah digunakan.
5.Tukar warna dan saiz
6.Simpan fail dan membuat pengujian.
7.Deploy fail ke dalam server pelanggan.

20. Apakah teknik yang telah digunakan?
Jawapan: Teknik pengitlakan
Sebab:
-Encik Ali ada satu model untuk penyelesaian masalah
-Model itu dalam bentuk formula, teknik, peraturan atau langkah-langkah.

21. Apakah definisi Teknik Pengitlakan
-Melibatkan pembinaan model
-Bagi penyelesaian masalah
-Dalam bentuk formula, teknik, peraturan, atau langkah-langkah.

22. Teknik dalam Pemikiran Komputasional
1.Teknik Leraian (Decomposition)
2.Teknik Pengecaman Corak (Pattern Recognition)
3.Teknik Peniskalan (Abstraction)
4.Teknik Pengitlakan (Generalisation)

23. Apakah itu Pemikiran Komputasional?
-Satu proses pemikiran
-Tujuannya adalah untuk menyelesaikan masalah oleh manusia sendiri
-Berbantukan mesin atau manusia sekali
-Menggunakan konsep asas sains komputer

24. Apakah kegunaan Pemikiran Komputasional
-Membolehkan kita mengambil masalah yang kompleks
-Memahami masalah sebenar
-Membangunkan kaedah penyelesaian yang boleh diguna pakai.

25. Q&A

26. Q1: Apakah maksud pemikiran komputasional?
-Proses pemikiran
-Tujuannya adalah untuk menyelesaikan masalah
-Masalah itu berbantukan mesin

27. Q2: Sila nyatakan urutan Teknik Pemikiran Komputasional
dengan betul.
Langkah 1: Masalah dipecahkan
Langkah 2: Kenal pasti corak yang sama
Langkah 3: Tinggalkan perkara yang tidak penting
Langkah 4: Sediakan satu model penyelesaian masalah

28. Teknik Leraian
(Decomposition)
Pemecahan suatu masalah atau sistem yang kompleks
kepada bahagian-bahagian kecil untuk memudahkan
pemahaman dan penyelesaian.
Memecahkan pengiraan bil elektrik
berdasarkan penggunaan dan kadar
yang digunakan
Teknik Pengecaman
Corak (Pattern
Recognition)
Masalah-masalah kecil yang dipisahkan akan dianalisis
untuk mengenal pasti corak tertentu.
Corak-corak tersebut terdiri daripada ciri-ciri yang
sama untuk masalah kecil.
Semua lembu ada empat kaki
Teknik Peniskalan
(Abstraction)
Tinggalkan aspek-aspek yang kurang penting yang
terdapat dalam corak yang dicamkan. Fokus kepada
aspek-aspek penting dalam penyelesaian masalah.
Esok akan mengambil ujian subjek
Matematik. Saya membuat latihan
subjek Matematik hari ini dulu.
Teknik Pengitlakan
(Generalisation)
Melibatkan pembinaan model bagi penyelesaian
masalah dalam bentuk formula, teknik, peraturan, atau
langkah-langkah.
Makan ubat dengan mengikut masa,
bilangan pil yang ditentukan oleh
doktor semasa deman.
Q3: Sila nyatakan definisi dan contoh setiap teknik berikut

29. Fokus Bab Tersebut
-Definisi Pemikiran Komputasional
-Definisi langkah dan contoh setiap Teknik Pemikiran Komputasional