BAHAN AJAR

KOMP. KEAHLIAN : MULTIMEDIA

KELAS : XII
SEMESTER : GANJIL
TAHUN PELAJARAN : 2022/2023

OLEH :
RYAN BETA ADHI PREMANA

PEMERINTAH PROVINSI JAWA TIMUR

DINAS PENDIDIKAN
SEKOLAH MENENGAH KEJURUAN NEGERI
KASIMAN
Jl. Wonosari, Sambeng – Kasiman 62164
Telp./Fax. (0353) 531023, E-mail : smkn1kasiman@yahoo.co.id
BOJONEGORO
3

BAHAN AJAR
RYAN BETA ADHI PREMANA ,S.Kom
 FLOWCHART

1. PENDAHULUAN
Flowchart adalah penggambaran secara grafik dari langkah-langkah dan urut-
urutan prosedur dari suatu program. Flowchart menolong analis dan
programmer untuk memecahkan masalah kedalam segmen-segmen yang
lebih kecil dan menolong dalam menganalisis alternatif-alternatif lain dalam
pengoperasian.

Flowchart biasanya mempermudah penyelesaian suatu masalah khususnya

masalah yang perlu dipelajari dan dievaluasi lebih lanjut.

2. PEDOMAN-PEDOMAN DALAM MEMBUAT FLOWCHART

Bila seorang analis dan programmer akan membuat flowchart, ada beberapa
petunjuk yang harus diperhatikan, seperti :

1. Flowchart digambarkan dari halaman atas ke bawah dan dari kiri ke

kanan.

2. Aktivitas yang digambarkan harus didefinisikan secara hati-hati dan definisi

ini harus dapat dimengerti oleh pembacanya.

3. Kapan aktivitas dimulai dan berakhir harus ditentukan secara jelas.

4. Setiap langkah dari aktivitas harus diuraikan dengan menggunakan

deskripsi kata kerja, misalkan MENGHITUNG PAJAK PENJUALAN.

5. Setiap langkah dari aktivitas harus berada pada urutan yang benar.

6. Lingkup dan range dari aktifitas yang sedang digambarkan harus ditelusuri
dengan hati-hati. Percabangan-percabangan yang memotongaktivitas yang
sedang digambarkan tidak perlu digambarkan pada flowchart yang sama.
Simbol konektor harus digunakan dan percabangannya diletakan pada
halaman yang terpisah atau hilangkan seluruhnya bila percabangannya
tidak berkaitan dengan sistem.

7. Gunakan simbol-simbol flowchart yang standar.

3. JENIS-JENIS FLOWCHART

Flowchart terbagi atas lima jenis, yaitu :

 Flowchart Sistem (System Flowchart)
 Flowchart Paperwork / Flowchart Dokumen (Document Flowchart)
 Flowchart Skematik (Schematic Flowchart)
 Flowchart Program (Program Flowchart)
 Flowchart Proses (Process Flowchart)

3.1. FLOWCHART SISTEM

Flowchart Sistem merupakan bagan yang menunjukkan alur kerja atau apa
yang sedang dikerjakan di dalam sistem secara keseluruhan dan
menjelaskan urutan dari prosedur-prosedur yang ada di dalam sistem.
Dengan kata lain, flowchart ini merupakan deskripsi secara grafik dari urutan
prosedur-prosedur yang terkombinasi yang membentuk suatusistem.

Flowchart Sistem terdiri dari data yang mengalir melalui sistem dan proses
yang mentransformasikan data itu. Data dan proses dalam flowchart sistem
dapat digambarkan secara online (dihubungkan langsung dengan komputer)
atau offline (tidak dihubungkan langsung dengan komputer, misalnya mesin
tik, cash register atau kalkulator).

Contoh sederhana untuk flowchart sistem dapat dilihat pada Gambar 1.

berikut ini :
 Pesanan
Pembelian
Pembelian

Masukan
Pesanan
Pembelian
Pembelian

Pembelian

Pesanan

Keluarkan

Gambar 1. Flowchart Sistem

