Mata kuliah: Desain Web Dinamis Multimedia / 3 sks

POLITEKNIK NEGERI MEDIA KREATIF

JURUSAN : DESAIN GRAFIS
PROGRAM STUDI : MULTIMEDIA
RENCANA PEMBELAJARAN SEMESTER (RPS)
Nama Mata Kuliah Kode Mata Kuliah Bobot (sks) Semester Tanggal Penyusunan
Desain Web Dinamis Multimedia MMD 3302 3 SKS T = 1 SKS P = 2 SKS III (Tiga) 06 September 2021
OTORISASI Koordinator Bidang Keahlian
Nama Koordinator Pengembang RPS Ka PRODI
(Jika Ada)

(tanda tangan) (Tanda tangan) (Tanda tangan)

(Nama Terang) (Nama Terang) (Komda Saharja, S.Kom., M.Pd)

Capaian CPL-PRODI (Capaian Pembelajaran Lulusan Program Studi) Yang Dibebankan Pada Mata Kuliah
Pembelajaran (CP) 1 Memiliki pengetahuan dan keterampilan dalam pengelolaan sistem informasi dan komunikasi sesuai kebutuhan profesi dan
organisasi. (CPL PP1)
2 Mampu menerapkan pemikiran logis, kritis, sistematis, dan inovatif dalam konteks pengembangan atau implementasi ilmu
pengetahuan dan teknologi yang memperhatikan dan menerapkan nilai humaniora yang sesuai dengan bidang keahliannya. (CPL KU1)
CPMK (Capaian Pembelajaran Mata Kuliah)
1 Mahasiswa mampu memahami keilmuan website desain dan menerapkannya dalam pembuatan sebuah desain web.
2 Mahasiswa mampu memahami pembuatan desain website deduktif maupun induktif untuk mengembangkan ke pemahaman keilmuan yang
berkaitan dengan kebutuhan industri dan profesional.
3 Mahasiswa mampu dan trampil menyajikan rancangan grafis web : Grafis Sistem Tanda/ navigasi web, Grafis Identitas [Logo], dan Grafis
Perwajahan [Typography] secara artisitik komunikatif, dan membuat website news.
Diskripsi Singkat MK Mata Kuliah Desain Grafis Web memberikan :
1. Pemahaman seni desain web sebagai sarana komunikasi dan informasi digital (Mengerti konsep html, scripting, applet, dynamic html).
2. Ketrampilan teknis me-layout, sampai secara runtut dan benar melalui langkah-langkah idea layout, rough layout, sampai comprehensive
layout (Mengerti konsep content, dan arsitektur situs).
3. Memberikan kemampuan dan ketrampilan teknis penyelesaian akhir (finishing) suatu rancangan dengan komputer grafis untuk web dari
segi pewarnaan, penghurufan, dan penggambaran (Mengerti konsep dan penggunaan program manipulasi gambar dan foto secara digital).
Bahan Kajian / Pengantar Teknologi Internet dan Web, Persiapan Perancangan web, Estetika Desain, Page Design (Making a Good Layout), Web Graphics,
Materi Manipulasi Gambar, Penggunaan Huruf dan Warna yang Efektif, Gambar Interaktif pada Web, Konsep Dasar dan Elemen-elemen HTML dan CSS,
Pembelajaran Browser dan Publikasi Website, Operasional dan Perawatan Situs Web.
Daftar Referensi Utama:
(1) Andi. 2012. Membangun Web Interaktif Dengan Adobe Dreamweaver, PHP Dan MYSQL. Yogyakarta : Wahana Komputer.
(2) Bekti, Bintu Humairah. 2015. Mahir Membuat Website dengan AdobeDreamweaver CS6, CSS dan JQuery. Yogyakarta: Andi
(3) Hakim, Lukmanul dan Uus Musalini. 2004. Cara Cerdas Menguasai Layout, Desain dan Aplikasi Web. Jakarta: PT. Elex Media Komputindo.
(4) Jhonsen. 2004. Membangun Portal Intranet dengan Open Source Moregroupware. Jakarta: PT. Elex Media Komputindo.
(5) Madcoms. 2013. Mahir Dalam 7 Hari AdobeFlash CS6. Yogyakarta: CV Andi Offset.
(6) McCoy, John. 1997. Menguasai Desain Web. Jakarta: PT. Elex Media Komputindo.
(7) O'Leary, Timothy J. 1996. Computing Essentials. New York: McGraw-Hill College.
(8) Permana, Budi. 1999. Microsoft Frontpage 2000. Jakarta: PT. Elex Media Komputindo.
(9) Sidik, Betha, Pohan, dan Husni Iskandar. 2005. Pemrograman WEB dengan HTML. Bandung: Informatika.
(10) Suhartono. 2008. 6 Langkah Pake Joomla!: Bikin Website Keren. Yogyakarta: Multicom Media Utama.
(11) Supriyanto, Aji. 2005. Pengantar Teknologi Informasi. Jakarta: Salemba Infotek.
(12) Sutisna, Dadan. 2007. 7 langkah mudah menjadi Webmaster. Jakarta: Media Kita.
(13) Ta’eed, Collis. 2009. How to be Rockstar Wordpress Designer. Melbourne: Rockable Press.
(14) Tutang. 2001. Belajar Cepat HTML. Jakarta: Medikom Pustaka Mandiri.
(15) Untung, Ignatius. 2000. Photoshop 6.0/5.5. Jakarta: PT. Elek Media Komputindo.
(16) Way, Jeffrey Jordan. 2009. From Photoshop to HTML & CSS. Melbourne: Rockable Press.
(17) Winasis, Tri Aji. 2001. Trik Membangun Situs Web Gratis. Jakarta: PT. Elex Media Komputindo.
Pendukung:
(1)
Media Pembelajaran Perangkat lunak: Perangkat keras :
Microsoft PowerPoint, Adobe Photoshop, Framework, Sublime Text 3, Notepad,
Komputer (PC & Laptop), LCD Projector, Speaker
XAMPP, FileZilla-FTP, Chrome, Mozilla, Wordpress, Bootstrap
Nama Dosen
Sudirman, S.Kom., M.Kom
Pengampu
Mata Kuliah
Dasar Pemerograman Website
Prasyarat (Jika ada)
 Bantuk Pembelajaran,
