Modul Digital

TINTA PENGARAH

Setinggi-tinggi kesyukuran ke hadrat Ilahi kerana dengan limpah rahmat
dan kasih sayang-Nya, Modul MRSM Bitara ini dapat dihasilkan dengan
jayanya. Tahniah dan syabas kepada Jawatankuasa Bitara yang telah
mengambil inisiatif menghasilkan lima buah modul dalam usaha ke arah
Pemerkasaan MRSM Bitara. Sekalung penghargaan juga kepada guru-
guru yang terlibat, atas kesungguhan dan komitmen dalam
menghasilkan modul ini.

Program MRSM Bitara yang mula dilaksanakan pada tahun 1999 menjadi teras kepada
Program Khas Pendidikan (PKP) yang telah diperkenalkan pada tahun 1990. Program ini
sebagai satu keperluan untuk membentuk modal insan yang dinamik selari dengan ciri-ciri
pintar cerdas melalui pengintegrasian Teknologi Maklumat dan Komunikasi (TMK). Selaras
dengan perkembangan Revolusi Perindustrian ke-4 (IR4.0) yang mencakupi penemuan
pelbagai teknologi baharu seperti automasi, Internet of Things (IoT), big data dan simulasi
yang merancakkan kemajuan landskap dunia moden, Bahagian Pendidikan Menengah (BPM)
menambah baik program ini dengan memberi fokus kepada pembangunan pelajar. Usaha ini
dilaksanakan bagi memastikan pelajar berkeupayaan mendepani alaf baharu selaras dengan
moto MARA iaitu “Keusahawanan dan Pendidikan Global”.

Pendidikan ialah suatu kewajipan dan memerlukan komitmen yang berterusan, dinamik dan
saintifik untuk mempertingkatkan kualiti dan kebergunaan manusia kepada diri sendiri,
masyarakat dan Tuhan. Oleh itu, program MRSM Bitara diwujudkan bagi memenuhi keperluan
masyarakat akan datang.

Besar harapan MARA khususnya BPM agar Modul MRSM Bitara ini dilaksanakan dengan
sempurna selari dengan objektif yang telah digariskan untuk melahirkan pelajar yang seimbang
dan holistik (unggul, unik, terbeza dan tiada taranya) agar dapat memberikan khidmat dan
sumbangan kepada bangsa, agama dan negara.

“MRSM: Mendokong Aspirasi, Mencorak Kecemerlangan Generasi”

ABD MANAB BIN ABDUL MAJID
Pengarah
Bahagian Pendidikan Menengah

JAWATANKUASA MRSM BITARA BAHAGIAN PENDIDIKAN MENENGAH

1 ABD MANAB BIN ABDUL MAJID PENGARAH

2 JURIAH BINTI ALIAS TIMBALAN PENGARAH I

(PEMBANGUNAN KURIKULUM)

3 SHAHRIZAL BIN MOHD SADERI TIMBALAN PENGARAH I

(PENGURUSAN & PERKHIDMATAN)

4 JASMIN BIN ABD SHUKOR TIMBALAN PENGARAH I

(HAL EHWAL PELAJAR)

5 NORIZAN BINTI KASAH TIMBALAN PENGARAH II (MATEMATIK)

6 NURUL BINTI SAHARUDIN KPP (BAHASA INGGERIS)

7 MAHATUN BINTI HITAM KPP (MATEMATIK)

8 AHMAD SYUKRI BIN AHMAD HARIRI KPP (PERKHIDMATAN GURU)

9 ITHNAINI BINTI MUHAMED KAMIL KPP (FIZIK)

10 RAFIDAH BINTI JAAFAR KPP (BAHASA MELAYU)

11 DR ZULKIFLI BIN HUSSAIN @ MAT HASSAN KPP (BIMBINGAN & KAUNSELING)

12 WAN AHMAD MARZUKI BIN WAN AHMAD KPP (PENDIDIKAN ISLAM)

13 KHAIRUL ANUAR BIN RAMLI KPP (PEMBANGUNAN SISTEM &

PEMANTAUAN)

14 SHAZARINA BINTI SOEIB KPP (PENGAMBILAN & PENEMPATAN)

15 ABDULLAH SHUHAIMI BIN ROZLAN KPP (SAINS KOMPUTER)

16 GHAZALI BIN MUSA KPP (KIMIA)

17 MOHD FAUZI BIN YUSOF KPP (LATIHAN)

18 NORASIKIN BINTI ZAINAL KPP (KOKURIKULUM)

19 AZIYANI BINTI AZIZAN KPP (BESTARI)

20 WAN JULIANA BINTI WAN ASHARUDDIN PENOLONG PENGARAH

[Document title]

[Document subtitle]

Abstract

[Draw your reader in with an engaging abstract. It is typically a short summary of the
document.

When you’re ready to add your content, just click here and start typing.]

PENULIS:
ABDULLAH SHUHAIMI BIN ROZLAN ARIFFIN

MUHAMMAD HAZRAT BIN ISMAIL
JOHAN JOHARI BIN MOHD TUKIRAN

MUHAMMAD AKRAM BuIsNeArHMAD

