Skip to content

💻🧑‍💻Portfolio Model Design 2D Youthfull and Creative, this portfolio was make by Aditya Eka Febriano, Wisnu Prabowo and Yoga Ari Anggoro in HTML, CSS and JavaScript.

Notifications You must be signed in to change notification settings

wisnu23055/PORTO-KELOMPOK-8

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

35 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

🌐 Website Portofolio "Group Eight"

📖 Deskripsi Proyek

Website portofolio "Group Eight" adalah sebuah web yang kami kembangkan oleh mahasiswa D4 Manajemen Informatika untuk memperkenalkan keterampilan, pengalaman, proyek, contoh proyek, tools, serta sertifikasi yang kami miliki. Website ini dibuat sebagai implementasi dari mata kuliah Pemrograman Website untuk mengasah keterampilan teknis serta membangun personal branding tim melalui media digital. Tujuan dari website ini adalah sebagai sumber inspirasi dan untuk memperkenalkan keterampilan relevan di industri teknologi dan desain kepada khalayak umum.

Melihat Halaman Web

Anda dapat melihat halaman web ini melalui domain berikut:

Klik tautan di atas untuk mengakses website portofolio ini.


📌 Struktur dan Penjelasan Proyek

1. Struktur HTML

Struktur HTML yang digunakan pada website ini dirancang sederhana dengan elemen-elemen utama berikut untuk memastikan keterbacaan dan aksesibilitas yang baik:

  • Header: Berisi navigasi utama dengan tautan ke bagian Home, Skill, Pengalaman, Tools, dan Sertifikat.
  • Main Content:
    • Home Section: Menampilkan foto profil, deskripsi singkat, kontak pribadi, serta tautan ke email dan Instagram.
    • Skill Section: Informasi singkat tentang skill dan keterampilan yang kami miliki.
    • Pengalaman Section: Informasi tentang pengalaman kami serta menampilkan proyek-proyek dengan gambar dan tautan masing-masing.
    • Tools Section: Daftar tools yang biasa digunakan.
    • Sertifikat Section: Menampilkan foto sertifikat yang dimiliki dengan tautan ke masing-masing sertifikat.
  • Footer: Memuat informasi hak cipta.

Struktur ini memudahkan pengguna untuk menavigasi halaman web secara intuitif, dan kode HTML dioptimalkan agar responsif dan mudah dibaca.

2. Desain CSS

CSS digunakan untuk memperindah tampilan halaman web dengan desain modern dan responsif. Beberapa teknik utama yang diterapkan meliputi:

  • Flex & Grid: Mengatur tata letak agar tetap rapi di berbagai ukuran layar.
  • Warna & Tipografi: Menggunakan skema warna lembut dan tipografi konsisten untuk meningkatkan estetika.
  • Animasi & Hover Effects: Efek hover pada tombol navbar dan elemen gambar instagram dan email untuk interaksi yang lebih dinamis.
  • Media Queries: Mengoptimalkan tampilan di perangkat desktop agar tetap responsif.

Dengan teknik-teknik di atas, halaman web ini memiliki tampilan yang modern dan profesional.

3. Kreativitas dan Desain

Desain website ini menggunakan konsep minimalis dan modern, dengan fokus pada keterbacaan dan kenyamanan pengguna:

  • Layout Bersih: Menyederhanakan elemen-elemen untuk membuat navigasi lebih mudah.
  • Keseimbangan Warna: Menggunakan warna netral dengan aksen warna cerah untuk menarik perhatian.
  • Penggunaan Ikon: Ikon sederhana pada bagian kontak dan media sosial untuk menambah estetika.

Desain ini menciptakan kesan profesional namun tetap kreatif dan menarik bagi pengunjung.

4. Dokumentasi dan SRS

Dokumentasi proyek ini mencakup beberapa poin penting:

  • Penjelasan Kode: Setiap file memiliki komentar yang menjelaskan fungsi utama dari tiap bagian kode.
  • Struktur Folder:
    • index.html - File utama halaman web.
    • style.css - File CSS untuk pengaturan tampilan.
    • script.js - File JavaScript untuk fungsi interaktif.
  • SRS (Software Requirements Specification):
    • Tujuan: Menciptakan halaman web portofolio yang menarik dan mudah dinavigasi.
    • Fungsi Utama: Menampilkan informasi pribadi, kontak, skill, pengalaman, tools dan sertifikat.
    • Spesifikasi Pengguna: Responsif, mudah digunakan, dan interaktif.
    • Batasan: Fitur hanya mendukung browser modern dan tampilan desktop.

5. Fungsionalitas JavaScript

JavaScript digunakan untuk meningkatkan interaksi dan pengalaman pengguna. Fitur utama meliputi:

  • Smooth Scroll: Memberikan efek gulir fade-in dan fade-out saat berpindah ke halaman lain.
  • Animasi Memudar: Menambahkan efek animasi memudar saat tampilan awal website dimuat.

JavaScript diterapkan secara efisien untuk menambah interaksi tanpa mengurangi performa halaman web. Setiap fungsi dijelaskan dalam komentar di file script.js untuk memudahkan pemahaman.


📜 Kesimpulan

Proyek ini dirancang dengan HTML, CSS, dan JavaScript untuk menciptakan halaman portofolio yang responsif, menarik, dan fungsional. Dokumentasi dan SRS memastikan halaman ini mudah dipahami oleh pengguna lain.

About

💻🧑‍💻Portfolio Model Design 2D Youthfull and Creative, this portfolio was make by Aditya Eka Febriano, Wisnu Prabowo and Yoga Ari Anggoro in HTML, CSS and JavaScript.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Contributors 3

  •  
  •  
  •