Media Pembelajaran – Pengembangan Aplikasi Mobile

Pengembangan Aplikasi Mobile

Informatika Kelas XI • Kurikulum Merdeka

Semester 2 • TP 2025/2026

Pengembangan Aplikasi Mobile

Pelajari cara membuat aplikasi mobile menggunakan MIT App Inventor dan integrasikan dengan Kecerdasan Artifisial (AI) untuk menciptakan aplikasi yang cerdas dan interaktif! 🚀

App Inventor

+ AI Integration

⚡

🎯 Tujuan Pembelajaran

📊

Memahami Perbedaan Aplikasi

Menjelaskan perbedaan aplikasi web, desktop, dan mobile

👥

Kolaborasi Tim

Berkolaborasi untuk mengembangkan artefak komputasional

🔍

Identifikasi Masalah

Mengenali persoalan yang dapat diselesaikan dengan sistem komputasi

🧩

Abstraksi

Mengembangkan dan menggunakan abstraksi dalam pemrograman

📱

Mobile Apps + AI

Mengembangkan aplikasi mobile dengan library kecerdasan artifisial

✅

Pengujian & Dokumentasi

Mengembangkan rencana pengujian dan mendokumentasikan hasil

📚 Materi Pembelajaran

📱

10 JP

Pertemuan 1

Pengembangan Aplikasi Mobile dengan App Inventor

Pelajari dasar-dasar pembuatan aplikasi mobile menggunakan MIT App Inventor dengan pendekatan visual programming.

Visual Block UI Design Event Handler

🤖

10 JP

Pertemuan 2

Pengembangan Aplikasi Mobile untuk Kecerdasan Artifisial

Integrasikan kemampuan AI ke dalam aplikasi mobile: pengenalan gambar, suara, dan machine learning.

Image Recognition ML Kit Speech AI

👨‍🏫

Guru Pengampu

Guru Informatika

📅

Total Pertemuan

2 Pertemuan (20 JP)

🎓

Jenjang

SMA Kelas XI

📱

Pertemuan 1

Pengembangan Aplikasi Mobile dengan MIT App Inventor

Apa itu Aplikasi Mobile?

Aplikasi mobile adalah perangkat lunak yang dirancang khusus untuk berjalan pada perangkat mobile seperti smartphone dan tablet. Berbeda dengan aplikasi web yang berjalan di browser atau aplikasi desktop yang berjalan di komputer, aplikasi mobile dioptimalkan untuk layar sentuh dan portabilitas.

🌐

Web App

Berjalan di browser, tidak perlu install

💻

Desktop App

Install di PC/laptop, performa tinggi

📱

Mobile App

Install di smartphone, portabel

🛠️ MIT App Inventor – Platform Pengembangan

MIT App Inventor adalah platform visual programming berbasis web untuk membuat aplikasi Android. Dengan menggunakan blok-blok visual, kamu bisa membuat aplikasi tanpa harus menulis kode!

✅ Kelebihan

• Visual programming – mudah dipahami pemula
• Tidak perlu install software berat
• Gratis dan open source
• Testing langsung di smartphone
• Komunitas besar dan banyak tutorial
• Export ke APK untuk publishing

⚠️ Keterbatasan

• Hanya untuk Android (tidak iOS)
• Performa terbatas untuk game berat
• Desain UI kurang fleksibel
• Tidak bisa publish langsung ke Play Store
• Memerlukan koneksi internet
• Limit project untuk free account

🔗 Link Penting

🌐 https://appinventor.mit.edu/

🎨 Antarmuka MIT App Inventor – Visual Guide

📐 Tampilan Lengkap MIT App Inventor

PALETTE

🎨 User Interface

📐 Layout

🎬 Media

📡 Sensors

👥 Social

💾 Storage

🔗 Connectivity

🔌 Extension

VIEWER

📱

Screen1

Label1: Hello World

Button1: Click Me

TextBox1: [Input]

COMPONENTS

📱 Screen1

📦 VerticalArrangement1

📝 Label1

🔘 Button1

📄 TextBox1

PROPERTIES

Component

Label1

Text

Hello World

TextSize

TextColor

#FFFFFF

BackgroundColor

#1F2937

💡 Klik pada kategori komponen di Palette untuk melihat highlight dan detailnya!

🎨 1. USER INTERFACE

Menu untuk menambahkan komponen yang berinteraksi langsung dengan user (UI elements)

Button

Tombol interaktif untuk trigger event

📱 Login, Submit, Navigation

Label