3.2. FLOWCHART PAPERWORK / FLOWCHART DOKUMEN
Flowchart Paperwork menelusuri alur dari data yang ditulis melalui sistem.
Flowchart Paperwork sering disebut juga dengan Flowchart Dokumen.

Kegunaan utamanya adalah untuk menelusuri alur form dan laporan sistem
dari satu bagian ke bagian lain baik bagaimana alur form dan laporan
diproses, dicatat dan disimpan.

Gambar 2. menggambarkan suatu contoh flowchart ini mengenai alur

pembuatan kartu anggota untuk suatu perpustakaan.

FLOW DOKUMEN SISTEM BARU CALON ANGGOTA PERPUSTAKAAN

KEPALA PERPUSTAKAAN

Pengisian

Anggota Anggota

KETERANGAN :
# : Masukkan data calon anggota ke dalam komputer (proses pengisian data)
P : Tanda tangan dan validasi data

Gambar 2. Flowchart Paperwork

3.3. FLOWCHART SKEMATIK
Flowchart Skematik mirip dengan Flowchart Sistem yang menggambarkan
suatu sistem atau prosedur. Flowchart Skematik ini bukan hanya
menggunakan simbol-simbol flowchart standar, tetapi juga menggunakan
gambar-gambar komputer, peripheral, form-form atau peralatan lain yang
digunakan dalam sistem.

Flowchart Skematik digunakan sebagai alat komunikasi antara analis sistem

dengan seseorang yang tidak familiar dengan simbol-simbolflowchart yang
konvensional. Pemakaian gambar sebagai ganti dari simbol-simbol flowchart
akan menghemat waktu yang dibutuhkan oleh seseorang untuk mempelajari
simbol abstrak sebelum dapat mengerti flowchart.

Gambar-gambar ini mengurangi kemungkinan salah pengertian tentang

sistem, hal ini disebabkan oleh ketidak-mengertian tentang simbol-simbol
yang digunakan. Gambar-gambar juga memudahkan pengamat untuk
mengerti segala sesuatu yang dimaksudkan oleh analis, sehingga hasilnya
lebih menyenangkan dan tanpa ada salah pengertian.

3.4. FLOWCHART PROGRAM

Flowchart Program dihasilkan dari Flowchart Sistem.
Flowchart Program merupakan keterangan yang lebih rinci tentang
bagaimana setiap langkah program atau prosedur sesungguhnya
dilaksanakan. Flowchart ini menunjukkan setiap langkah program atau
prosedur dalam urutan yang tepat saat terjadi.

Programmer menggunakan flowchart program untuk menggambarkan urutan

instruksi dari program komputer.

Analis Sistem menggunakan flowchart program untuk menggambarkan

urutan tugas-tugas pekerjaan dalam suatu prosedur atau operasi.

Suatu contoh flowchart program dapat dilihat pada Gambar 3. berikut ini :
 Start

Catatan :
Bahwa flowchart program ini
adalah rincian dari sistem
Baca flowchart ( Gambar 1.) untuk
Data kotak yang bernama “Tentukan
Pesanan Jumlah Pesanan”
Pembelian

X=2xA xP

Y=RxC

Z= X/Y
Untuk Menentukan Jumlah
Pesanan :

Jumlah Pesanan =

2AP
Jumlah Pesanan =
RC
z Dimana :
A = Biaya setahun
P = Pemakaian setahun
R = Biaya sekali pesan
Cetak C = Biaya penyimpanan
Jumlah &
Item
Pesanan

T Y
EOF Stop

Gambar 3. Flowchart Program

3.5. FLOWCHART PROSES
Flowchart Proses merupakan teknik penggambaran rekayasa industrial
yang memecah dan menganalisis langkah-langkah selanjutnya dalam
suatu prosedur atau sistem.

Flowchart Proses memiliki lima simbol khusus (lihat Gambar 4)

= Operasi

= Perpindahan atau transportasi

= Inspeksi

= Penyimpanan atau File

Gambar 4. Simbol Flowchart Proses

