Tugas Softskill Semester 6 : Pengantar Animasi & Desain Grafis




Website D. I. Yogyakarta

Website D.I. Yogyakarta dibangun dengan menggunakan HTML, Javascript, CSS dan PHP; beserta beberapa library seperti jQuery, Bootstrap,  dan AOS-Animation. Website ini secara jumlah halaman adalah terbagi dari 4 jenis halaman :

A. Halaman Utama (Home)




Halaman utama adalah dimana beberapa elemen utama menjadi fokus dari halaman Gambar utama, Link-link ke setiap page, Foto Galeri
Musik format MP3 akan dimainkan secara otomatis ketika kunjungan halaman dimulai, dan juga animai dari setiap link-gambar dipergunakan untuk menarik pengunjung mengklik link yang ada.

B. Biodata



Biodata merupakan halaman dimana team pembangun web site di perkenalkan, di mana pada halam ini, image dari masing-masing anggota team dibuat untuk tampil bundar, merubah tampilan foto sebenarnya yang berbentuk bujur sangkar,  dengan menggunakan teknik CSS.

C. Budaya



Pada halaman budaya, diperlihatkan beberapa foto yang terkait denganbudaya Jogja, dan pemilihan detail dari setiap budaya, akan ditampilkan 'layer pop-up' yang berisikan detail dari masing-masing budaya.
Video dari masing-masing budaya akan dapat dilihat pada pop-up yang tampil.

D. Event



Halaman Event merupakan halaman yang memperlihatkan event-event yang ada di Jogj dengan tampilan tanggal dan teknik 'karosel' untuk memperlihatkan foto dari event yang sedang ditampilkan.
Link dari event-event lain ditampilkan di sebelah kanan, dimana pemilihan link akan memindahkan halaman ke event lain terkait.


Struktur Navigasi
Struktur navigasi hirarki biasa disebut struktur bercabang, merupakan suatu struktur yang mengandalkan  percabangan untuk menampilkan data berdasarkan kriteria tertentu. Tampilan pada menu pertama akan disebut sebagai Master Page (halaman utama pertama), halaman utama ini mempunyai halaman percabangan yang disebut Slave Page (halaman pendukung). Jika salah satu halaman pendukung dipilih atau diaktifkan, maka tampilan tersebut akan bernama Master Page (halaman utama kedua), dan seterusnya. Pada struktur navigasi ini tidak diperkenankan adanya tampilan secara linier.
Sumber : https://www.andre.web.id/struktur-navigasi-website/



Saya memakai struktur navigasi hirarki karena website yang telah kelompok kami buat memiliki suatu master page (halaman utama) Home sebagai tampilan pertama jika pengguna memasuki website budaya D. I. Yogyakarta, dan memiliki cabang-cabangnya yaitu Biodata, Budaya, Events (Acara) sebagai slave page (halaman pendukung). Slave page Budaya dan Events/Acara terdapat content (isi) yang dapat dilihat pada struktur navigasi.


 Penjelasan Kode
Digunakan PHP karena kemudahan untuk menyertakan file yang sama  dalam halaman, sehingga jika ada perubahan hanya cukup 1 file yang dikoreksi.
Penyertaan elemen halaman di file lain, untuk kemudahan pembacaan kode

Library yang dipakai dalam pembuatan web ini yaitu :
·          Jquery


Pop-up pada foto galeri dibuat secra dinamik pada saat image diklik. pembuattan poup dinamik adalah dg menggunakan javasript – jquery, yg dipadu dengan class pada CSS.

·          Bootstrap



Class yang disediakan oleh bootstrap dipergunakan di setiap halaman terutama untuk penjabaran jumlah kolom pada halaman. Class dari bootstrap juga dipergunakan untuk mengubah bentuk image dari bujur sangkar ke tampiln bundar.

·          AOS



“data-aos=fade-right” mengartikan bahwa gambar akan muncul animasi gambar biodata dengan efek kiri ke kanan. Jika animasi gambar event memakai efek fade yang sama tetapi menjadi fade-left agar dari kanan ke kiri.



“data-aos=flip-left” mengartikan bahwa gambar akan muncul animasi gambar budaya dengan efek memutar.
efek elemen halaman , misalnya entry link dg gambar, sehingga gambar akan bergerak sesuai dengn jenis animasi yang dipilih dan disediakan.



Dapat dilihat secara jelasnya website yang telah kami buat di : https://aqira.000webhostapp.com

Berikut penjelasan mengenai website yang telah kami kelompok 2 buat. 
Mohon maaf jika ada kesalahan kata dan terima kasih.

Komentar

Posting Komentar

Postingan populer dari blog ini

Tugas Terakhir : Softskill Bahasa Inggris

1.        The teacher made Alex _____ (leave) the room. To leave, because “made” is a past therefore the word leave don’t need to be modified, only needs to be added to 2.        Megan got Marvin ______ (type) by a mechanic. To type, because Marvin is doing an action that needs to be added a tobe for the word type 3.        We got our house ______ (paint) last week. Painted, because they did it last week, so for it to make sense it needs to be formed as a past sentence 4.        Dylan got his transcripts ______ (send) the university. Sent, because Dylan did send the transcript before the sentence was made. 5.        Selena is getting her hair ______ (cut) tomorrow. To be cut, because the action will be done by tomorrow Best Experience : It was year 2014, I had a school Ramadhan holiday for 2 weeks. I got invi...
Baca selengkapnya

Bahasa Inggris Bisnis 2, Meeting 1-4

TASK 1 Directions: The first type of question consists of incomplete sentences, with a blank line showing where information is to be filled in. Choose the word or phrase that most correctly completes the sentence. The second type of question consists of sentences with four underlined words or phrases. Choose the one word or phrase that is incorrect in standard written English. Explain your reason of choosing the correct answer. 1. The rain forest, __________ large trees that provide shade to the vegetation below, is home to unique flora and fauna. A. has B. with its  C. and D. although has Reason behind it : Here it is explaining what the rain forest consists of by, hinting a comma after the subject (The rain forest) it is an explanatory sentence of describing the subject. 2. Despite the polar bear’s tremendous weight and height, __________ of sprinting at tremendous speed. A. it is capable  B. is capable C. it is able D. ability Reason behind it : The sent...
Baca selengkapnya

Kasus Cambridge Analytica, Facebook Data Breach

Gambar
MASALAH PRIVASI FACEBOOK meningkat tajam pada hari Jumat ketika jaringan sosial mengungkapkan bahwa masalah keamanan yang belum pernah terjadi sebelumnya, ditemukan pada tanggal 25 September, berdampak pada hampir 50 juta akun pengguna. Tidak seperti skandal Cambridge Analytica, di mana perusahaan pihak ketiga secara keliru mengakses data yang telah disedot oleh aplikasi kuis yang sah, kerentanan ini memungkinkan penyerang untuk langsung mengambil alih akun pengguna. Bug yang mengaktifkan serangan sejak itu telah ditambal, menurut Facebook. Perusahaan mengatakan bahwa penyerang dapat melihat segala sesuatu di profil korban, meskipun masih belum jelas apakah itu termasuk pesan pribadi atau jika ada data yang disalahgunakan. Sebagai bagian dari perbaikan itu, Facebook secara otomatis mengeluarkan 90 juta pengguna Facebook dari akun mereka pada hari Jumat pagi, terhitung untuk 50 juta yang diketahui Facebook terkena dampaknya, dan tambahan 40 juta yang berpotensi bisa terjadi. Ke...
Baca selengkapnya