{"id":12713,"date":"2025-12-05T01:02:49","date_gmt":"2025-12-05T01:02:49","guid":{"rendered":"https:\/\/binus.ac.id\/binus-digital\/?p=12713"},"modified":"2025-12-18T04:51:33","modified_gmt":"2025-12-18T04:51:33","slug":"creative-coding-di-dunia-nyata-dari-steam-ke-web-modern","status":"publish","type":"post","link":"https:\/\/binus.ac.id\/binus-digital\/2025\/12\/05\/creative-coding-di-dunia-nyata-dari-steam-ke-web-modern\/","title":{"rendered":"Creative Coding di Dunia Nyata: Dari STEAM ke Web Modern"},"content":{"rendered":"

Creative Coding dan Tempatnya di Lingkup Edukasi<\/strong><\/h2>\n

Di era sekarang, tren pendidikan tidak lagi hanya berfokus pada STEM (Science, Technology, Engineering, Mathematics<\/em>), tetapi berkembang menjadi STEAM dengan penambahan unsur Arts<\/em>. Kombinasi antara pengetahuan teknis dan kreativitas menjadi penting dalam dunia pendidikan.<\/p>\n

Jurnal penelitian oleh Teresa Terroso dan Mario Pinto berjudul \u201cProgramming for Non-Programmers: An Approach Using Creative Coding in Higher Education<\/em>\u201d menunjukkan bahwa belajar\u00a0programming\u00a0<\/em>kerap menjadi tantangan, bahkan bagi mahasiswa\u00a0Computer Science.\u00a0<\/em>Kesulitan itu muncul karena metode belajar yang statis, terlalu berfokus pada sintaks dan bahasa, bukan pada proses berpikir dan eksplorasi.<\/p>\n

Untuk mengatasinya, para peneliti mengusulkan pendekatan berbasis proyek seperti\u00a0game design,\u00a0<\/em>gamifikasi, dan\u00a0creative coding<\/em>. Pendekatan terakhir ini dinilai efektif untuk membantu pelajar non-IT memahami logika pemrograman dengan cara yang lebih ekspresif, interaktif, dan menyenangkan.<\/p>\n

Konsep\u00a0creative coding\u00a0<\/em>di dunia pendidikan menunjukkan bahwa belajar kode tidak harus kaku atau membosankan. Ia bisa menjadi proses kreatif, sebuah bentuk eksplorasi yang memadukan logika dan imajinasi. Menariknya, semangat yang sama kini hadir di dunia digital, di ranah web. Tempat para\u00a0developer\u00a0<\/em>dan desainer menciptakan karya interaktif yang fungsional sekaligus artistik.<\/p>\n

Website Sebagai Media Kreatif<\/strong><\/h2>\n

Situs web menjadi salah satu medium penting dalam\u00a0creative coding<\/em>. Dengan memanfaatkan\u00a0browser\u00a0<\/em>sebagai kanvas, para\u00a0creative coder\u00a0<\/em>melukis dengan logika, animasi, dan interaktivitas. Fungsinya kini melampaui sekadar menyampaikan informasi, tapi menjadi media untuk mengekspresikan emosi dan ide kreatif.<\/p>\n

Melalui\u00a0HTML5 canvas\u00a0<\/em>dan\u00a0WebGL,\u00a0<\/em>web dapat berubah menjadi ruang seni generatif, tempat pola dan bentuk lahir dari algoritma.\u00a0Framework\u00a0<\/em>seperti\u00a0Three.js\u00a0<\/em>memungkinkan pengalaman 3D yang imersif, sedangkan\u00a0p5.js\u00a0<\/em>mengubah angka dan data menjadi karya visual yang interaktif. Bahkan melalui\u00a0shader programming\u00a0<\/em>(GLSL), para kreator dapat mengatur setiap\u00a0pixel\u00a0<\/em>secara langsung untuk menciptakan efek visual yang dinamis dan organik.<\/p>\n

Pengaruh Creative Coding ke Website Modern<\/strong><\/h2>\n

Pada awal kemunculannya, web hanya berfungsi sebagai ruang informasi statis. Namun, seiring berkembangnya teknologi dan kemampuan\u00a0browser<\/em>, web berevolusi menjadi medium\u00a0storytelling\u00a0<\/em>yang kaya.<\/p>\n

Semangat creative coding<\/em> kini tercermin dalam cara kita merancang dan membangun web modern. Platform seperti Awwwards<\/em> atau FWA <\/em>menampilkan banyak situs yang menggabungkan logika pemrograman dengan estetika visual melalui teknologi seperti GSAP<\/em>, WebGL<\/em>, Three.js<\/em> dan lainnya.<\/p>\n

Perkembangan ini melahirkan era baru web yang lebih ekspresif. Mulai dari transisi halaman, microinteractions<\/em>, elemen yang bereaksi terhadap kursor, atau animasi berbasis scroll<\/em> kini menjadi bagian dari narasi dan identitas digital suatu merek. Situs web modern tak lagi hanya dilihat, namun memberikan pengalaman yang inovatif, imersif, dan berkesan.<\/p>\n

Beberapa contohnya dapat dilihat di:<\/p>\n

    \n
  1. Igloo inc<\/a>\n

    \"Website
    Website Igloo Inc https:\/\/www.igloo.inc\/<\/a><\/figcaption><\/figure><\/li>\n
  2. Hut 8<\/a>\n

    \"Website
    Website Hut 8 https:\/\/www.hut8.com\/<\/a><\/figcaption><\/figure><\/li>\n
  3. Opal Tadpole<\/a>\n

    \"Website
    Website Opal Tadpole https:\/\/opalcamera.com\/opal-tadpole<\/a><\/figcaption><\/figure><\/li>\n<\/ol>\n

    Tiga situs yang ditampilkan di https:\/\/www.awwwards.com\/<\/a>\u00a0yang menunjukkan bagaimana kode di website menjadi wadah storytelling yang memikat.<\/p>\n

    Singkat kata..<\/strong><\/h2>\n

    Creative coding\u00a0<\/em>adalah jembatan antara seni dan teknologi, cara baru memandang kode sebagai sarana ekspresi, bukan sekadar alat.<\/p>\n

    Dalam pendidikan, creative coding\u00a0<\/em>dapat menjadi jalan untuk belajar pemrograman melalui proyek kreatif, yang tidak hanya mengajarkan logika, tetapi menumbuhkan rasa ingin tahu dan eksplorasi.<\/p>\n

    Filosofi creative coding<\/em> yang berakar pada eksplorasi kini juga tercermin dalam pendekatan desain situs modern. Dari motion design<\/em>, interaktivitas, hingga storytelling<\/em>. Potensi website pun kini menjadi luas: dinamis, ekspresif, dan penuh kemungkinan.<\/p>\n

    \u00a0<\/span>Referensi:<\/span>\u00a0<\/span><\/p>\n

      \n
    1. https:\/\/timrodenbroeker.de\/what-is-creative-coding\/<\/a><\/li>\n
    2. https:\/\/brain2.edusoft.ro\/index.php\/brain\/article\/view\/845<\/a><\/li>\n
    3. https:\/\/drops.dagstuhl.de\/storage\/01oasics\/oasics-vol102-icpec2022\/OASIcs.ICPEC.2022.13\/OASIcs.ICPEC.2022.13.pdf<\/a><\/li>\n
    4. https:\/\/dpdk.com\/stories\/importance-creative-coding-creating-digital-experiences<\/a><\/li>\n<\/ol>\n","protected":false},"excerpt":{"rendered":"

      Creative Coding dan Tempatnya di Lingkup Edukasi Di era sekarang, tren pendidikan tidak lagi hanya berfokus pada STEM (Science, Technology, Engineering, Mathematics), tetapi berkembang menjadi STEAM dengan penambahan unsur Arts. Kombinasi antara pengetahuan teknis dan kreativitas menjadi penting dalam dunia pendidikan. Jurnal penelitian oleh Teresa Terroso dan Mario Pinto berjudul \u201cProgramming for Non-Programmers: An Approach […]<\/p>\n","protected":false},"author":75,"featured_media":13106,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[77],"tags":[85],"class_list":["post-12713","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-articles","tag-creative-coding"],"_links":{"self":[{"href":"https:\/\/binus.ac.id\/binus-digital\/wp-json\/wp\/v2\/posts\/12713","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/binus.ac.id\/binus-digital\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/binus.ac.id\/binus-digital\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/binus.ac.id\/binus-digital\/wp-json\/wp\/v2\/users\/75"}],"replies":[{"embeddable":true,"href":"https:\/\/binus.ac.id\/binus-digital\/wp-json\/wp\/v2\/comments?post=12713"}],"version-history":[{"count":5,"href":"https:\/\/binus.ac.id\/binus-digital\/wp-json\/wp\/v2\/posts\/12713\/revisions"}],"predecessor-version":[{"id":12807,"href":"https:\/\/binus.ac.id\/binus-digital\/wp-json\/wp\/v2\/posts\/12713\/revisions\/12807"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/binus.ac.id\/binus-digital\/wp-json\/wp\/v2\/media\/13106"}],"wp:attachment":[{"href":"https:\/\/binus.ac.id\/binus-digital\/wp-json\/wp\/v2\/media?parent=12713"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/binus.ac.id\/binus-digital\/wp-json\/wp\/v2\/categories?post=12713"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/binus.ac.id\/binus-digital\/wp-json\/wp\/v2\/tags?post=12713"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}