SHU[HEmAaIDil AadBdrIeNsTs]I FUAD
AZIYANI BINTI AZIZAN

KANDUNGAN MODUL 1

Modul 1 – 01: IOS vs ANDROID............................................................................................................... 2
Modul 1 – 02: Pengenalan Revolusi Industri 4.0 (IR-4.0)........................................................................ 4

1

Modul 1 – 01: IOS vs ANDROID

AKTIVITI 1 (10 minit)
Sila Dapatkan Tandatangan dan Nama Ahli Kelas Yang Menggunakan Telefon:
ANDROID (Samsung/Huawei/VIVO/RealMe/ dll)

…………………………. …………………………. …………………………. …………………………. ………………………….
( )( )( )( )( )

…………………………. …………………………. …………………………. …………………………. ………………………….
( )( )( )( )( )

…………………………. …………………………. …………………………. …………………………. ………………………….
( )( )( )( )( )

…………………………. …………………………. …………………………. …………………………. ………………………….
( )( )( )( )( )

…………………………. …………………………. …………………………. …………………………. ………………………….
( )( )( )( )( )

…………………………. …………………………. …………………………. …………………………. ………………………….
( )( )( )( )( )

IOS (iPhone)

…………………………. …………………………. …………………………. …………………………. ………………………….
( )( )( )( )( )

…………………………. …………………………. …………………………. …………………………. ………………………….
( )( )( )( )( )

…………………………. …………………………. …………………………. …………………………. ………………………….
( )( )( )( )( )

…………………………. …………………………. …………………………. …………………………. ………………………….
( )( )( )( )( )

…………………………. …………………………. …………………………. …………………………. ………………………….
( )( )( )( )( )

…………………………. …………………………. …………………………. …………………………. ………………………….
( )( )( )( )( )

JUMLAH PENGGUNA ANDROID DALAM KELAS = …………….
JUMLAH PENGGUNA IOS DALAM KELAS = ……………
** Buat analisis data dan kesimpulan kumpulan sasaran aplikasi pintar yang boleh anda bangunkan.

2

AKTIVITI PDPR 1.0

AKTIVITI 1
1. Pelajar perlu klik masuk ke laman web https://www.menti.com/5atvfs8we7
2. Atau masuk ke laman web Join a presentation (menti.com) dan masukkan kod 6288 6590.
3. Guru boleh melihat dan memaparkan LIVE RESULT dengan link ini
https://www.mentimeter.com/s/29f20796da4e0673a1d95d3a49989791/70d275600830
4. Guru boleh menggunakan contoh ini dan mencipta mentimeter sendiri.

3

Modul 1 – 02: Pengenalan Revolusi Industri 4.0 (IR-4.0)

AKTIVITI 2 (30 minit)

Bahagikan kelas kepada 9 kumpulan untuk mempelajari bidang-bidang dalam IR 4.0 berikut:

KUMPULAN BIDANG IR 4.0 LINK VIDEO
1 Autonomous Robot / Artificial Intelligent 1. How the World’s First

2 Big Data Analysis Autonomous Pizza Robot
3 Cloud Computing Works - YouTube
2. Dr M meets Sophia the
4 Internet Of Things (IOT) ‘social humanoid’ robot -
YouTube
5 Additive Manufacturing (3D Printing) 1. Apa Itu Big Data? -
6 System Integration YouTube
7 Cyber Security 2. Implementasi Big Data
dan contohnya pada
perusahaan - YouTube
1. Cloud Storage - YouTube
2. Cloud Computing In 6
Minutes | What Is Cloud
Computing? | Cloud
Computing Explained |
Simplilearn - YouTube
1. Life Simplified with
Connected Devices -
YouTube
2. Internet of Things (IoT) |
What is IoT | How it
Works | IoT Explained |
Edureka - YouTube
1. Face Shield guna 3D
Printer - Cadangan untuk
frontliner - YouTube
2. What Is Additive
Manufacturing? - YouTube
1. Cara Guna My RFID Touch
n Go 2020 - YouTube
2. FUNGSI-FUNGSI MyKad
(IC) YANG RAMAI LAGI
TAK TAHU - YouTube
1. CyberSecurity Malaysia:
Malaysia Security
Evaluation Facility
(English) - YouTube
2. Cyber Security (Firdaus
Ali) - YouTube

4

8 Augmented Reality (AR) & Virtual Reality (VR) 1. Everything Facebook

revealed about the

Metaverse in 11 minutes -

YouTube

2. Pokemon GO's new AR+

Mode for iOS - YouTube

3. AR vs VR | What are

Virtual and Augmented

Realities? | @edureka! -

YouTube

9 Simulation 1. Defensive Driving School

Simulator Promo video -

YouTube

2. Simulator Training - Your

Last Step Before Flying

Jets! - YouTube

Dalam kumpulan, tonton video contoh dalam 9 bidang utama dalam IR 4.0, dan bina peta minda
menyatakan:

1) Apa yang anda faham tentang bidang IR 4.0 yang dinyatakan
2) Kepentingan / Kebaikan setiap bidang IR 4.0 dalam kehidupan
3) Cadangan bagaimana bidang IR 4.0 ni boleh dikaitkan dengan pembinaan aplikasi telefon

