FAKULTAS ILMU TERAPAN Telkom University PROGRAM STUDI D3 TEKNIK INFORMATIKA Jl. Telekomunikasi no 1 Gedung E dan F, Bandung SILABUS MATA KULIAH

(1)

FAKULTAS ILMU TERAPAN – Telkom University

PROGRAM STUDI D3 TEKNIK INFORMATIKA

Jl. Telekomunikasi no 1 Gedung E dan F, Bandung 40257

Dokumen Kontrol Kurikulum: 2012

Revisi Ke: Disahkan:

SILABUS MATA KULIAH

I. IDENTITAS MATA KULIAH

Nama Mata Kuliah : PERANCANGAN ANTARMUKA APLIKASI Kode Mata Kuliah : DIG2D2

SKS (Teori + Praktek) : 2 SKS (1 SKS Teori + 1 SKS Praktek) Jam (Teori + Praktek) : 3 Jam (1 Jam Teori + 2 Jam Praktek)

Jenis : MK Wajib / MK Peminatan / MK Praktikum *)

Jam pelaksanaan : Tatap muka di kelas = ……1………. jam per minggu Tutorial / responsi / Kerja Lab / praktek = ……2………. jam per minggu Semester / Tingkat : 3 /II

Materi Pre-requisite : Co-requisite :

II. DESKRIPSI SINGKAT MATA KULIAH

Mata kuliah ini mengajarkan mahasiswa tentang bagaiman merancang antarmuka aplikasi serta perannya dalam mewujudkan perangkat lunak yang tepat dan bermanfaat bagi usernya. Dalam mata kuliah ini juga disampaikan tentang tahap-tahap dalam proses desain UI serta tren-tren desain UI yang terkini.

III. KOMPETENSI LULUSAN YANG DIDUKUNG

[Kompetensi Utama]

1. Memiliki kemampuan merancang / mendesain komponen-komponen PL terutama antar muka

2. Memiliki pengetahuan dasar tentang perkembangan teknologi terkini (mobile, social network, creative content, web service, cloud computing)

3. Memiliki kemampuan dalam merancang instruksi (instructional design) 4. Memiliki kemampuan design grafis dalam merancang konten

[kompetensi pendukung] 1. Teamwork,

(2)

Tingkat Intermediate (Collaboration) --> Menjalin kerjasama melalui kontribusi optimal dalam tim maupun antar tim untuk mencapai tujuan bersama : Personal Resilience, Coordination, Building Team Commitment

2. Communication,

Tingkat Intermediate --> Memanfaatkan komunikasi untuk memecahkan masalah dalam kelompok

3. Leadership,

Tingkat Intermediate (Leading Others/Group Cohesion) --> Mengelola perbedaan dalam rangka mengarahkan tim untuk mencapai tujuan yang dapat memenuhi kebutuhan dan aspirasi anggota tim : Service Orientation, Manage Diversity, Influence others

IV. TUJUAN PEMBELAJARAN

Setelah mengikuti perkuliahan ini, mahasiswa diharapkan memiliki kemampuan untuk:

1. Memahami konsep dan penerapan berbagai macam prinsip desain antarmuka aplikasi baik yang berbasis web, desktop maupun mobile.

2. Mengembangkan suatu antarmuka aplikasi menggunakan metode serta proses desain antarmuka dengan memperhatikan kebutuhan suatu kasus tertentu

(3)

V. BAHAN KAJIAN, METODE PENYAMPAIAN & ASSESSMENT No Kompetensi

yang

diharapkan

Bahan Kajian Sub bahan kajian Metode

Pembelajaran

Indikator Pencapaian Cara assessment Durasi

1 Mahasiswa/i dapat

memahami pentingnya UI

Pengenalan IMK _- _{Definisi UI}

- Pentingnya desain UI yang baik

- Sejarah singkat IMK dan

perkembangannya di berbagai macam platform dan device