Flowchart Proses digunakan oleh perekayasa industrial dalam mempelajari

dan mengembangkan proses-proses manufacturing. Dalam analisis sistem,
flowchart ini digunakan secara efektif untuk menelusurialur suatu laporan
atau form.

Pada Gambar 5. menggambarkan suatu contoh flowchart proses.

PROSEDUR PEMBELIAN | Analis : Tuti S. | Hal : 1 dari 3

RINCIAN METODE Perpin

Operasi dahan Inspeksi Penundaan File

Departemen Pembelian mengetik pesanan penjualan.

Pesanan ini merupakan form dengan 4 tembusan / copy.

Departemen Pembelian menyimpan copy ke-4 sebagai

referensi.

Pabrik menerima copy ke-1.

Departemen Penerimaan barang memperoleh copy ke-2.

Departemen Penerimaan barang menyimpan copy ke-2

sampai barang-barang diterima.

Departemen Kredit menerima copy ke-3.

Departemen Kredit menyimpan copy ke-3 sampai copy ke-2

dikirim oleh Departemen Penerimaan barang.

Departemen Kredit menerima copy ke-2 dari Departemen

Penerimaan barang.

Gambar 5. Flowchart Proses

4. SIMBOL-SIMBOL FLOWCHART
Simbol-simbol flowchart yang biasanya dipakai adalah simbol-simbol
flowchart standar yang dikeluarkan oleh ANSI dan ISO.

Simbol-simbol ini dapat dilihat pada Gambar 6. Simbol Flowchart

Standar berikut ini :
 SIMBOL ARTI CONTOH

Input / Output
Merepresentasikan Input data atau
Output data yang diproses atau Baca Jam
Informasi. & Tarif
Upah

Proses

Mempresentasikan operasi Hitung

Upah Kotor

Penghubung
Keluar ke atau masuk dari bagian lain 3 Keluar
flowchart khususnya halaman yang
sama
3 Masuk

Anak Panah
Merepresentasikan alur kerja Hitung
Upah Kotor

Penjelasan
Digunakan untuk komentar tambahan
Urutkan
Berdasarkan
Sebelum
No.
Pembayaran
Pelanggan

Gambar 6. Simbol Flowchart Standar

 SIMBOL ARTI CONTOH

Keputusan
Keputusan dalam program
Apakah
< >
A< B
=
>

Predefined
Process
Rincian operasi berada di tempat Hitung Akar
lain Pangkat Dua

Preparation
Pemberian harga awal
SW = 1

Terminal
Points Awal / akhir flowchart
Start

Punched card
Input / outuput yang menggunakan
Kartu Absen
kartu berlubang
 SIMBOL ARTI CONTOH

Dokumen
I/O dalam format yang dicetak

Cetak
Slip Upah

Magnetic Tape
I/O yang menggunakan pita
magnetik
File
Upah

Magnetic Disk
I/O yang menggunakan disk
magnetik

Update
File
Pegawai

Magnetic Drum
I/O yang menggunakan drum
magnetik
File
Pegawai

Gambar 6. Lanjutan
 SIMBOL ARTI CONTOH

On-line Storage
I/O yang menggunakan
penyimpanan akses
langsung File
Pelanggan

Punched Tape
I/O yang menggunakan pita
kertas berlubang
File Pelanggan

Manual Input
Input yang dimasukkan
secara manual darikeyboard
Masukkan
Tarif Upah

Display
Output yang ditampilkan
pada terminal
Pesan
Kesalahan

Manual Operation
Operasi Manual
Ketik
Pesanan
Penjualan

Gambar 6. Lanjutan
 SIMBOL ARTI CONTOH

Communication
Link Transmisi data melalui
channel komunikasi, seperti Terminal
telepon Komputer

Off-line Storage
Penyimpanan yang tidak
dapat diakses oleh
komputer secara langsung

Gambar 6. Lanjutan
Google Sites
Pemanfaatannya untuk Institusi Pendidikan
Revisi: 23 September, 2014

presented by

Google confidential | Do not distribute

 Overview