pintar.

AKTIVITI PDPR 2.0

Sekiranya kelas dijalankan secara PDPR, guru boleh melaksanakannya menggunakan MICROSOFT
TEAMS BREAKOUT ROOMS. Rujuk artikel Microsoft: Use breakout rooms in Teams meetings
(microsoft.com)

Pelajar kemudian boleh log masuk ke laman web https://www.canva.com/graphs/mind-maps/ dan
dalam kumpulan mereka boleh mencipta peta minda dan dibentangkan semasa sesi PDPR.
** Boleh gunakan Microsoft Powerpoint Online atau mana-mana aplikasi yang difikirkan sesuai
AKTIVITI 3 (20 minit)
Setiap Kumpulan akan membentangkan hasil dapatan berdasarkan perbincangan mereka kepada
seluruh ahli kelas
** Pembentangan boleh dilaksanakan secara bersemuka dan atas talian

5

[Document title]

[Document subtitle]

Abstract

[Draw your reader in with an engaging abstract. It is typically a short summary of the
document.

When you’re ready to add your content, just click here and start typing.]

PENULIS:
ABDULLAH SHUHAIMI BIN ROZLAN ARIFFIN

MUHAMMAD HAZRAT BIN ISMAIL
JOHAN JOHARI BIN MOHD TUKIRAN

MUHAMMAD AKRAM BuIsNeArHMAD

SHU[HEmAaIDil AadBdrIeNsTs]I FUAD
AZIYANI BINTI AZIZAN

KANDUNGAN MODUL 2

Modul 2 – 01: Software Development Life Cycle (SDLC) ........................................................................ 2
Modul 2 – 02: Menjana pendapatan dengan Mobile Apps .................................................................... 5
Modul 2 – 03: Keperluan Peralatan & Perisian untuk Membangunkan Aplikasi Telefon Pintar ..........10

1

Modul 2 – 01: Software Development Life Cycle (SDLC)

Sebelum memulakan aktiviti, guru perlu menyediakan / mencetak maklumat-maklumat berkenaan
Software Development Life Cycle seperti di bawah, dan ditampal di dalam kelas di lokasi yang bebeza.
Pelajar perlu melakukan aktiviti GALLERY WALK dan mencatat maklumat yang ditampal di sekitar
kelas, dan kemudian menyusun proses SDLC dengan betul di lampiran yang disediakan.

Perancangan dan Sumbangsaran

Perancangan adalah peringkat yang paling penting dan asas dalam SDLC. Ia
dilakukan oleh ahli kanan pasukan dengan input daripada pelanggan, jabatan
jualan, tinjauan pasaran dan pakar domain dalam industri. Maklumat ini
kemudiannya digunakan untuk merancang pendekatan projek asas dan untuk
menjalankan kajian kebolehlaksanaan produk dalam bidang ekonomi, operasi dan
teknikal.

Perancangan untuk keperluan jaminan kualiti dan pengenalpastian risiko yang
berkaitan dengan projek juga dilakukan dalam peringkat perancangan. Hasil kajian
kemungkinan teknikal adalah untuk mentakrifkan pelbagai pendekatan teknikal
yang boleh diikuti untuk melaksanakan projek dengan jayanya dengan risiko yang
minimum.

Menentukan Keperluan

Setelah perancangan dilakukan, langkah seterusnya ialah mentakrif dan
mendokumentasikan dengan jelas keperluan aplikasi dan mendapatkannya
diluluskan daripada pelanggan atau penganalisis pasaran. Ini dilakukan melalui
dokumen SRS (Spesifikasi Keperluan Perisian) yang terdiri daripada semua
keperluan produk untuk direka bentuk dan dibangunkan semasa kitaran hayat
projek.

Merekabentuk Produk & Memilih Platform Pembangunan

SRS menjadi rujukan kepada arkitek produk untuk mengeluarkan seni bina terbaik
untuk produk yang akan dibangunkan. Berdasarkan keperluan yang dinyatakan
dalam SRS, biasanya lebih daripada satu pendekatan reka bentuk untuk seni bina
produk dicadangkan dan didokumenkan dalam DDS - Spesifikasi Dokumen Reka
Bentuk.

DDS ini disemak oleh semua pihak berkepentingan yang penting dan berdasarkan
pelbagai parameter seperti penilaian risiko, keteguhan produk, modulariti reka
bentuk, bajet dan kekangan masa, pendekatan reka bentuk terbaik dipilih untuk
produk.

Pendekatan reka bentuk dengan jelas mentakrifkan semua modul seni bina

produk bersama-sama dengan komunikasi dan perwakilan aliran datanya dengan

modul luaran dan pihak ketiga (jika ada). Reka bentuk dalaman semua modul seni

bina yang dicadangkan hendaklah ditakrifkan dengan jelas dengan butiran terkecil

dalam DDS. 2