- Klasikal - Small Group Discussion - Mahasiswa mampu menjelaskan definisi UI - Mahasiswa mampu menyebutkan urgensi desain UI serta memaparkan contoh sederhana - Melakukan trivia quiz secara random di jeda kematerian 3x50 2 Mahasiswa/i dapat memahami pengguna dan kaitannya dengan desain UI Proses Desain UI Step 1: Memahami Pengguna/ Klien - Hambatan dan kegagalan dalam pengembangan PL - Usability - Karakteristik penting manusia dalam desain - Pertimbangan manusia dalam desain sistem bisnis - Performansi VS Preferensi - Metode untuk memahami - Problem Based Learning - Small Group Discussion - Simulation - Mahasiswa mampu mengenali profil user dengan memanfaatkan suatu metode terstruktur-sistematis - Mahasiswa mampu membuat profil pengguna - Presentasi singkat hasil simulasi studi kasus 3x50

(4)

No Kompetensi yang

diharapkan

Pembelajaran

pengguna 3 Mahasiswa/i dapat mengenal fungsi-fungsi bisnis dan kaitannya dengan desain UI Proses Desain UI Step 2: Memahami Fungsi Bisnis

- Definisi bisnis dan analisis kebutuhan - Menentukan

fungsi-fungsi bisnis dasar - Desain standar atau

panduan gaya (style

guide) - Kebutuhan pelatihan dan dokumentasi sistem - Problem Based Learning - Small Group Discussion -- Mahasiswa mampu memetakan fungsi bisnis dari suatu kasus - Mahasiswa mampu

membuat panduan umum UI terkait fungsi bisnis

- Mahasiswa mampu merancang scenario dan menu pelatihan serta dokumentasi sistem - Presentasi singkat hasil simulasi studi kasus 2x50 4 Mahasiswa/i dapat mengerti prinsip-prinsip desain UI yang baik Proses Desain UI Step 3: Memahami prinsip-prinsip desain UI dan layar yang baik

- Pertimbangan manusia dalam desain UI dan layar - Pertimbangan teknologi dalam desain UI - Contoh-contoh layar - Problem Based Learning - Small Group Discussion - Mahasiswa dapat menjelaskan beberapa prinsip desain UI yang baik - Mahasiswa mampu memberikan penilaian terhadap berbagai kasus tampilan - Trivia quiz 2x50 5 _Mahasiswa/i dapat mengerti komponen-komponen Proses Desain UI Step 4: Membangun menu sistem dan skema

- Struktur dan fungsi menu - Isi menu - Format menu - Problem Based Learning - Small Group Discussion - Mahasiswa mampu membuat struktur menu yang baik - Mahasiswa mampu

memberikan penilaian

- Presentasi studi kasus

(5)

No Kompetensi yang

diharapkan

Pembelajaran

dalam membangun menu sistem dan skema navigasi dalam desain UI

navigasi - Penyusunan frase

dalam menu - Penentuan pilihan-pilihan menu - Navigasi website - Jenis-jenis menu grafis terhadap berbagai kasus struktur menu

6 Mahasiswa/i dapat memilih tipe windows yang tepat dalam desain UI Proses Desain UI Step 5: Memilih tipe windows yang tepat - Karakteristik windows - Komponen-komponen sebuah windows - Gaya penampilan windows - Tipe-tipe windows - Pengaturan fungsi windows

- Web dan browser

- Problem Based Learning - Small Group

Discussion

- Mahasiswa mampu membuat tipe window yang baik sesuai studi kasus

- Mahasiswa mampu memberikan penilaian terhadap contoh tipe window Presentasi studi kasus 3x50 7 Mahasiswa/i dapat memilih perangkat interaksi yang tepat dalam desain UI Proses Desain UI Step 6: Memilih perangkat interaksi yang tepat - Perangkat input - Perangkat output - Problem Based Learning - Small Group Discussion - Mahasiswa mampu memetakan kelebihan-kekurangan dari pemilihan perangkat sesuai kebutuhan - Mahasiswa mampu memberikan alternatif Presentasi studi kasus 2x50

(6)

No Kompetensi yang

diharapkan

Pembelajaran

solusi beserta reasoningnya terkait pemilihan perangkat 8 Mahasiswa/i dapat memilih control layar yang tepat Proses Desain UI Step 7: Memilih screen-based controls yang tepat - Operable controls