Memulai dengan Google Site
Google Site
Bagian dari Google Apps for Education, jadi pastikan:
● Mempunyai akun
● Login terlebih dahulu kepada akun tersebut
Google Site sebagai Wiki
● Semudah mengedit dokumen. Google Site adalah aplikasi online untuk
menjadikan pembuatan website kelas, sekolah atau suatu project menjadi
semudah mengedit dokumen.
● Gabungkan berbagai informasi. Pengguna dapat menggabungkan
berbagai informasi dalam satu tempat -- termasuk video, kelender,
presentasi, lampiran dan text.
● Bagikan sesuai kebutuhan. Dapat dibagikan untuk hanya dilihat atau diedit
kepada group kecil, kelas, satu sekolah atau secara publik. Anda yang
mengontrol akses tersebut.
● Tidak dibutuhkan pengetahuan pemrograman. Karena hanya
menggunakan drag dan klik.
Di Google Site bisa apa aja?
● Kostumasi site Anda
● Membuat sub-halaman untuk membuat konten tetap terorganisasi.
● Tambahkan menu navigasi
● Pilih tipe halaman: halaman web, pemberitahuan, file cabinets, list,
dashboard dan start pages
● Memiliki lokasi sentral untuk konten web dan file offline
● Jadikan site dapat diakses publik atau tetap private
● Lakukan pencarian konten pada Google Sites dengan teknologi Google
Search
Prinsip Pembuatan Web yang Baik
● Ketahui audien Anda. Target audien web yang akan dibuat mempengaruhi
bagaimana Anda membuat website. Apakah mereka pengguna yang ahli
atau bahkan pemula?
● Desain yang menunjang. Jangan menggunakan desain yang mengganggu
terhadap konten Anda.
● Konten yang simpel. Audien Anda harus dapat dengan mudah mengakses
konten website yang dibuat.
● Navigasi yang mudah. Jangan biarkan audien Anda terlalu banyak berfikir
mengenai navigasi.
● Animasi dapat sangat menggangu. Jika tidak terlalu dibutuhkan, jangan
gunakan gambar bergerak.
Bagaimana mengakses Google Site?
● Panel aplikasi. Di ujung kanan atas halaman Google
Apps, klik ikon kotak-kota, lalu pilih ikon Site.
● Ketikan alamat di browser. Atau bisa langsung ketikan
alamat site.google.com di address bar.
Halaman Awal Google Site
Menunjukan site yang
Anda buat dan Anda
diberikan akses.

Site yang dibuat di

Gmail Anda tidak akan
muncul di sini.
Telusuri Site
Dengan fitur ini, Anda dapat menelusuri semua site
yang dibuat di bawah domain institusi Anda. Dengan
catatan, site tersebut tidak private.

Penelusuran dapat berdasarkan kategori site.

Pencarian Site

Anda dapat mencari konten yang ada pada site yang Anda buat atau pada
semua site yang ada pada domain institusi Anda.
 Memulai
Membuat, memformat, dan mengkostumasi
Membuat Site

Untuk memulai, klik tombol Create,

tentukan nama site Anda, lalu tentukan
alamatnya (URL).

Alamatnya tidak bisa menggunakan yang

sudah pernah digunakan dan hanya boleh
karakter A-Z, a-z, 0-9.
Membuat Site lebih dari satu
Setiap akun dapat
membuat lebih dari
satu site.

Jumlah site yang

dapat dibuat tidak
terbatas. 100GB
untuk tiap domain.
Opsi Lanjutan
Digunakan untuk
menentukan kategori site
yang Anda buat,
menentukan deskripsi site
dan pengaturan membagi
site.
Memilih Tema
Secara default, Google Site
menyediakan berbagai tema yang bisa
digunakan.

Semua tema tersebut dapat disesuaikan

kembali melalui menu Manage Site.
Mengkostumasi Tema
Untuk melakukan kostumasi
tema, masuk ke menu
Manage Site, lalu klik tab
More, pilih Themes, Color
and Font
Menyembunyikan Judul Site