Membina dan Membangunkan Produk
Dalam peringkat SDLC ini pembangunan sebenar bermula dan produk dibina. Kod
pengaturcaraan dijana mengikut DDS semasa peringkat ini. Jika reka bentuk
dilakukan secara terperinci dan teratur, penjanaan kod boleh dicapai tanpa
banyak kerumitan.
Pembangun mesti mengikut garis panduan pengekodan yang ditakrifkan oleh
organisasi mereka dan alatan pengaturcaraan seperti penyusun, jurubahasa,
penyahpepijat, dsb. digunakan untuk menjana kod. Bahasa pengaturcaraan
peringkat tinggi yang berbeza seperti C, C++, Pascal, Java dan PHP digunakan
untuk pengekodan. Bahasa pengaturcaraan dipilih berkenaan dengan jenis
perisian yang dibangunkan.

Menguji Produk
Peringkat ini biasanya merupakan subset daripada semua peringkat seperti dalam
model SDLC moden, aktiviti ujian kebanyakannya terlibat dalam semua peringkat
SDLC. Walau bagaimanapun, peringkat ini merujuk kepada peringkat ujian sahaja
produk di mana kecacatan produk dilaporkan, dikesan, diperbaiki dan diuji semula,
sehingga produk mencapai piawaian kualiti yang ditakrifkan dalam SRS.

Penggunaan di Pasaran dan Penyelenggaraan
Setelah produk diuji dan sedia untuk digunakan, produk itu dikeluarkan secara
rasmi di pasaran yang sesuai. Kadangkala penyebaran produk berlaku secara
berperingkat mengikut strategi perniagaan organisasi tersebut. Produk ini
mungkin dikeluarkan terlebih dahulu dalam segmen terhad dan diuji dalam
persekitaran perniagaan sebenar (UAT-Ujian penerimaan pengguna).
Kemudian berdasarkan maklum balas, produk mungkin dikeluarkan sebagaimana
adanya atau dengan cadangan peningkatan dalam segmen pasaran sasaran.
Selepas produk dikeluarkan di pasaran, penyelenggaraannya dilakukan untuk
pangkalan pelanggan sedia ada.

3

AKTIVITI 1 (20 minit)
Pelajar perlu bergerak ke 6 stesen - informasi tentang proses Software Development Life Cycle
(SDLC) Process dan fahamkan setiap proses dalam SDLC. Kemudian isikan gambarajah di bawah
mengikut mengikut susunan yang betul.

1.

6. 2.

5. 3.

4.

AKTIVITI PDPR 3.0

1. Pelajar perlu melayari laman web untuk mendapatkan maklumat tetang SDLC: SDLC -
Overview (tutorialspoint.com)

2. Berdasarkan maklumat di atas, Pelajar perlu membina satu SMART ART menggunakan
Microsoft Word / Powerpoint Online yang menunjukkan proses yang berlaku dalam
SOFTWARE DEVELOPMENT LIFE CYCLE.

3. Pelajar kemudian menunjukkan / menghantar tugasan kepada guru, dan guru akan menanda
hasil kerja pelajar dan memaklumkan pembetulan dalam gambarajah yang dilakukan.

4

Modul 2 – 02: Menjana pendapatan dengan Mobile Apps

Aktiviti 2 (20 Minit)
Pelajar diminta membuat Peta i-Think bedasarkan maklumat tentang cara menjada pendapatan &
keusahawanan dengan Mobile Apps.

1. Menyertai Pertandingan Inovasi
Sekiranya anda menang, dapat hadiah wang tunai. Kalau tak menang, usaha lagi. Selain itu,
anda boleh mendaftarkan hak-cipta.

2. Mencipta Aplikasi Berbayar

5

3. Mencipta Pembelian Dalam Aplikasi
6

4. Google Admob
Google Admob adalah satu contoh pengiklanan dalam aplikasi.
Contoh Pendapatan dengan Google Admob. USD 132 = RM 554.23 sebulan

Fungsi Admob adalah kita akan mendapat komisyen kerana membenarkan iklan dipaparkan
dalam aplikasi kita

Contoh iklan dalam aplikasi

7

5. Bekerja Sebagai Apps Developer
Gaji seorang pembangun aplikasi telefon pintar di Malaysia

6. Content Creator
Dengan menggunakan media Youtube, Tik Tok atau Sosial Media lain, anda boleh Moneytize
Channel Youtube / Tiktok Anda.

8

7. Menganjurkan Kursus / Latihan Membina Mobile Apps.
Anda boleh menjana pendapatan dimana peserta perlu membayar yuran kursus kepada kita.

8. Pembangun Aplikasi Telefon Pintar Bebas
Anda juga boleh mencari pelanggan / syarikat lain yang memerlukan pembangun aplikasi
mobile untuk syarikat mereka.

Dan banyak lagi peluang anda boleh terokai sebagai Pembangun Aplikasi Telefon Pintar

AKTIVITI PDPR 4.0

Guru boleh memberikan modul atau meminta pelajar mencari Source of Income from Mobile Apps
Development dan pelajar perlu buat peta minda (Peta i-Think) berdasarkan maklumat yang diberi.
Guru boleh meminta pelajar untuk membentangkan hasil peta minda kepada kelas.

9

Modul 2 – 03: Keperluan Peralatan & Perisian untuk Membangunkan
Aplikasi Telefon Pintar