Menampilkan teks statis atau dinamis

📱 Judul, deskripsi, output

TextBox

Input teks dari user (editable)

📱 Form, search, chat input

Image

Menampilkan gambar/foto

📱 Logo, foto profil, banner

Checkbox

Pilihan yes/no (boolean)

📱 Terms, preferences, settings

RadioButton

Pilihan mutually exclusive

📱 Gender, category, rating

Slider

Input numerik dengan slider

📱 Volume, brightness, progress

ListPicker

Dropdown/list untuk memilih opsi

📱 Country, city, category

PasswordTextBox

TextBox untuk password (tersembunyi)

📱 Login form, security

📐 2. LAYOUT

Menu untuk mengatur penempatan (arrangement) dan tata letak komponen-komponen UI

VerticalArrangement

Susun komponen vertikal (atas ke bawah)

📱 Forms, menus, lists

HorizontalArrangement

Susun komponen horizontal (kiri ke kanan)

📱 Toolbars, button groups

TableArrangement

Susun komponen dalam tabel (grid)

📱 Calendar, calculator, grid

ScrollArrangement

Container yang bisa di-scroll

📱 Long lists, feeds, chat

Spinner

Loading indicator animasi

📱 Loading states, progress

🎬 3. MEDIA

Menu untuk menangani audio, video, gambar, dan teks-to-speech

Sound

Memutar file audio (.mp3, .wav)

📱 Music, SFX, notifications

VideoPlayer

Memutar video di aplikasi

📱 Tutorial, media player

TextToSpeech

Mengubah teks menjadi suara

📱 Accessibility, narration

Camcorder

Merekam video dari kamera

📱 Video recording, stories

Player

Kontrol pemutaran media

📱 Play, pause, seek controls

📡 4. SENSORS

Menu untuk akses hardware sensor di smartphone (GPS, accelerometer, kamera, dll)

Camera

Ambil foto dari kamera ponsel

📱 QR scanner, photo app

LocationSensor

Dapatkan GPS koordinat lokasi

📱 Maps, navigation, check-in

AccelerometerSensor

Deteksi gerakan/kemiringan

📱 Games, fitness, motion

OrientationSensor

Deteksi orientasi (pitch, roll, yaw)

📱 Compass, AR, rotation

ProximitySensor

Deteksi jarak objek

📱 Call handling, gestures

LightSensor

Deteksi intensitas cahaya

📱 Auto brightness, display

👥 5. SOCIAL

Menu untuk sharing, email, SMS, dan komunikasi sosial lainnya

EmailPicker

Buka email client untuk kirim email

📱 Contact form, feedback

PhoneCall

Buat panggilan telepon otomatis

📱 Emergency, click-to-call

Texting

Kirim SMS otomatis

📱 OTP, notifications

Sharing

Share ke media sosial/apps

📱 Social sharing, viral

ContactPicker

Pilih kontak dari phonebook

📱 Invite friends, sharing

💾 6. STORAGE

Menu untuk menyimpan data (database, file, SharedPreferences)

TinyDB

Database lokal key-value sederhana

📱 Settings, preferences

File

Baca/tulis file di storage

📱 Documents, logs, cache

Web

Akses web API, cloud database

📱 Firebase, REST API

CloudDB

Database real-time cloud-based

📱 Chat, collaboration

FusiontablesControl

Akses Google Fusion Tables

📱 Data visualization

🔗 7. CONNECTIVITY

Menu untuk koneksi Bluetooth, WiFi, dan komunikasi antar perangkat

BluetoothClient

Koneksi Bluetooth client

📱 IoT devices, accessories

BluetoothServer

Koneksi Bluetooth server

📱 Multi-device control

ActivityStarter

Start app lain dengan intent

📱 App integration

Web

HTTP requests ke web service

📱 API calls, data sync

Nfc

Near Field Communication

📱 Contactless payments

🔌 8. EXTENSION

Menu untuk custom components yang diunduh atau dibuat sendiri

FirebaseDB

Firebase real-time database

📱 Chat, live data sync

QRCode

Generate dan scan QR code

📱 Payment, tickets

Barcode

Scan barcode produk

📱 Inventory, shopping

SpeechRecognizer

Speech-to-text conversion

📱 Voice commands, dictation

Map

Interactive maps display

📱 Location services

💡 Cara Install Extension:

1. Download file .extension dari sumber terpercaya
2. Di App Inventor: Project → Import Extension
3. Pilih file .extension yang sudah diunduh
4. Extension akan muncul di Palette