Untuk menghilangkan judul site, masuk ke menu Manage

Site, pilih tab General, lalu uncheck pilihan untuk
menampilkan judul site.
Merubah Layout Site

Lakukan pengaturan terhadap 5 elemen utama pada site

seperti header, navigasi, sidebar, area konten dan
custom footer.

Selain itu, untuk melakukan pengaturan lebar site dan

tinggi header.
Merubah header dan logo site
Setelah masuk ke bagian edit
layout, klik pada area header.
Maka akan muncul dialog
seperti di sebelah kanan.

Hanya bisa diupload dalam

format image (jpeg, gif, and
png)

Ukuran rekomendasi 145px

lebar x 52px tinggi
Modifikasi Layout Konten & Sidebar
Ketika sudah masuk edit site layout,
pengaturan sidebar dapat dilakukan.

Pengaturan meliputi ukuran sidebar

beserta elemen lain yang dapat
ditambahkan.
Mengelola Navigasi pada Sidebar
Navigasi pada sidebar bisa dibuat otomatis mengikuti hirarki
sitemap yang dibuat atau dibuat secara manual.
Menambahkan Submenu/Halaman pada Navigasi

Buat halaman baru, lalu perhatikan pilihan

untuk hirarki pembuatan halamannya.

Pengaturan ini akan mempengaruhi pada

navigasi otomatis.

Untuk submenu manual, bisa ditambahkan

langsung linknya di pengaturan navigasi.
Menambahkan Sub-page Listing
Anda juga dapat menambahkan daftar
sub-page dari suatu menu. Dengan
memilih menu Insert lalu pilih
Subpage listing.

Juga dapat ditentukan ukuran dari list

tersebut.
Lampiran & Komen untuk Site
Setiap halaman pada Site, dapat ditambahkan dengan
lampiran file & komen.

Maksimum upload untuk lampiran adalah 20MB.

Menghapus lampiran & komen
Lampiran yang sudah
diunggah dan komentar
pengguna yang masuk dapat
dihapus sesuai kebutuhan
Melihat Semua File Lampiran
Klik Manage Page, lalu pilih tab
attachments. Maka semua lampiran
dapat dilihat.
Duplikasi Site
Site yang sudah dibuat
dapat diduplikasi dan
dibuat untuk site yang
baru.

Masuk ke manage site,

lalu klik tombol copy.
Merubah alamat site

Alamat site dapat diubah

menggunakan subdomain
dari domain institusi.

Ini membutuhkan akses ke

admin domain, hubungi
bagian terkait.
Membagikan Site
Site dapat dibagikan
dengan berbagai
pengaturan. Bisa publik
atau hanya ke
beberapa orang.

Membagikan site
dengan berbagai akses
hanya melihat atau edit.
Menghapus Site

Site yang dibuat dapat dihapus dengan cara masuk

klik Manage Site, klik tombol Delete this Site.
Mengembalikan Site

Site yang sudah dihapus data dikembalikan dalam jangka 30 hari. Untuk
melihat halaman yang sudah dihapus, masuk ke halaman Manage Site, pilih
tab Deleted Item
Jenis Halaman
Berbagai jenis & layout halaman
Memilih Jenis Halaman
Pada saat memulai membuat halaman, pilih jenis halaman sesuai kebutuhan.
Atau mengubah jenis dengan mengakses menu Change page template
Halaman Web
Jenis halaman web adalah
yang paling umum pada Site,
yaitu halaman tidak memiliki
struktur baku.

Bisa ditambahkan text,

gambar dan video dengan
pemformatan umum seperti
bold, italic, underline, dll.
Halaman Awal
Hampir sama dengan jenis
halaman web, namun
dapat ditambahkan gadget
seperti menambah Google
Calendar dan Slider.
Halaman Pengumuman
Dapat digunakan untuk
kebutuhan pengumuman
maupun blog yang diupdate
secara berkala.

Dapat menggunakan RSS