Metode Pembelajaran,
Minggu Sub-CPMK Penilaian
Penugasan Mahasiswa, Materi Pembelajaran Bobot
Ke- (Kemampuan Akhir yang
[ Estimasi Waktu ] [ Pustaka ] Penilaian
diharapkan)
(%)
Indikator Kriteria & Teknik Luring (offline) Daring (online)

(1) (2) (3) (4) (5) (6) (7) (8)

1 Mahasiswa mampu Non-Tes, Partisipasi aktif Kuliah, Pengantar : 4%
menjabarkan pemahaman Mempu menjawab Mahasiswa dalam Small Group Teknologi Internet dan
mengenai desain Website. pertanyaan dengan diskusi dan sesi tanya Discussion Web. Pengertian tentang
benar jawab teknologi internet dan
aplikasinya serta prinsip
dasar situs web dan
perkembangan internet.
2 Mahasiswa dapat Non-Tes, Mahasiswa mulai Kuliah, Persiapan Perancangan 4%
menentukan tema dan Sitemap dibuat membuat sitemap Small Group web.
mengumpulkan bahan dengan rapi dan web masing-masing Discussion
perancangan situs web. tidak ada
kemiripan dengan
yang lain
3 Mahasiswa mampu Non-Tes, 1. Mahasiswa Praktikum dan Perancangan web: Estetika 10%
membuat peta situs, alur Presentasi yang membuat content Responsi, Desain. Penetapan strategi
kerja, dan perancangan baik dan informasinya per Project Based desain web dalam
tampilan dasar (layout) komunikatif file untuk sitemap Learning perencanaan situs :
situs web menggunakan yang sudah 1. Kenali Audience Anda,
web editor Adobe dibuat. Have a statement of
Dreamweaver . 2. Presentasi Desain purpose, Content up
Web dengan to date, Policy Jelas,
powerpoint. Dahulukan Kualitas,
Keep It Clean and
Simple, Interaktifitas.
2. Define Content
Outlining and
 Storyboarding.
3. Site map/site
structure/Site Elements.
4. Site covers, Navigasi,
template, tabel,
hyperlinks.
4 Mahasiswa mampu Non-Tes, Mahasiswa membuat Praktikum dan Perancangan web: Page 4%
membuat peta situs, alur Layout disajikan layout halaman per Responsi, Design (Making a Good
kerja, dan perancangan dengan rapi file sesuai content. Project Based Layout)
tampilan dasar (layout) Learning 1. Apa itu layout?
situs web menggunakan Bagaimana layout yang
web editor Adobe baik?
Dreamweaver . 2. Tiga Kriteria dasar untuk
layout yang baik: It
Works, It Organizes, It
Attracts Viewers.
3. The Element of Design:
Line, Shape, Texture,
Space, Size,
Value, Color.
4. The Principles of Design:
Balanced Pages and
Menu,
Consistency, Page
length, Editorial Style,
Tabel (nilai, pilihan
desain
tabel,penggunaan tabel
dalam forms), Rhythm,
Emphasis, Unity,
Page Headers dan
Footers, Template,
Behaviour, CSS, Form.
5 Mahasiswa mampu Tes, Mahasiswa belajar Praktikum dan Perancangan web: Web 4%
menguasai kemampuan Dapat memprakte- basic graphic dengan Responsi, Graphics
basic graphic dengan kan cara me- Photoshop: Project Based 1. Graphics Introduction
Photoshop nampilkan area 1. Mengenal Area Learning 2. Color Display Primer
kerja Photoshop Kerja (Menu bar, (Warna-warna Primer)
dengan benar Option bar, Tool- 3. Graphic File Format,
box, Layer, Palet, Interlaced GIFs,
Status bar) Transparent GIFs, JPEG
2. Mode dan Model Graphics
Warna (RGB, 4. Perimbangan Ukuran
CMYK, Bitmap Gambar, Resolusi
Mode, Grayscale Warna
Mode, Duotone 5. Colour Depth
Mode, Multichanel (Kedalaman Warna)
Mode) 6. Interlacing Images
3. Membuat doku- 7. Transparent Images
men baru (Name, 8. Imagemaps
Width, Height, 9. Preview Images
Resolusi, Mode, 10. Membuat background
Contents) gambar