1. KEPERLUAN PERKAKASAN
- LAPTOP / PC / CHROMEBOOK (pembangunan aplikasi ANDROID)
Spesifikasi Minimum:
Intel i3
4GB RAM
128 GB HARD DISK
Windows 10

- MACBOOK (pembangunan aplikasi IOS)
M1 Chip 8Core CPU – 7 Core GPU – 16 Core Neural Engine
8GB Memory
128 GB SSD
Mac OS Big Sur

2. KEPERLUAN PERISIAN

Anda boleh menggunakan beberapa perisian untuk membina aplikasi ANDROID dan IOS.
Untuk tujuan ini, anda perlu muat turun perisian dan pasang di Laptop atau Macbook.

PEMBANGUN APLIKASI ANDROID : Download Android Studio and SDK tools | Android
Developers

PEMBANGUN APLIKASI IOS: Xcode 13 Overview - Apple Developer

Cara paling mudah adalah para pelajar boleh memilih beberapa platform atas talian yang
percuma yang boleh digunakan untuk memulakan satu projek membina aplikasi telefon
pintar.
- MIT APP INVENTOR: MIT App Inventor | Explore MIT App Inventor
- THUNKABLE: Thunkable: Build powerful, native mobile apps without coding.
- FLUTTER: Flutter - Build apps for any screen
- APPSMILLION: http://www.appsmillion.com/#
- Dan banyak lagi

3. KEPERLUAN CAPAIAN INTERNET
Bagi membina aplikasi android secara platform atas talian seperti di atas, anda perlu
mempunyai capaian internet yang stabil. Capaian internet mobile secara hotspot boleh
digunakan cuma anda berdepan dengan risiko capaian yang tidak stabil. Sebaik-baiknya
adalah gunakan capaian internet FIBRE seperti UNIFI atau HOME FIBRE.

10

4. KEPERLUAN AKAUN GMAIL

Sebelum anda memulakan pembangunan aplikasi, sebaik-baiknya anda cipta satu akaun
@GMAIL yang ada nilai komersil. Ini kerana apabila anda hendak mencipta Google Developer
Account untuk dimuatnaik dalam Google Play Store / Apple App Store, ada paparan nama
pembangun aplikasi seperti ini:

GMAIL yang anda hendak gunakan untuk tujuan
komersil perlu mempunyai nilai-nilai komersil.
Jangan gunakan email yang mengarut seperti
[email protected] / [email protected]

Gunakan nama komersil seperti
/
[email protected] /

[email protected]

[email protected]

11

5. KEPERLUAN TEST DEVICE
Untuk anda membina aplikasi telefon pintar, anda memerlukan satu telefon pintar untuk
membuat uji-lari (TEST-RUN). Fokus modul ini adalah menggunakan MIT APP INVENTOR.
Pengujian aplikasi boleh dibuat sebelum anda memuat turun file APK untuk dimasukkan ke
dalam Google Play Store.
PILIHAN 1 (UTAMA) – MIT AI2 COMPANION

CARA TERBAIK MENGGUNAKAN MIT AI2 COMPANION: Anda perlu menghubungkan
computer dan telefon pintar dengan sambungan WIFI YANG SAMA untuk membuat TEST-
RUN.
JIKA TIADA WIFI, boleh digunakan juga asalkan mempunyai talian internet yang stabil di
PC/LAPTOP dan TELEFON PINTAR masing-masing.
Tonton Video Ini untuk dapatkan gambaran: MIT App Inventor - AI2 Companion for Android -
YouTube
PILIHAN 2 (SEKIRANYA TIADA TELEFON PINTAR)
Anda boleh muat turun MIT EMULATOR daripada laman web: Installing and Running the
Emulator in AI2 (mit.edu)
Cara untuk memasang (install) MIT EMULATOR boleh dirujuk daripada laman web: Installing
App Inventor 2 Setup on Windows (mit.edu)

12

Aktiviti 3 (20 minit)
1. Pelajar mencipta akaun gmail / menggunakan akaun gmail sedia ada di laman web

www.gmail.com
2. Pelajar log masuk ke laman web MIT App Inventor | Explore MIT App Inventor dan

mendaftar untuk mencipta akaun.
3. Pelajar memasang MIT AI2 COMPANION di telefon pintar masing-masing.

AKTIVITI PDPR 5.0

** Pelajar boleh melaksanakan aktiviti 3 di atas secara dalam talian sekiranya berada di rumah.

13

[Document title]

[Document subtitle]

Abstract

[Draw your reader in with an engaging abstract. It is typically a short summary of the
document.

When you’re ready to add your content, just click here and start typing.]

PENULIS:
ABDULLAH SHUHAIMI BIN ROZLAN ARIFFIN

MUHAMMAD HAZRAT BIN ISMAIL
JOHAN JOHARI BIN MOHD TUKIRAN

MUHAMMAD AKRAM BuIsNeArHMAD

SHU[HEmAaIDil AadBdrIeNsTs]I FUAD
AZIYANI BINTI AZIZAN

KANDUNGAN MODUL 3

Modul 3 – 01: Merekabentuk Pembangunan Aplikasi............................................................................ 2
Modul 3 – 02: Memahami Proses dalam Sesebuah Aplikasi .................................................................. 7