Feed untuk setiap perubahan
yang terjadi.
File Cabinet
Halaman yang menampilkan berbagai file offline yang diupload. Dapat berupa
dokumen tugas atau slide dari dosen.
Halaman Daftar
Dapat digunakan untuk
menampilkan data yang
berbentuk tabulasi. Seperti
status projek atau daftar
nilai.
Kostumasi Template Halaman
Selain jenis halaman yang sudah
sudah disebutkan sebelumnya,
Anda juga bisa membuat template
halaman sendiri.

Dengan cara memilih menu “Save

as page template” pada tombol
more.
Deskripsi Template Halaman
Kemudian akan muncul
dialog untuk mengisi
informasi mengenai page
template yang akan Anda
buat.

Setelah itu klik tombol Save.

Lakukan menejemen template
halaman

Menejemen template
halaman yang dibuat
dapat dilihat pada menu
“Manage Site”, lalu pilih
tab Page templates.

Pada halaman tsb dapat

pilih pengaturan dan edit
template.
Memahami Hirarki Site
Site yang dibuat secara
prinsip berbentuk pohon.

Jika elemen atas

dipindahkan, makan
semua elemen
dibawahnya berpindah.
Memindahkan Halaman

URL halaman sebelumnya tetap berfungsi, tapi akan selalu

diarahkan ke alamat baru
Merubah URL Halaman

Jika ingin merubah URL halaman, dapat dilakukan

pada setting halaman.

URL sebelum tetap bisa digunakan, tapi selalu akan

diarahkan ke URL yang baru.
Jenis Layout Halaman
Anda dapat memilih layout halaman sesuai dengan
kebutuhan. Terdapat 9 pilihan dimulain dari yang
paling simpel hingga yang menyediakan banyak
pilihan layout.

Untuk mengganti layout, harus dalam keadaan

mengedit halaman.
Layout Satu Kolom
Layout Dua Kolom
Layout Tiga Kolom
Satu kolom + header footer
Dua kolom + header footer
Tiga kolom + header footer
Tiga kolom + header footer + left sidebar
Tiga kolom + header footer + right sidebar
Tiga kolom + header footer + both sidebar
Page-Level Permissions

Pemberian akses berbeda terhadap setiap halaman yang dibuat. Menjadikan

site sangat fleksibel dalam sistem sharing.
 Lanjutan
Menambahkan rich-media dan pemformatan
Terintegrasi dengan Google Site
Google Site merupakan
bagian dari Google Apps for
Education yang terintegrasi
dengan produk lainnya,
seperti Google Drive ,
Calendar dan Google+.
Pemformatan Standar
Seperti pemformatan dokumen lainnya,
konten pada Google Site dapat
menggunakan pemformatan jenis huruf,
ukuran, warna hingga aligment.
Menambahkan Link
Text pada site dapat
ditambahkan link. Baik link diluar
site, maupun bagian dari site.
Menambahkan Tabel
Penambahan tabel pada site dapat dilakukan
dengan mudah dengan memilih menu Tabel,
lalu pilih insert table.
Menambahkan Gambar
Pengaturan ukuran dan alignment gambar yang
ditambahkan dapat dengan mudah dilakukan dengan
melakukan klik pada gambar tersebut.
Menambahkan Daftar Isi
Membuat daftar isi konten
akan membantu saat
konten pada suatu
halaman, sangat banyak
dan diperlukan
pembagian.
Gadget Layanan Google
Gadget Layanan Google
Temukan Gadget Lainnya
Selain gadget yang sudah
tersedia pada menu insert,
Anda bisa menelusuri
gadget lain yang dibuat
oleh pihak ketiga.

Andapun bisa membuat

gadget sendiri.
Kostumasi Kotak Pencarian
Anda bisa mengatur mengenai kota pencarian yang
muncul pada halaman site. Apakah ditampilkan atau
memilih disemubunyikan.

Lalu pengaturan pencariannya apakah hanya pada

site tersebut saja atau pada semua site yang ada
pada domain tersebut.
Google App Script
Pada Google Site juga
dapat ditamabahkan
dengan gadget Google
Apps Script untuk
fungsional yang advance.
Terima kasih!