6 Mahasiswa mampu Tes, 1. Mahasiswa belajar Praktikum dan Manipulasi Gambar 5%

membuat unsur gambar Hasil desain rapi memanipulasi Responsi, 1. Teknik Seleksi (menu
hasil pengolahan dan dan menarik gambar dengan Project Based seleksi, Marquee, Lasso,
pemotongan gambar dan Photoshop Learning Magic wand, menggeser
memasukkannya ke dalam 2. Mahasiswa seleksi)
rancangan situs web. mengerjakan 2. Teknik Layering (Palet
desain web Layer, Image layer,
dengan cepat Editing layer, Layer
memakai : Adobe mask)
Photoshop dan 3. Membuat Komposisi
Adobe Dream- Gambar (Copy dan
weaver. transformasi gambar,
Menyisipkan image,
Memperbesar bidang
gambar, hapus obyek di
dalam image, Filter)
7 Mahasiswa mampu Non-Tes, Mahasiswa belajar Praktikum, Perancangan web: 4%
membuat unsur font, teks, Text dan warna typhography dan Project Based Penggunaan Huruf dan
background, dan navigasi yang disajikan rapi kombinasi warna Learning Warna yang Efektif
dan memasukkannya ke dan sesuai dengan background, Teknik 1. Bekerja dengan jenis-
dalam rancangan situs tema yang dibuat Penulisan Teks (Type jenis huruf
web. Tools, Menulis Teks, (typhography)
Rasterize layer, Anti 2. Typefaces
aliasing, Edit teks, 3. Membuat content text
Manipulasi teks) yang efektif
dengan Photoshop 4. Warna dan kombinasi
(Colored Backgrounds)
5. Psikologis Warna dan
Orang
6. Bentuk dan Respon
Psikologis
UJIAN TENGAH SEMESTER 15%
9 Mahasiswa mampu Non-Tes, Mahasiswa belajar Praktikum, Perancangan web: Gambar 5%
membuat dan Hasil gambar bagus membuat gambar Project Based Interaktif pada Web
mengimplementasikan dan rapi interaktif dengan Learning 1. Toolbar flash
gambar Interaktif pada Adobe Flash dan 2. Drawing Tool
konsep kerja Adobe 3. Symbols, Instance dan
web
Flash Behaviour
4. Movie Clips, Frame, Key
Frame dan Tweening
5. Action Script, Button
6. Publish Flash ke HTML
10 Mahasiswa mampu Non-Tes, Mahasiswa belajar Praktikum, Perancangan web: Bekerja 4%
memahami, menjelaskan Kesesuaian Frames dengan Project Based dengan Frames
dan mengimplementasi - Content dan frame content yang sudah Learning 1. Mengapa menggunakan
kan elemen-elemen yang digunakan ada frames
Frames pada web 2. Pengenalan tipe-tipe
frame
3. Pemilihan frame untuk
sebuah web page

11 Mahasiswa mampu Tes, Mahasiswa Praktikum, Definisi dan pengertian: 4%

Menjelaskan penggunaan Mahasiswa mampu mempraktekkan dan Project Based 1. HTML Tags untuk teks/
bahasa pemrograman mempraktekan implementasi Learning huruf (paragraph, list,
web: HTML dan CSS dengan baik elemen-elemen hr, br)
(Cascading Style Sheet). HTML dan CSS 2. HTML Tags untuk warna
3. HTML Tags untuk
gambar (JPEG/ GIF/
PNG)
4. HTML Tags untuk
hyperlinks
5. HTML Tags untuk tabel
6. Dynamic HTML dan
HTML editor
7. Konsep dasar CSS dan
implementasi
elemen-elemen CSS.
12 1. Mahasiswa dapat Non-Tes, Mahasiswa Praktikum dan Logika : 10%
membuat contoh Hasil website merancang situs web Responsi, Perancangan Situs Web.
sederhana sesuai dengan perusahaan yang Project Based
menggunakan format kriteria yang minimal memuat Learning
teks dasar, URL, link, sarankan profil perusahaan:
image. koleksi, catalog,
2. Mahasiswa dapat layanan, gallery
membuat tabel, frame foto/video, berita
dan form. terkini, dan kontak
admin.
 13 Mahasiswa dapat Non-Tes, Mahasiswa Praktikum, Logika: 4%