1

Modul 3 – 01: Merekabentuk Pembangunan Aplikasi

Aktiviti 1: (30 minit)
Pelajar ditempatkan ke secara berpasangan (Think-Pair-Share) dan pelajar mempelajari 3 Elemen
Merekabentuk Pembangunan Aplikasi seperti dalam gambarajah, dan kemudian menerangkan
kepada rakan tentang apa yang mereka fahami.
Gunakan Rajah 1 ini untuk buat nota:

AKTIVITI PDPR 6.0

1. Pelajar akan masuk ke dalam MICROSOFT TEAMS BREAKOUT ROOMS.
2. Pelajar perlu membaca modul dan mengisi Rajah 1 seperti yang diberi.
3. Guru boleh meminta pelajar untuk menghantar tugasan Rajah 1. Boleh gunakan Microsoft

Word / Powerpoint Online

ELEMEN-ELEMEN DALAM
MEREKABENTUK PEMBANGUNAN APLIKASI

1. 2. 3.

•••
•••
•••
•••

2

1. ANTARAMUKA / INTERFACE APLIKASI

SCREEN 4

SCREEN 2

SCREEN 1

SCREEN 3

Antaramuka / Interface adalah apa yang pengguna lihat semasa menggunakan aplikasi kita.
Sebelum memulakan merekabentuk antaramuka aplikasi, anda harus
- Memahami proses keseluruhan dan fungsi aplikasi yang ingin dibangunkan
- Memilih Konsep Warna Text / Button / Icon
- Memilih Konsep Ikon dan Gambar Latar Belakang
- Merekabentuk Ikon Aplikasi

**Kita akan mempelajari mencipta antaramuka yang pertama menggunakan Google Forms dalam
bahagian Modul berikutnya.

3

2. PROSES DALAM APLIKASI

- Tonton Video Ini untuk memahami konsep PROSES DALAM APLIKASI. How to Order in
FOODPANDA PH | Step by Step for Beginners - YouTube

- Proses dalam pembangunan aplikasi adalah mengenalpasti semua perkara yang akan
berlaku dalam aplikasi.

- Proses ini melibatkan membuat STORY BOARD tentang proses dalam aplikasi yang akan
dilalui oleh pengguna. Anda boleh merancang story board dengan www.canva.com dan
cari jenis design MOBILE MOCKUP.

- Antara prroses dalam aplikasi:
SCREEN NAVIGATION
POPUP NOTIFICATION
VALIDATE DATA SCREEN
SAVE INTO DATABASE
ANALYSIS SCREEN

- Proses dalam system yang turut memerlukan anda berfikir untuk menghasilkan screen
storyboard adalah untuk proses:
ADD
VIEW
EDIT
SAVE dan
DELETE
** Semua tentang Proses kita akan pelajari dalam MIT APP INVENTOR dalam modul
seterusnya.

4

3. DATABASE UNTUK APLIKASI
- Database / Pangkalan Data adalah suatu tempat dimana kita akan menyimpan semua data
yang berkaitan dengan Aplikasi.
- Contoh data berkenaan Aplikasi DATAPELAJAR

- Data yang disimpan dalam database boleh digunakan untuk menjadi maklumat yang
bermakna (proses analisis data).

- Database yang dibina seharusnya tidak mempunyai data bertindan (redundant) dan
dihubungkan dengan satu jenis data sahaja iaitu Primary Key. Primary Key kebiasaanya
adalah satu data yang mewakili data yang terdapat dalam database yang lain. Contoh
Primary Key di dalam contoh ini adalah NO_MAKTAB.

- Contoh Pangkalan data MAKLUMAT KO-KURIKULUM PELAJAR

Jika anda lihat dalam dua database ini, NO_MAKTAB adalah Primary Key yang
menghubungkan antara dua database.

5

- CONTOH DATA YANG BERTINDAN (REDUNDANT)
Ini adalah data dalam DATA PELAJAR

Ini adalah data dalam DATA KOKURIKULUM PELAJAR

Maklumat NAMA pelajar didapati bertindan dan sepatunya hanya dihubungkan
dengan 1 PRIMARY KEY sahaja.
- Contoh data ini kita akan laksanakan dalam Google Sheet dan di masukkan dalam MIT APP
INVENTOR dalam modul yang seterusnya.

6

Modul 3 – 02: Memahami Proses dalam Sesebuah Aplikasi

Aktiviti 2: (30 minit)
Pelajar melakukan simulasi asas Proses dalam sesebuah aplikasi dan isikan Lembaran Modul 3
sepanjang simulasi ini. Guru akan memilih pelajar untuk membentangkan hasil dapatan mereka.

AKTIVITI PDPR 7.0

1. Pelajar akan diberi dengan Lembaran 1.
2. Pelajar perlu mengisi Google FORM https://forms.gle/xmRk2sCrhFiXbLUc6 seperti yang

diberi.
3. Guru boleh meminta pelajar untuk menghantar tugasan Lembaran 1. Boleh gunakan

Microsoft Word Online

1. MASUK DATA
Cuba anda masukkan data di Google Form ini https://forms.gle/xmRk2sCrhFiXbLUc6