- Text entry/ read-only controls - Selection controls - Other operable controls - Custom controls - Presentation controls - Memilih kontrol yang tepat - Problem Based Learning - Small Group Discussion - Mahasiswa mampu memberikan alternatif solusi beserta reasoningnya terkait pemilihan control layar

Presentasi studi kasus 3x50 9 Mahasiswa/i dapat menuliskan teks dan pesan dengan jelas dalam desain UI Proses Desain UI Step 8: Menuliskan teks dan pesan dengan jelas - Kata, kalimat, pesan, dan teks - Isi dan teks dalam

halaman web - Problem Based Learning - Small Group Discussion - Mahasiswa dapat memberikan alternatif solusi dalam penyajian teks - Mahasiswa dapat memberikan penilaian terhadap berbagai penyajian teks - Presentasi studi kasus - Survey acceptance dari mahasiswa 2x50 10 Mahasiswa/i dapat memberikan Proses Desain UI Step 9: Memberikan - Menyediakan feedback dengan tepat - Problem Based Learning - Small Group - Mahasiswa mampu memberikan feedback sesuai dengan prinsip

(7)

No Kompetensi yang

diharapkan

Pembelajaran

umpan balik, panduan, dan tuntunan yang efektif dalam desain UI feedback, guidance, dan assistance dengan efektif - Guidance dan assistance

Discussion desain UI yang baik

11 Mahasiswa/i dapat memahami internasionalis asi dan aksesibilitas dalam desain UI Proses Desain UI Step 10: Menerapkan internasionali sasi dan aksesibilitas - Pertimbangan internasional - Aksesibilitas - Problem Based Learning - Small Group Discussion - Mahasiswa mampu menunjukkan berbagai macam penerapan internasionalisasi dalam kasus-kasus yang disediakan - Mahasiswa mampu menghasilkan desain UI yang mempertimbangkan internasionalisasi dan aksesibilitas - Presentasi studi kasus 2x50 12 Mahasiswa/i dapat menggunakan grafik, ikon, gambar dan warna yang bermakna dalam desain UI Proses Desain UI Step 11&12: Menggunaka n graphics, icons, images & warna

- Icons & graphics - Multimedia - Penggunaan warna - Masalah yang mungkin muncul dengan warna - Warna dan penglihatan manusia - Problem Based Learning - Small Group Discussion - Mahasiswa mampu memberikan penilaian terhadap penggunaan grafik ikon, gambar dan warna dalam suatu kasus aplikasi - Mahasiswa

Presentasi studi kasus

(8)

No Kompetensi yang

diharapkan

Pembelajaran

- Pemilihan warna - Penggunaan warna

yang harus dihindari 13 Mahasiswa/i dapat memahami cara pengorganisasi an windows dan halaman dalam desain UI Proses Desain UI Step 13: Pengorganisa sian dan penyusunan layout windows dan halaman - Pengorganisasian dan penyusunan layout layar - Contoh layar - Problem Based Learning - Small Group Discussion - Mahasiswa mampu menyajikan berbagai alternatif pengorganisasian windows dan halaman dalam suatu studi kasus - Mahasiswa mampu

memberikan penilaian terkait

pengorganisasian windows dan halaman dari suatu aplikasi

Presentasi studi kasus 2x50 14 Mahasiswa/i dapat memahami konsep pengujian dalam desain UI Proses Desain UI Step 14: Uji, Uji,

dan Uji Ulang

- Usability - Prototipe - Tipe-tipe pengujian - Pelaksanaan pengujian - Analisis, modifikasi, dan pengujian ulang - Evaluasi sistem yang

berjalan - Problem Based Learning - Small Group Discussion - simulation - Mahasiswa mampu mendesain scenario pengujian UI aplikasi - Mahasiswa mampu melaksanakan pengujian UI aplikasi - Mahasiswa mampu

membuat laporan hasil pengujian UI

3x50

(9)

No Kompetensi yang

diharapkan

Pembelajaran

dapat memahami konsep desain UI berbasis web dan perangkat bergerak berbasis web dan perangkat bergerak bergerak - Pemilihan teknologi aplikasi