melakukan uji coba Hasil pengujian mengetahui uji coba Project Based Uji Coba dan Evaluasi Situs
dan evaluasi situs web. terdokumentasi dan evaluasi situs Learning Web
web
14 Mahasiswa dapat Non-Tes, 1. Mahasiswa belajar Tutorial, Browser dan Publikasi 4%
mengunakan File Transfer Website dapat upload file agar Role-Play & Website
Protocol (FTP) dan web diakses secara bisa diakses oleh Simulation 1. Kompatibilitas Browser
server gratis untuk hosting public browser 2. Security, Web Browser
situs web di server 2. Mahasiswa dan Web Servers
internet. mempromosikan 3. Promosi Website
website-nya 4. Pengenalan Search
melalui Engine (Keywords, dan
search engine. Metaname)
5. Pendaftaran web page
6. Monitoring web page
visits
7. Bandwidth (Kecepatan)

15 Mahasiswa dapat Non-Tes, Mahasiswa dapat Tutorial, Logika : 4%

membuat sebuah desain Website Update mengetahui Role-Play & Operasional dan
web dari sebuah proses melakukan Simulation Perawatan Situs Web.
desain. operasional situs web
mencakup
pemutakhiran dan
komunikasi dengan
pengguna.

UJIAN AKHIR SEMESTER 15%

Catatan :
1. Capaian Pembelajaran Lulusan PRODI (CPL-PRODI) adalah kemampuan yang dimiliki oleh setiap lulusan PRODI yang merupakan internalisasi dari sikap, penguasaan
pengetahuan dan ketrampilan sesuai dengan jenjang prodinya yang diperoleh melalui proses pembelajaran.
2. CPL yang dibebankan pada mata kuliah adalah beberapa capaian pembelajaran lulusan program studi (CPL-PRODI) yang digunakan untuk pembentukan/pengembangan
sebuah mata kuliah yang terdiri dari aspek sikap, ketrampulan umum, ketrampilan khusus dan pengetahuan.
3. CP Mata kuliah (CPMK) adalah kemampuan yang dijabarkan secara spesifik dari CPL yang dibebankan pada mata kuliah, dan bersifat spesifik terhadap bahan kajian atau materi
pembelajaran mata kuliah tersebut.
4. Sub-CP Mata kuliah (Sub-CPMK) adalah kemampuan yang dijabarkan secara spesifik dari CPMK yang dapat diukur atau diamati dan merupakan kemampuan akhir yang
direncanakan pada tiap tahap pembelajaran, dan bersifat spesifik terhadap materi pembelajaran mata kuliah tersebut.
5. Indikator penilaian kemampuan dalam proses maupun hasil belajar mahasiswa adalah pernyataan spesifik dan terukur yang mengidentifikasi kemampuan atau kinerja hasil
belajar mahasiswa yang disertai bukti-bukti.
6. Kreteria Penilaian adalah patokan yang digunakan sebagai ukuran atau tolok ukur ketercapaian pembelajaran dalam penilaian berdasarkan indikator-indikator yang telah
ditetapkan. Kreteria penilaian merupakan pedoman bagi penilai agar penilaian konsisten dan tidak bias. Kreteria dapat berupa kuantitatif ataupun kualitatif.
7. Bentuk penilaian: tes dan non-tes.
8. Bentuk pembelajaran: Kuliah, Responsi, Tutorial, Seminar atau yang setara, Praktikum, Praktik Studio, Praktik Bengkel, Praktik Lapangan, Penelitian, Pengabdian Kepada
Masyarakat dan/atau bentuk pembelajaran lain yang setara.
9. Metode Pembelajaran: Small Group Discussion, Role-Play & Simulation, Discovery Learning, Self-Directed Learning, Cooperative Learning, Collaborative Learning, Contextual
Learning, Project Based Learning, dan metode lainnya yg setara.
10. Materi Pembelajaran adalah rincian atau uraian dari bahan kajian yg dapat disajikan dalam bentuk beberapa pokok dan sub-pokok bahasan.
11. Bobot penilaian adalah prosentasi penilaian terhadap setiap pencapaian sub-CPMK yang besarnya proposional dengan tingkat kesulitan pencapaian sub-CPMK tsb., dan
totalnya 100%.
12. TM=Tatap Muka, PT=Penugasan terstruktur, BM=Belajar mandiri.