KENALPASTI JENIS INPUT
- TEXT
- NUMBER
- RADIO BUTTON
- DROPDOWN
- BUTTON

7

2. PROSES DATA

PROSES DATA

- USER PERLU TEKAN BUTANG
“SUBMIT” UNTUK
MEMASUKKAN DATA KE DALAM
PENGKALAN DATA

- SETELAH DATA DISIMPAN,
SCREEN AKAN PINDAH KE
SCREEN BAHARU

3. SIMPAN DATA

SIMPAN DATA

- SKRIN MENUNJUKKAN PROSES
SIMPAN DATA TELAH BERJAYA

- NAMUN KITA TIDAK DAPAT
LIHAT DATA YANG TELAH
DIMASUKKAN DARIPADA
ANTARAMUKA PENGGUNA.

8

4. VIEW DATA

LIHAT DATA

- DATA YANG DIMASUKKAN KITA
PERLU BUKA PANGKALAN DATA
UNTUK MELIHAT DATA.

- KLIK LINK UNTUK LIHAT DATA
- LANGKAH INI AGAK

MERBAHAYA KERANA SESIAPA
SAHAJA BOLEH AKSES KE
DALAM PENGKALAH DATA

Selepas memasukkan data, anda ingin melihat semula data, klik:
https://docs.google.com/spreadsheets/d/13mN8_sqJvAf02UPlKsukk9FLWwubTDyBZB7-
B07NnrM/edit?usp=sharing

5. EDIT DATA

Dengan menggunakan link yang sama, anda juga boleh melaksanakan EDIT DATA. Cuma
anda perlu download Aplikasi GOOGLE SHEET di telefon pintar

9

6. DELETE DATA

Dapat disimpulkan bahawa:
1. MEMASUKKAN DATA dan PROSES SIMPAN DATA dapat dilaksanakan menggunakan

antaramuka
2. VIEW, EDIT dan DELETE terpaksa mengakses terus Pangkalan Data untuk melakukan

proses.
3. Adalah amat merbahaya sekiranya seseorang yang ingin VIEW, EDIT dan DELETE dapat

mengakses Pangkalan Data secara terus.
4. Kita perlu menyediakan Antaramuka Pengguna dan Menghadkan Akses untuk VIEW, EDIT

dan DELETE data.

10

LEMBARAN 1: SIMULASI PROSES APLIKASI

AKTIVITI 2

NAMA
KELAS

DATA 1. DATA YANG DIPERLUKAN
NO_MAKTAB JENIS INPUT
NAMA PENUH
NO_KP 2. SCREEN MASUKKAN DATA
KELAS APA PROSES YANG DILAKSANAKAN
HOMEROOM
JANTINA 3. SCREEN SIMPAN DATA
APA PROSES YANG DILAKSANAKAN
SCREEN INTERFACE
a. 4. VIEW DATA
APA PROSES YANG DILAKSANAKAN
SKREEN INTERFACE
a. 5. EDIT DATA
APA PROSES YANG DILAKSANAKAN
DATABASE TERLIBAT
a. 6. DELETE DATA
APA PROSES YANG DILAKSANAKAN
DATABASE TERLIBAT
a.

DATABASE TERLIBAT
a.

JENIS INPUT PROSES YANG DILAKSANAKAN PANGKALAN DATA

- TEXT - MEMASUKKAN DATA - MYSQL
- NUMBER - MEMBERI NOTIFIKASI DATA - MICROSOFT ACCESS
- RADIO BUTTON - GOOGLE SHEET
- DROPDOWN TELAH DISIMPAN
- BUTTON - MELIHAT DATA
- MENGUBAH DATA
- MEMBUANG DATA

11

[Document title]

[Document subtitle]

Abstract

[Draw your reader in with an engaging abstract. It is typically a short summary of the
document.

When you’re ready to add your content, just click here and start typing.]

PENULIS:

ABDULLAH SHUHAIMI BIN ROZLAN ARIFFIN

MUHAMMAD HAZRAT BIN ISMAIL

JOHAN JOHARI BAIKNRMAMOHBuDIsNeTAUrHKMIRAAND
MUHAMMAD
SHU[HEmAaIDil AadBdrIeNsTs]I FUAD

AZIYANI BINTI AZIZAN

KANDUNGAN MODUL 4

Modul 4 – 01: Membangunkan Antaramuka Pertama menggunakan Google Forms............................ 2
Modul 4 – 02: Melihat Data, Ubah Data dan Delete Data menggunakan Google Sheet........................ 8
Modul 4 – 03: Memaparkan Data dan Analisis Menggunakan Google Data Studio.............................10

1

Modul 4 – 01: Membangunkan Antaramuka Pertama menggunakan
Google Forms

Aktiviti 1 (20 minit)
Sila ikuti langkah demi langkah seperti di bawah untuk membangunkan Antaramuka Pertama Aplikasi
Anda.

1. Log Masuk akaun @gmail anda di www.gmail.com
Klik ICON “Elipsis” > Skrol ke bawah > Klik “Forms”

2. Klik Blank Form

2

3. Masukkan Title dan Description
Form Title = DATA PELAJAR MRSM
Form Description = Sila masukkan data Pelajar