- Prinsip desain web dan mobile

- Pola desain UI web dan mobile Learning - Focus Group Discussion - Collaborative-Cooperative Learning mengimplementasikan proses desain UI untuk aplikasi web atau perangkat bergerak besar - Presentasi tugas besar - Cross evaluation antar kelompok 16 Mahasiswa/i dapat memahami tren desain antarmuka game Desain antarmuka game - Perencanaan aliran menu - Kebutuhan teknis dan trik - Penggunaan animasi - Pembuatan mockup yang interaktif - Project Based Learning - Focus Group Discussion - Collaborative-Cooperative Learning - Mahasiswa mampu mengimplementasikan proses desain UI untuk game - Proyek tugas besar - Presentasi tugas besar - Cross evaluation antar kelompok 3x50

(10)

VI. REFERENSI / SUMBER BAHAN UTAMA No Referensi / Sumber Bahan

1 Galitz, Wilbert O. 2007. The Essential Guide to UI Design. Third Edition.

2 Ballard, Barbara. 2007. Designing the Mobile User Experience. Little Springs Design, Inc., USA. 3 Fox, Brent. 2005. Game Interface Design. Thompson Course Technology

4. Kalbach, James. 2007. Designing Web Navigation. O'Reilly.

5 Coninx, Karin., et al. 2006. Task Models and Diagrams for UI Design. Springer 6. Cohen, Michael H., et al. 2004. Voice UI Design. Addison Wesley.

7. Welie, martijn van. 2001. Task-based UI Design. SIKS Disertation Series No. 2001-6.

VII. SKEMA PENILAIAN

KOMPONEN PENILAIAN BOBOT/ PROSENTASE KETERANGAN

UTS 30 % Ujian Tengah Semester

UAS 35% Ujian Akhir Semester

Softskill 10% Keaktifan Di kelas

Tugas, Quiz 25% Tugas besar, harian serta quiz

LEVEL PENILAIAN

LEVEL/INDEKS INDIKATOR KOMPETENSI KETERANGAN *)

A Lulus

B Lulus

C Lulus

D Lulus

E Tidak Lulus

VIII. ATURAN PELAKSANAAN & PENILAIAN

Aturan Perkuliahan:

1. Keterlambatan maksimal 20 menit dari waktu perkuliahan yang telah ditetapkan 2. Tidak ada toleransi terhadap keterlambatan pengumpulan tugas

3. Plagiarisme atau Mencontek = E Aturan Penilaian:

1. Penilaian dilakukan dengan mempertimbangkan 2 aspek penilaian , yang terdiri dari: a. Total nilai dari komponen UTS-UAS-Softskill-Tugas-Quiz

b. Total nilai kompetensi personal

2. Range nilai dari komponen UTS-UAS-Softskill-Tugas-Quiz adalah: A>=75,

65<=B<75, 55<=C<65, 40<=D<55,

E<40 3. Range nilai dari Kompetensi Personal

4 atau 5 = A 3 = B 2 = C

(11)

1 = D 0 = E

4. Tabel kriteria penilaian untuk kompetensi personal dapat dilihat pada tabel berikut

Kriteria Penilaian Nilai (Diisi 0 or 1)

Mampu menjelaskan prinsip desain

UI dengan tepat

1

Mampu memberikan contoh implementasi dari prinsip desain UI

dengan tepat

1

mampu memberikan penilaian terhadap desain UI berdasarkan

prinsip desain UI

1

mampu memberikan saran perbaikan terhadap desain UI

berdasarkan prinsip desain UI

1

Kualitas antarmuka dinilai 4 oleh

75% tester

1

Total

5

5. Masing masing nilai abjad yang diperoleh dari komponen UTS-UAS-Softskill-Tugas-Quiz maupun kompetensi personal akan dikuantifikasi dengan ketentuan sebagai berikut: A=4, B=3, C=2, D=1, E=0

6. Hasil Kuantifikasi abjad pada point 5 akan dirata-ratakan (dengan pembulatan keatas) yang kemudian akan menjadi nilai indeks akhir mahasiswa dengan ketentuan sebagai berikut: