Web Desain
Persyaratan Umum:
- Peserta adalah siswa/siswi jenjang SMA/SMK/MA/Sederajat sekolah negeri maupun swasta yang masih aktif pada tahun pendidikan 2023/2024 (dibuktikan dengan Kartu Tanda Pelajar)
- Peserta wajib melakukan pendaftaran melalui link bit.ly/pimpelpitcomfest
- Setiap peserta wajib menyelesaikan pendaftaran serta administrasi pendaftaran
- Peserta lomba wajib melampirkan scan kartu identitas aktif, berupa Kartu Tanda Pelajar saat mendaftar
- Peserta terdiri dari (individu atau tim yang terdiri dari 1-2 orang dengan 1 pendamping)
- Guru pendamping bersifat opsional
- Peserta harus sudah hadir 15 menit sebelum lomba dimulai, bagi yang terlambat harus mendapatkan izin dari panitia dan tidak ada perpanjangan waktu
- Peserta wajib mengikuti syarat dan ketentuan kompetisi sesuai dengan GuideBook PIMPEL X PITCOMFEST
- Peserta wajib mengikuti Techinical Meeting pelaksanaan lomba PIMPEL X PITCOMFEST
- Wajib mengisi daftar hadir pada saat setiap cabang lomba
- Peserta lomba wajib menempati dan menggunakan peralatan lomba sesuai dengan hasil undian
- Penulisan nama peserta wajib menggunakan nama lengkap tanpa disingkat
Syarat dan Ketentuan Lomba Web Desain
- Peserta adalah siswa/siswi jenjang SMA/SMK/MA/Sederajat sekolah negeri maupun swasta yang masih aktif pada tahun pendidikan 2023/2024 (dibuktikan dengan Kartu Tanda Pelajar)
- Setiap peserta wajib menyelesaikan pendaftaran beserta administrasi pendaftaran.
- Lomba bersifat individu dan team ( 1-2 orang)
- Peserta lomba wajib melampirkan scan kartu identitas aktif, berupa Kartu Pelajar saat mendaftar
- Tidak dibenarkan peserta diganti pada saat tengah lomba berlangsung.
- Peserta harus hadir pada ‘technical meeting’.
- Lomba pada penyisihan pertama akan dipilih berdasarkan racangan desain website yang sudah dikirimkan ke panitia.
- Peserta yang lolos 10 tim terbaik akan lanjut untuk mengembangkan layout web tersebut.
- Peserta harus sudah hadir 15 menit sebelum lomba dimulai, bagi yang terlambat harus mendapat izin dari panitia dan tidak ada perpanjangan waktu.
- Wajib mengisi daftar hadir pada saat setiap jenis lomba yang diadakan.
- Penentuan nomor peserta dilakukan melalui undian, bagi peserta yang tidak mengikuti technical meeting, nomor undian ditentukan oleh panitia.
- Berpakaian bebas sopan (berkerah).
- Peserta lomba wajib menempati dan menggunakan peralatan lomba sesuai dengan hasil undi.
- Waktu istirahat ditentukan sesuai situasi saat lomba.
- Peserta tidak dapat melanjutkan lomba dikarenakan sakit atau hal-hal lain, maka dianggap gugur/mengundurkan diri.
- Peserta tidak dibenarkan berkonsultasi atau mendapat pengarahan teknis tentang pekerjaan (job) pada waktu kegiatan berlangsung dari pembimbing masing-masing kecuali dari tim juri.
- Kegagalan/keterlambatan pekerjaan tidak diberikan toleransi (misalnya karena lupa pekerjaan belum di-save).
- Kerusakan peralatan (hardware/software) akibat kesalahan prosedur yang dilakukan peserta, menjadi tanggung jawab peserta itu sendiri.
- Tidak dibenarkan menggunakan peralatan (hardware/software) di luar ketentuan yang ada
- Tidak diperbolehkan membawa buku/catatan/HP/flashdisk di ruang lomba.
- Tidak diperbolehkan mengakses internet pada saat lomba berlangsung.
- Untuk alasan kesehatan peserta diperbolehkan membawa makanan kecil dan minuman ke dalam ruang ujian.
- Ketentuan lain yang belum tercantum dalam tata tertib ini diputuskan oleh kebijakan juri (ditentukan kemudian sesuai kebutuhan).
- Pelanggaran terhadap tata tertib ini akan diberikan sanksi berupa teguran sampai berupa pemberhentian sebagai peserta
Ruang Lingkup
Materi yang dilombakan pada LKS saat ini meliputi kemampuan desain website dan layout. Lebih detail mengenai penilaian dan waktu dari tiap kemampuan dijelaskan pada tabel 1
| No | Soal | Bobot | Waktu | Ranah Kompetensi |
|---|---|---|---|---|
| 1 | Desain Web (Seleksi 1) | 50 | - | |
| 2 | Desain Web (Seleksi 2) | 50 | 150 menit |
Soal praktek terdiri dari 2 modul (saling terkait). Elemen-elemen kompetensi yang dilombakan pada bidang lomba Desain Web ini antara lain:
1. Desain & Layout Website (Seleksi 1)
Individu perlu mengetahui dan memahami
- Masalah yang berkaitan dengan kognitif, sosial dan budaya untuk desain web
- Cara membuat grafis untuk web dan design yang sesuai dengan spesifikasi.
- Mengikuti prinsip-prinsip dan pola design.
- Keterampilan yang diperlukan untuk merancang web dan memanfaatkan komposisi warna dan tipografi.
- Penerapan elemen design yang disesuaikan dengan pengguna.
- Penerapan desain website untuk beragam device sesuai dengan keterbatasan internet dan resolusi layer
- Membuat, menganalisa dan mengembangkan grafik yang dapat menyampaikan informasi dengan baik sesuai pemahaman komposisi hirarki, tipografi dan estetika
- Membuat, memanipulasi dan mengoptimalkan resolusi gambar untuk tampilan Web.
- Menentukan sebuah ide yang paling sesuai dengan pengguna dan tema.
- Menggunakan semua elemen yang diperlukan untuk membuat design
- Membuat desain responsif yang berfungsi dengan benar pada beberapa resolusi layar dan / atau perangkat
- Membuat sebuah design yang asli dan kreatif.
- Transform ide menjadi design estetis dan kreatif menggunakan software yang disediakan
- Tema besar yang diangkat adalah “Insipiring the Next Generation of IT Professionals”, peserta diharapkan dapat merancang desain website dengan kategori edutech.
- Membuat desain halaman website responsif dengan menggunakan Figma. Minimal terdapat 2 rancangan halaman website yang terdiri dari landing page dan 1 halaman pendukung.
- Membuat icon atau aset-aset yang dibutuhkan dengan menggunakan Figma, Adobe Photoshop atau Adobe Ilustrator. Jika menggunakan aset yang berasal dari internet wajib dipastikan peserta mendapatkan izin terlebih dahulu dari pemilik.
- Deskripsi rancangan website dalam bentuk PDF meliputi latar belakang masalah, tujuan dan hasil yang ingin dicapai, target pengguna, skenario penggunaan rancangan produk
- Link Figma rancangan website
2. Layout Website (Seleksi 2)
Individu perlu mengetahui dan memahami
- Standar World Wide Web Consortium (W3C) untuk HTML dan CSS. Metode website layout dan website structure.
- Web Accessibility Initiative (WAI)
- Mengidentifikasi aturan CSS yang tepat untuk mendapatkan hasil yang diinginkan
- Mengintegrasikan animasi, audio dan video dalam website.
- Menggunakan Javascript untuk fungsionalitas website
- Menggunakan CSS dengan cara yang paling efisien dan efektif untuk konsistensi antara web browser
- Membuat halaman web yang konsisten dan berfungsi pada berbagai perangkat dan perbedaan resolusi layer.
- Membuat website yang sesuai dengan standar W3C saat ini (http://www.w3.org).
- Menggunakan CSS atau file eksternal lainnya untuk memodifikasi tampilan website.
- Membuat website secara interaktif menggunakan javascript dan jQuery sebagai pembantu dalam menambah fungsionalitas
- Membuat halaman website responsif dengan menggunakan HTML5 dan CSS3 sesuai dengan standar W3C yang dapat diverifikasi lewat validator w3.org.
- Membuat desain halaman website yang responsif dengan menggunakan grid system dan CSS3.
- Membuat animasi dengan menggunakan CSS3 dan Javascript.
- Membuat website interaktif dengan menggunakan Javascript atau JQuery
- Deskripsi rancangan website dalam bentuk PDF meliputi latar belakang masalah, tujuan dan hasil yang ingin dicapai, target pengguna, skenario penggunaan rancangan produk
- Link Figma rancangan website
- Penilaian Desain & Layout Website (Seleksi 1)
| Kriteria Penilaian | Bobot |
|---|---|
| Kesesuaian dengan Tema | 20 |
| Kreativitas dan Inovasi | 20 |
| Estetika dan Tata Warna | 20 |
| Kejelasan Informasi | 20 |
| Kerapian Layout dan Tampilan | 10 |
| Responsif dan User-friendly | 10 |
2. Penilaian Layout Website (Seleksi 2)
| Kriteria Penilaian | Bobot |
|---|---|
| Struktur HTML yang Rapi | 15 |
| Penerapan CSS yang Efektif | 15 |
| Responsif dan Kompatibilitas | 15 |
| Kesesuaian dengan Desain | 15 |
| Kecepatan Loading | 10 |
| Kode yang Rapi dan Terdokumentasi | 10 |
| Aksesibilitas | 10 |
| SEO (Search Engine Optimization) | 10 |
Kelengkapan dan Fasilitas
Spesifikasi peralatan yang digunakan oleh peserta lomba adalah:
| Nama | Keterangan |
|---|---|
| PC (Personal Computer) | Spesifikasi Desain dan Programming |
| Windows 10/11 | - |
| Browser: Google Chrome, Mozilla Firefox, Edge | Versi Terbaru |
| Editor: Adobe Photoshop, CorelDraw, Figma | Versi Terbaru |
| Code Editor: Notepad++, Sublime Text, Visual Studio Code | Versi Terbaru |
| CSS Framework: Bootstrap, Tailwind | Versi Stable |
| JQuery | Versi 3.x |
Alat dan bahan yang telah disediakan oleh panitia tidak dapat digantikan dengan alat dan bahan yang dibawa oleh peserta. Alat yang diperbolehkan dibawa oleh peserta dan bersifat opsional ditunjukkan pada Tabel 3.
| Nama | Keterangan |
|---|---|
| Keyboard | Opsional |
| Mouse | Opsional |
| Mousepad | Opsional |
Penentuan Juara
- Evaluasi dilakukan pada peserta pada tahap 1 (Desain Menggunakan Figma) berdasarkan kriteria penilaian dan bobot yang telah ditetapkan.
- 10 Peserta dengan nilai terbaik akan lolos ke seleksi 2.
- Evaluasi peserta yang lolos ke tahap 2 (Desain Website dengan CSS dan HTML) berdasarkan kriteria penilaian dan bobot yang telah ditetapkan.
- Nilai akhir berdasarkan skor akumulatif. bobot untuk tahap 1 adalah 50% dan bobot untuk tahap 2 adalah 50%, maka skor akumulatif akan dihitung sebagai berikut:
Skor akumulatif = (skor tahap 1 * 0,5) + (skor tahap 2 * 0,5) - Juara 1, 2, dan 3 ditetapkan berdasar skor akumulatif tertinggi.
- Cashback biaya registrasi PMB UMS bagi seluruh juara, syarat dan ketentuan berlaku
Fasilitas Juara 1
- Sertifikat
- Uang Pembinaan sebesar Rp. 1.000.000
- Sertifikat
- Uang Pembinaan sebesar Rp. 750.000
- Sertifikat
- Uang Pembinaan sebesar Rp. 500.000