4. Untuk Data Yang Pertama
Untitled Question = NO_MAKTAB

Question Type = SHORT ANSWER

3

Set As Required
5. Untuk Tambah Soalan Yang Baharu, Klik ADD QUESTION

MASUKKAN MAKLUMAT-MAKLUMAT BAHARU SEPERTI BERIKUT:

DATA JENIS INPUT

NAMA SHORT ANSWER

NO_KP SHORT ANSWER

KELAS DROPDOWN

HOMEROOM DROPDOWN

JANTINA MULTIPLE-CHOICE

NEGERI DROPDOWN

CONTOH DATA YANG SUDAH SIAP:

NAMA PENUH

4

NO_KP
JANTINA
KELAS
HOMEROOM

5

NEGERI

Setelah selesai, anda boleh PREVIEW dan CUBA MASUKKAN BEBERAPA DATA
6. Untuk PREVIEW dan cuba masukkan data, klik icon PREVIEW

CUBA MASUKKAN DATA DIRI ANDA SENDIRI
7. Untuk memasukkan Contoh Data daripada rakan-rakan yang lain, anda boleh klik SEND

Klik icon LINK > Klik Shorten URL > Klik Copy

6

Paste Link anda dalam chat whatsapp / telegram group
ATAU
Minta rakan-rakan isikan contoh data menggunakan telefon anda.

Dapatkan data sekurang-kurangnya 10 data rakan
sekelas anda secara rawak.

7

Modul 4 – 02: Melihat Data, Ubah Data dan Delete Data menggunakan
Google Sheet

Aktiviti 2 (10 minit)
Sila ikuti langkah demi langkah seperti di bawah untuk melihat data selepas data dimasukkan melalui
Google Forms dan melihat data menggunakan Google Sheet.

1. Setelah data dimasukkan, anda boleh lihat senarai data yang dimasukkan.
Klik Responses.

2. Klik “View Responses in Sheets”

Klik Create a new Spreadsheet > Klik CREATE

8

3. VIEW DATA.
Data yang dimasukkan akan kelihatan seperti ini. Proses ini melibatkan VIEW DATA.
Tetapi view ini melibatkan penglihatan data secara pangkalan data dan agak bahaya kerana
kita boleh secara tidak sengaja ter”EDIT” atau ter”DELETE” semua data.

4. EDIT DATA.
Untuk mengubah data, anda boleh double-click pada salah satu nama pelajar dan EDIT.

5. DELETE DATA.
Untuk membuang sesebuah data daripada Pangkalan Data
Klik Row dimana anda mahu DELETE data > Right Click Row > Delete Row

- Teknik VIEW, EDIT dan DELETE data melalui akses secara terus kepada pangkalan data
adalah amalan yang tidak baik.

- Kita perlu cipta Antaramuka untuk membolehkan kita VIEW EDIT dan DELETE data.
- Akses untuk EDIT dan DELETE data perlu di hadkan untuk pengguna tertentu sahaja

seperti System Administrator.
9

Modul 4 – 03: Memaparkan Data dan Analisis Menggunakan Google
Data Studio

Aktiviti 3 (30 minit)
Fungsi Google Data Studio adalah untuk memaparkan analisis dan memberi informasi bermakna
berdasarkan data di dalam Google Sheets. Kita akan menghasilkan satu pelaporan analisis data pelajar
menggunakan google data studio.

Sila ikuti langkah demi langkah seperti di bawah untuk memaparkan data analisis melalui Google Data
Studio

1. Masuk ke laman web Google Data Studio
Klik Blank Report

10

2. Masukkan Data seperti berikut
Country : MALAYSIA
Company: MRSM ANDA / NAMA ANDA
Klik Continue

Klik YES TO ALL > Klik Continue

11

3. Pilih CONNECTOR
- Connector adalah satu fungsi dimana anda akan menyambungkan pangkalan data anda
dengan pelaporan Google Data Studio.
Klik Google Sheets

4. Klik AUTHORIZE

5. Klik GOOGLE SHEET “Data Pelajar (responses) > KLIK ADD

12

6. Klik ADD TO REPORT

7. Paparan Seperti Ini Akan Muncul

- Secara Asas, GOOGLE DATA STUDIO (GDS) akan memaparkan maklumat dalam bentuk
jadual.

- Anda boleh mengubahsuai bentuk paparan dalam GDS seperti:
o Memasukkan Tajuk Laporan
o Memasukkan Page baru
o Memasukkan Data baru (boleh paparkan analisis daripada beberapa Google
Sheet)
o Memasukkan Carta
o Memasukkan Community Visualization
o Memasukkan Control
o Embed daripada sumber internet lain
o Memasukkan Gambar
o Memasukkan Teks
o Memasukkan Line
o Memasukkan Shape

13

8. Ubah Tajuk GDS anda
Untilted Report > DATA PELAJAR MRSM XXXXX (gantikan XXXXX dengan nama MRSM ANDA)

Contoh:

9. Tarik Jadual Ke Bawah
DRAG JADUAL

10. Klik TEXT
Draw TEXT BOX
Taipkan Tajuk GDS

14