Final Project Desain Web Kelas SI-F dan SI-G Dr. Eng. Herman Tolle, ST., MT. Sistem Informasi - PTIIK Universitas Brawijaya Ganjil 2014/2015
Final Project Web Desain Sebagai pengganti Ujian Akhir mahasiswa diwajibkan mengerjakan Tugas Final Project membuat sebuah website lengkap. Tugas dikerjakan secara berkelompok dengan ketentuan sbb:
• • • •
Membuat Sebuah Website Lengkap Tipe: KONTEN atau FUNGSIONAL Tema KONTEN: Budaya | Teknologi Jenis FUNGSIONAL: Company Profile | Informasi Touchscreen | Info Grafik
TIPE KONTEN • Tema: Kebudayaan atau Teknologi Contoh Topik:
• Tari Topeng Malang • Candi di Malang • Budaya Bakar Batu Puncak Jaya • Teknologi Cloud Computing • Teknologi Big Data
Tipe FUNGSIONAL • Company Profile • Touch Screen Information Terminal (Interactive Kiosk) • Infografik
Interactive Kiosk • Airport • Mall / Shopping Center • Tourism Information
• Campuss / School • Public Services
Pilihan Topik Interactive Kiosk • • • • •
Informasi Gedung di UB Informasi Denah dan Ruangan di PTIIK Informasi Denah dan Kios/Gerai di salah satu Mall Informasi Pariwisata di Malang Informasi Transportasi Publik Malang
Company Profile • Profil perusahaan dalam bentuk web
Pilihan Topik utk Company Profile • Profile Universitas Brawijaya atau salah satu Fakultas atau salah satu Prodi • Profile salah satu perusahaan non profit di malang • Profile salah satu UMKM • Profile salah satu Cafe/Restoran
Infografik • Membuat sebuah web yang berisi report dalam bentuk infografik. Data riil yang ditampilkan dalam bentuk grafik dengan menggunakan javascript chart Misalnya: • Infografik Mahasiswa UB • Infografik Anggota DPR RI
Tools • • • • • • •
Dygraphs ZingChart Leaflet Visual.ly jQuery Visualize jpGraph Highcharts
PRESENTASI • Menggunakan File Presentasi dalam format HTML • Contoh: http://slides.html5rocks.com/ • HTML5 templates powered by JavaScript with CSS3 2D/3D transitions and animations.
Kelebihan: • Lebih mudah • Update dengan teks editor • Mudah didistribusi dan ditampilkan, dapat ditampilkan melalui browser • It’s not PowerPoint and your audience will be amazed by your technical prowess.
HTML Presentation • • • • • • • •
Reveal.js Impress.js Google Slides Template Shower Deck.js Jmpress.js HTML Slidy slides
PENYELESAIAN FINAL PROJECT
DELIVERY Setiap kelompok menyelesaikan 6 task berikut: • FINAL1: Form1 + Update Screenshot • FINAL2: Form2 + Update Screenshot • FINAL3: File Presentasi • FINAL4: Website Final Project dan diupload pada server • FINAL5: Artikel (+ Screenshot) untuk Publikasi • FINAL6: Laporan Lengkap
PENGUMPULAN 1 Minggu Terakhir (18-19 Desember)
• [FINAL2] Laporan: Isi laporan: Form-2 + Screenshot Progres Web • [FINAL3] Presentasi • Kelas G: File Presentasi dalam format Presentasi HTML5, tidak dipresentasikan (18 Des) • Kelas F: File presentasi dalam format PPT atau HTML, dipresentasikan di kelas (19 Des)
• File presentasi dikirimkan ke email dosen (format: [Web-KelasPresentasi-No_Kelompok]) • File Laporan (Form-2 only) diprint dan dikumpulkan di kelas
Format File Presentasi • • • •
Judul / tema Web Final Project Anggota Tim dan Pembagian Tugas Deskripsi Project Rancangan Web: Sumber konten, Struktur Menu/Isi, Aspek design (layout, typografi, warna, grafis) • Teknologi Implementasi • Hasil Screenshot Tampilan Web
PENGUMPULAN 2 Sebelum UAS (Deadline: 5 Januari 2015) • [FINAL4] Hasil Akhir Website Project (Source) dizip dalam satu folder dan dikirim ke email dosen. Format Email dan ZIP files: [Web-Kelas-Final-no_kelompok] • Web diunggah ke server ubcreative • [FINAL5] Artikel untuk dimuat di Web E-Learning ttg Project Web masing2 kelompok dan telah diposting pada web e-learning http://hermantolle.com/class/
Format Upload ke Server • Semua web harus diunggah ke internet dengan hosting: http://ubcreative.net/desain/2014/ • Masing-masing kelompok membuat folder dengan nama: misalnya kelompok 1 kelas F maka nama folder adalah: F01 • Sehingga URL project kelompok tsb menjadi: http://ubcreative.net/desain/2014/F01/
Format Artikel • Panjang maksimum (tanpa gambar) jika ditulis di kertas ukuran A4 adalah 1 halaman. • Dilengkapi dengan screenshot tampilan 1-2 halaman web • Isi: Narasi tentang Deskripsi web termasuk informasi sumber konten (paragraf 1), narasi tentang aspek perancangan dan desain yang dibuat (paragraf 2), narasi bahwa project ini adalah untuk tugas kuliah desain web dan penjelasan anggota tim beserta peranannya dalam pembuatan web tsb (paragraf 3) • Berikan link ke web yang telah dihosting di ubcreative.net • Artikel diposting di web e-learning http://hermantolle.com/class
PENGUMPULAN-3 Deadline: Saat Ujian Akhir • Hadir di kelas untuk Tanda tangan Absensi UAS • [FINAL6] Mengumpulkan Laporan Lengkap dalam 1 flashdisk / kelas (semua kelompok dijadikan satu dikoordinir ketua kelas) • Setiap Kelompok membuat 1 Folder yang berisi file: 1. 2. 3. 4. 5.
Form-1 Perancangan Web (doc) Form-2 Perancangan Web (doc) Source Website (files) File Presentasi (html files/PPT) Screenshot Website (dari server internet) + Screenshot Article (dari web e-learning) (doc)
Selamat Bekerja