⚙️ Setup MIT App Inventor – Step by Step

STEP 1

Persiapan Browser dan Akun

✓ Requirement:

• Browser modern (Chrome, Firefox, Edge, Safari)
• Koneksi internet yang stabil
• Akun Google (jika belum punya, buat di accounts.google.com)
• Smartphone dengan Android 4.1+ (untuk testing)

⚠️ Tips: Gunakan browser Chrome untuk kompatibilitas terbaik!

STEP 2

Akses MIT App Inventor

Buka browser dan kunjungi: appinventor.mit.edu
Klik tombol “Create” atau “Sign in” di pojok kanan atas
Pilih akun Google kamu dari daftar yang muncul
Tunggu hingga dashboard MIT App Inventor terbuka
Jika diminta, izinkan akses ke data Google kamu

🖥️ Screenshot: Tampilan awal MIT App Inventor

STEP 3

Buat Project Baru

Di dashboard, klik tombol “Create new project”
Masukkan nama project (contoh: HelloWorld)
Hindari nama dengan spasi atau karakter khusus
Klik “Create”
Tunggu hingga editor App Inventor terbuka (biasanya 10-30 detik)

Tip Nama Project: Gunakan format CamelCase (HelloWorld, KalkulatorSederhana, AplikasiTodo)

👋 Project 1: Aplikasi Hello World – Panduan Lengkap

📋 Tujuan Project

Membuat aplikasi sederhana yang menampilkan “Hello World!” ketika tombol diklik. Project ini akan mengajarkan fundamental: membuat UI, handle event, dan display output.

PHASE 1

Designer View – Buat UI

Komponen	Nama ID	Properti
Label	`Label1`	Text: “Klik Tombol Dibawah!” TextSize: 24 TextColor: Blue (#4169E1)
Button	`Button1`	Text: “Klik Saya” BackgroundColor: Green Width: 200 px
Label	`Label2`	Text: “” (kosong dulu) TextSize: 20 TextColor: Red (#FF0000)

📝 Langkah-langkah Membuat UI:

Di Palette, cari section “User Interface”
Drag komponen Label ke Viewer (area preview)
Di panel Components, ubah nama menjadi “Label1”
Di panel Properties, atur:
- → Text: “Klik Tombol Dibawah!”
- → TextSize: 24
- → TextColor: pilih warna biru
Dari Palette, drag komponen Button ke Viewer
Atur nama menjadi “Button1” dan set properties (Text: “Klik Saya”, warna hijau)
Drag satu Label lagi, nama “Label2”, kosongkan text, warna merah
Arrange komponen sehingga terlihat rapi (gunakan VerticalArrangement dari Palette)

PHASE 2

Blocks Editor – Program Logika

Sekarang kita akan membuat logika: ketika button diklik, tampilkan “Hello World!” di Label2

🧩 Blok-blok yang Dibutuhkan:

STEP 1

Cari Event Block: Di Blocks, buka section “Button1”

Drag blok “when Button1.Click do”
STEP 2

Cari Set Block: Buka section “Label2”

Drag blok “set Label2.Text to” ke dalam “when Button1.Click do”
STEP 3

Buat Text Block: Buka section “Text”

Drag blok yang berisi “” (text string kosong)

Ketik “Hello World!” di dalamnya

Hubungkan ke blok “set Label2.Text to”

✨ Hasil Akhir Block Code:

when Button1.Click

do set Label2.Text to

“Hello World!”

PHASE 3

Testing & Debugging

🔄 Cara Testing:

Klik menu “Connect” di App Inventor
Pilih “AI Companion”
Scan barcode dengan aplikasi AI Companion di smartphone
Aplikasi akan muncul di smartphone kamu
Klik tombol “Klik Saya” di smartphone
Pastikan text “Hello World!” muncul di bawah tombol

⚠️ Troubleshooting Umum:

▸ Tombol tidak berfungsi?
Pastikan blok “when Button1.Click” terhubung dengan “set Label2.Text to”
▸ Text tidak muncul?
Cek apakah ID komponen di blocks sesuai dengan designer (Label2, bukan Label)
▸ Aplikasi force close?
Reload dari AI Companion atau restart aplikasi di smartphone

🧮 Project 2: Aplikasi Kalkulator – Panduan Lengkap

📋 Tujuan Project

Membuat kalkulator yang bisa melakukan operasi penjumlahan (+), pengurangan (-), perkalian (×), dan pembagian (÷). Project ini mengajarkan variable handling, conditional logic, dan mathematical operations.

STEP 1

Designer View – Desain UI Kalkulator

Tabel komponen yang dibutuhkan:

No	Komponen	Nama ID	Properti Penting
1	Label	`LabelJudul`	Text: “KALKULATOR”, TextSize: 28
2	TextBox	`Angka1`	Hint: “Masukkan angka 1”, Type: Number
3	TextBox	`Angka2`	Hint: “Masukkan angka 2”, Type: Number
4	Button	`BtnTambah`	Text: “+”, BackgroundColor: Green, Width: 100
5	Button	`BtnKurang`	Text: “-“, BackgroundColor: Yellow, Width: 100
6	Button	`BtnKali`	Text: “×”, BackgroundColor: Blue, Width: 100
7	Button	`BtnBagi`	Text: “÷”, BackgroundColor: Purple, Width: 100
8	Button	`BtnClear`	Text: “CLEAR”, BackgroundColor: Red, Width: 150
9	Label	`HasilLabel`	Text: “Hasil: 0”, TextSize: 24, TextColor: Red

📐 Layout Arrangement:

Gunakan VerticalArrangement untuk susun komponen dari atas ke bawah:

► LabelJudul (paling atas)
► Angka1 TextBox
► Angka2 TextBox
► HorizontalArrangement berisi: BtnTambah, BtnKurang, BtnKali, BtnBagi
► BtnClear (full width)
► HasilLabel (paling bawah)

STEP 2

Blocks Editor – Logika Perhitungan

Kita perlu buat fungsi untuk setiap operasi. Berikut pseudo-code:

🧩 Blok-blok yang Dibutuhkan:

Tombol Tambah (+):

when BtnTambah.Click
do
set HasilLabel.Text to
join(“Hasil: ” (Angka1.Text + Angka2.Text))

Tombol Kurang (-):

when BtnKurang.Click
do
set HasilLabel.Text to
join(“Hasil: ” (Angka1.Text – Angka2.Text))

Tombol Kali (×):

when BtnKali.Click
do
set HasilLabel.Text to
join(“Hasil: ” (* Angka1.Text Angka2.Text))

Tombol Bagi (÷):

when BtnBagi.Click
do
set HasilLabel.Text to
join(“Hasil: ” (/ Angka1.Text Angka2.Text))

Tombol Clear:

when BtnClear.Click
do
set Angka1.Text to “”
set Angka2.Text to “”
set HasilLabel.Text to “Hasil: 0”

✨ Tips Implementasi:

• Di App Inventor, operasi matematika menggunakan prefix notation: (+ 5 3) bukan 5 + 3
• Gunakan blok “number” untuk konversi TextBox ke angka
• Gunakan “join” atau “make text” untuk gabung teks dan hasil
• Untuk pembagian, tambahkan error handling untuk dibagi nol

🐛 Common Errors & Solutions

❌

Error: Component Names Mismatch

Blok tidak bisa menemukan komponennya

Penyebab:

• ID di Designer View berbeda dengan nama di Blocks
• Typo dalam penamaan komponen
• Komponen dihapus tapi blok masih ada

✓ Solusi:

• Pastikan nama di Components panel sama persis dengan di Blocks
• Gunakan Tools → Backpack untuk reorganize blocks
• Refresh browser dan connect ulang ke AI Companion

⚠️

Error: AI Companion Tidak Sync

Perubahan di App Inventor tidak muncul di smartphone

Penyebab:

• Koneksi WiFi terputus antara PC dan smartphone
• AI Companion di smartphone tidak responsive
• Barcode sudah expired (lebih dari 1 jam)

✓ Solusi:

• Pastikan PC dan smartphone terhubung WiFi yang sama
• Klik tombol “Reload” di AI Companion
• Disconnect dan reconnect dengan scan barcode baru
• Restart aplikasi AI Companion di smartphone
• Jika semua gagal, gunakan emulator sebagai alternatif

⚡

Error: App Force Close / Crash

Aplikasi tiba-tiba berhenti saat dijalankan

Penyebab:

• Blok logika error atau infinite loop
• Konversi tipe data gagal (string ke number)
• Memory terlalu besar untuk smartphone
• Bug di App Inventor atau AI Companion

✓ Solusi:

• Debug dengan menambah Label untuk print nilai variable
• Gunakan blok “try-catch” untuk handle error
• Kurangi jumlah komponen atau logika yang kompleks
• Update AI Companion ke versi terbaru
• Jika tetap error, export ke APK dan test di emulator

🔢

Error: Operasi Matematika Tidak Akurat

Hasil perhitungan aneh atau gabung string bukan tambah

Penyebab:

• TextBox input dibaca sebagai string, bukan number
• Operator operator salah (+ untuk concatenation, bukan sum)
• Lupa membungkus dengan blok “number” untuk konversi

✓ Solusi:

• Selalu gunakan blok “number” untuk konversi: number(TextBox.Text)
• Periksa operator yang digunakan: + (tambah), – (kurang), * (kali), / (bagi)
• Test dengan input angka sederhana terlebih dahulu
• Contoh yang BENAR: (+ (number Angka1.Text) (number Angka2.Text))

📝 Quiz Evaluasi Pertemuan 1

Uji pemahamanmu tentang MIT App Inventor dengan mengerjakan quiz berikut:

🎯

Quiz Pertemuan 1

5 soal pilihan ganda • 10 menit

✓ Materi App Inventor ✓ Komponen & Blocks

🤖

Pertemuan 2

Pengembangan Aplikasi Mobile untuk Kecerdasan Artifisial

Apa itu Kecerdasan Artifisial (AI)?

Kecerdasan Artifisial (Artificial Intelligence/AI) adalah kemampuan mesin atau komputer untuk meniru kecerdasan manusia dalam berpikir, belajar, dan menyelesaikan masalah. AI memungkinkan aplikasi mobile untuk melakukan tugas-tugas cerdas seperti mengenali wajah, memahami suara, dan membuat keputusan.

🧠 Jenis-Jenis Kecerdasan Artifisial

Machine Learning

Sistem yang belajar dari data tanpa diprogram secara eksplisit. Contoh: rekomendasi produk, prediksi cuaca.

Computer Vision

Kemampuan komputer untuk melihat dan memahami konten visual. Contoh: pengenalan wajah, deteksi objek.

Natural Language Processing

Memahami bahasa manusia. Contoh: chatbot, penerjemahan bahasa, analisis sentimen.

Speech Recognition

Mengubah suara menjadi teks. Contoh: asisten virtual, perintah suara.

📱 AI dalam Aplikasi Mobile

Teknologi AI dapat diintegrasikan ke dalam aplikasi mobile untuk memberikan pengalaman yang lebih cerdas dan personal. Berikut adalah beberapa cara implementasi AI di aplikasi mobile:

1. Image Recognition

Mengidentifikasi objek, wajah, atau teks dalam gambar.

Google Vision API Firebase ML Kit Core ML (iOS)

2. Speech Recognition

Mengubah suara menjadi teks atau sebaliknya.

Google Speech API Azure Speech IBM Watson

3. Chatbot

Sistem percakapan otomatis untuk layanan pelanggan.

Dialogflow Microsoft Bot Rasa

4. Recommendation Engine

Memberikan rekomendasi konten berdasarkan preferensi pengguna.

TensorFlow Amazon Personalize Azure ML

🎬 Demo Aplikasi AI

📷 Image Recognition Demo

Aplikasi yang mengenali objek dalam gambar menggunakan ML Kit.

Image Recognition

📷

Hasil Deteksi:

Dog: 95% Animal: 98% Pet: 87%

Komponen yang Digunakan:

• Camera untuk mengambil gambar
• Image untuk menampilkan gambar
• Firebase ML Kit untuk image recognition
• Labels untuk menampilkan hasil

💬 Chatbot Demo

Aplikasi chatbot yang menjawab pertanyaan pengguna.

AI Assistant

Online

Halo! Saya adalah asisten AI. Ada yang bisa saya bantu?

Apa itu AI?

AI (Kecerdasan Artifisial) adalah teknologi yang memungkinkan mesin belajar dan membuat keputusan seperti manusia.

Komponen yang Digunakan:

• Web component untuk API chatbot
• TextBox untuk input pesan
• Labels untuk menampilkan chat
• Clock untuk animasi typing

💻 Praktek: Membuat Aplikasi AI

📋 Tujuan Praktek

Membuat aplikasi mobile sederhana yang mengintegrasikan AI untuk mengenali teks dalam gambar (OCR) menggunakan ML Kit.

STEP 1

Setup Project

Buat project baru di MIT App Inventor dengan nama “OCR App”
Di Designer View, tambahkan komponen berikut:

Komponen	Nama ID	Properti
Button	`BtnCamera`	Text: “Ambil Gambar”
Image	`Image1`	–
Label	`LabelResult`	Text: “Hasil OCR akan muncul di sini”
Camera	`Camera1`	–

STEP 2

Implementasi Blocks

Buka Blocks Editor dan buat logika berikut:

when BtnCamera.Click
do
call Camera1.TakePicture

when Camera1.AfterPicture
do
set Image1.Picture to
image
call MLKit.TextRecognizer.Recognize
with Image1.Picture

when MLKit.TextRecognizer.GotResult
do
set LabelResult.Text to
resultText

STEP 3

Testing & Deploy

Test aplikasi dengan AI Companion
Ambil gambar yang mengandung teks
Periksa apakah teks berhasil dikenali
Jika berhasil, export ke APK

💡 Tips Tambahan:

• Pastikan cahaya cukup saat mengambil gambar
• Gunakan font yang jelas untuk hasil OCR terbaik
• Tambahkan fitur copy text untuk hasil OCR
• Implementasikan text-to-speech untuk membaca hasil

📝 Quiz Evaluasi Pertemuan 2

Uji pemahamanmu tentang AI dalam aplikasi mobile dengan mengerjakan quiz berikut:

🤖

Quiz Pertemuan 2

5 soal pilihan ganda • 10 menit

✓ Konsep AI ✓ AI di Mobile

🎮 Simulasi & Game

📱 MIT App Inventor Simulator

Coba langsung pengalaman membuat aplikasi dengan MIT App Inventor melalui simulasi interaktif berikut:

Hello World Simulator

Simulasi membuat aplikasi Hello World sederhana.

Hello World App

Klik Tombol Dibawah!

Komponen yang Digunakan:

• Label untuk menampilkan teks
• Button untuk interaksi
• Event handler untuk merespons klik

Kalkulator Simulator

Simulasi aplikasi kalkulator sederhana.

Kalkulator

Hasil: 0

Operasi Matematika:

• Penjumlahan (+)
• Pengurangan (-)
• Perkalian (×)
• Pembagian (÷)

🤖 AI Demo Simulator

Simulasi berbagai kemampuan AI yang dapat diintegrasikan ke dalam aplikasi mobile:

Image Recognition

Demo pengenalan objek dalam gambar.

Image Recognition

📷

Teknologi yang Digunakan:

• Computer Vision
• Deep Learning
• Convolutional Neural Networks

AI Chatbot

Demo chatbot yang merespons pertanyaan.

AI Assistant

Online

Halo! Saya adalah asisten AI. Ada yang bisa saya bantu?

Teknologi yang Digunakan:

• Natural Language Processing
• Machine Learning
• Pattern Recognition

🎮 Game Simulator

Mainkan game sederhana yang dibuat dengan konsep pemrograman visual:

Tic Tac Toe

Game klasik Tic Tac Toe melawan AI.

Tic Tac Toe

Giliran: X

Cara Bermain:

• Klik sel kosong untuk menempatkan X
• AI akan otomatis menempatkan O
• Susun 3 simbol secara horizontal, vertikal, atau diagonal untuk menang

Memory Game

Game memori untuk mencocokkan pasangan kartu.

Memory Game

Skor: 0

Cara Bermain:

• Klik kartu untuk membaliknya
• Cari pasangan kartu yang sama
• Selesaikan game dengan skor tertinggi

🎯 Interactive Learning

Pelajari konsep pemrograman melalui simulasi interaktif berikut:

Visual Programming

Coba susun blok kode untuk membuat program sederhana.

Visual Programming

Blocks:

Output:

Output akan muncul di sini…

Component Explorer

Eksplorasi komponen-komponen App Inventor secara interaktif.

User Interface

Button

Label

TextBox

Media

Image

Sound

VideoPlayer

Sensors

Camera

LocationSensor

AccelerometerSensor

📝 LKPD

Lembar Kerja Peserta Didik

Lengkapilah LKPD berikut untuk menguji pemahamanmu tentang Pengembangan Aplikasi Mobile:

Soal 1

Jelaskan perbedaan antara aplikasi web, desktop, dan mobile!

Soal 2

Apa keunggulan menggunakan MIT App Inventor untuk membuat aplikasi mobile?

Soal 3

Sebutkan 3 contoh implementasi AI dalam aplikasi mobile yang kamu ketahui!

Soal 4

Buatlah flowchart untuk aplikasi kalkulator sederhana dengan operasi penjumlahan dan pengurangan!

Area untuk menggambar flowchart

Soal 5

Jelaskan langkah-langkah untuk membuat aplikasi Hello World dengan MIT App Inventor!