Fable 5 dan GPT 5.6 SEKALI JALAN Buat Website Senilai $10.000 dengan Skill Ini

CChase AI
Computing/SoftwarePhotography/ArtInternet Technology

Transcript

00:00:00Seluruh situs web ini dibuat dalam satu pengambilan gambar oleh Claude Fable 5 dalam satu keahlian.
00:00:05Ini bukan sekadar animasi gulir tunggal, melainkan beberapa animasi gulir yang telah digabungkan
00:00:10untuk memberikan pengalaman yang mulus, berkualitas tinggi, dan koheren bagi Anda.
00:00:15Ini benar-benar luar biasa.
00:00:16Ini adalah produk yang sangat premium dan saya akan menunjukkan keahlian yang memungkinkan Anda melakukan semua ini.
00:00:22Selain itu, saya akan menunjukkan bagaimana saya melakukannya tidak hanya di dalam Claude Code,
00:00:25tetapi kita juga akan mendemonstrasikan hal yang sama persis di dalam GPT 5.6 Sol yang baru.
00:00:31Karena kenapa harus berhenti pada satu alat AI saja akhir-akhir ini?
00:00:35Dan hal ini sangat keren.
00:00:37Seperti yang saya katakan, jika Anda mencoba melakukan ini secara manual tanpa keahlian animasi gulir yang telah saya temukan dan tingkatkan,
00:00:42Anda tahu betapa sulitnya itu.
00:00:43Anda membuat beberapa video, mengambil bingkai awal, mencoba melakukan penyesuaian,
00:00:47Anda mengambil semua bingkai satu per satu, sungguh menyebalkan
00:00:50dan ini membuat keseluruhan proses sangat mudah dilakukan.
00:00:53Kredit nyata untuk keahlian ini diberikan kepada Peter Wang.
00:00:55Dialah yang membuat versi aslinya.
00:00:57Saya menemukannya di Twitter dan dia cukup baik untuk menjadikannya open source.
00:01:00Jadi, scroll world miliknya akan ditautkan di bawah agar Anda bisa melihatnya.
00:01:03Nah, yang saya lakukan adalah melakukan forking pada hal ini dan membuat beberapa perbaikan,
00:01:07terutama memperkenalkan tingkatan anggaran sehingga Anda bisa melakukannya tanpa harus mengeluarkan banyak biaya.
00:01:10Kita tidak selalu membutuhkan enam adegan berbeda untuk situs web kita
00:01:14dan saya menyertakan banyak perbaikan pada versi seluler ini dan semacam hal yang berkaitan dengan SEO.
00:01:19Cara kerja animasi gulir ini secara garis besar adalah kita mulai dengan satu gambar.
00:01:23Itulah yang Anda lihat di sini.
00:01:24Kita kemudian mengambil gambar itu dan mengubahnya menjadi video.
00:01:27Animasi gulir ini pada satu titik adalah sebuah video, tetapi kita kemudian mengambil semua bingkai individu dari video tersebut menggunakan FFmpeg
00:01:34dan kemudian mengaitkannya dengan posisi Anda, pengguna, berada di situs web.
00:01:40Ada banyak hal lain yang terjadi di balik layar untuk menjadikannya pengalaman yang mulus sehingga tidak terlihat aneh.
00:01:46Selain itu, kita memastikan semua adegan kita saling merujuk saat kita membangunnya.
00:01:50Dengan begitu, semuanya terlihat koheren.
00:01:52Seperti ini, semuanya terlihat seperti berasal dari satu cerita tunggal.
00:01:55Mengenai bagaimana kita sebenarnya menghasilkan gambar dan video, kita melakukannya melalui Higgs field MCP.
00:02:00Dan kita bisa melakukan ini baik dengan cloud code maupun codecs.
00:02:02Kita tidak pernah harus meninggalkan terminal.
00:02:04Ini memanggil semua model gambar tersebut, yaitu GPT image dua, dan semua model video, yaitu seed dance, melalui MCP atau CLI tersebut.
00:02:12Nah, untuk menghubungkan alat-alat tersebut ke agen AI pilihan Anda, Anda hanya perlu pergi ke Higgs field, pergi ke MCP dan CLI, dan ikuti langkah-langkah ini.
00:02:20Anda hanya perlu menyalin URL untuk MCP dan kemudian melakukan proses autentikasi.
00:02:25Satu-satunya hal yang Anda butuhkan setelah itu adalah keahlian itu sendiri.
00:02:27Dan saya akan menautkan versi saya di bawah juga.
00:02:30Anda bisa menyalin URL-nya, memberikannya ke Cloud Code atau Codex, atau Anda bisa melakukannya sebagai plugin.
00:02:35Keduanya bisa berhasil.
00:02:36Nah, seperti yang saya katakan di intro, saya akan mendemonstrasikan ini di dalam Codex dengan Sol 5.6 yang baru, tetapi seperti inilah tampilannya di dalam Cloud Code.
00:02:44Prosesnya sama persis.
00:02:46Anda melalui wawancara, Anda beri tahu situs web seperti apa yang ingin Anda bangun, apa yang Anda inginkan untuk setiap adegan, dan itu akan memandu Anda langkah demi langkah.
00:02:53Dan itu akan memastikan, hei, apakah Anda menyukai gambar ini sebelum benar-benar membuatnya dan menciptakan semua video.
00:02:57Anda tidak hanya menjalankan keahlian dan semua video muncul begitu saja tanpa Anda memiliki pendapat dalam prosesnya.
00:03:01Jadi ini benar-benar membimbing Anda melalui keseluruhan hal tersebut.
00:03:04Jadi di dalam Codex, saya telah memanggil keahlian scroll world.
00:03:07Jadi saya hanya mengetik forward slash scroll world.
00:03:08Dan saya berkata, saya mencoba membuat situs web untuk merek perjalanan butik Jepang.
00:03:14Dan arah seni umum yang saya inginkan adalah kita akan menggunakan gaya origami.
00:03:18Nah, jika Anda tidak tahu gaya apa yang Anda inginkan, Anda bisa melakukan tanya jawab dengan AI dan itu akan menanyakan beberapa pertanyaan kepada Anda.
00:03:25Saya sudah tahu sebelumnya apa yang saya inginkan.
00:03:27Jadi jangan khawatir jika Anda tidak memiliki ide pasti saat Anda muncul sekarang, setelah Anda memberikannya arahan kreatif, maka ia akan bertanya, apa yang ingin Anda lakukan terkait anggaran?
00:03:36Dan apa yang ingin Anda lakukan terkait anggaran seluler?
00:03:38Ini mengatakan, berapa banyak adegan yang Anda inginkan sebagai referensi?
00:03:41Ini adalah enam adegan.
00:03:43Ini adalah jumlah video yang signifikan, dan ini sebenarnya perjalanan yang cukup panjang dari awal hingga akhir.
00:03:48Ini mungkin berlebihan bagi kebanyakan orang.
00:03:50Selain itu, ini akan memakan banyak kredit Higgs field untuk memakan biaya sekitar 800 pada akhirnya.
00:03:56Jadi, jika Anda tidak menggunakan salah satu paket yang lebih mahal, Anda mungkin ingin tetap menggunakan empat adegan, saya pikir itu adalah titik yang tepat.
00:04:03Berikutnya adalah apa yang ingin Anda lakukan dengan seluler.
00:04:04Jadi Anda bisa melakukan segalanya mulai dari sekadar memotongnya dengan aman hingga rantai potret penuh, di mana ia akan membuat video tambahan khusus untuk seluler.
00:04:12Jadi Anda memiliki ruang untuk bekerja, seberapa dalam Anda ingin melangkah di bagian itu.
00:04:15Namun untuk video ini, kita hanya akan melakukan lean dan crop safe.
00:04:20Jadi semacam pilihan termurah dan pahami bahwa Anda juga bisa melakukan lebih sedikit adegan.
00:04:24Anda bisa mendapatkannya hingga tiga, ini hanya apa yang ditawarkan sebagai default.
00:04:28Tetapi kemudian itu akan membawa Anda melalui proposal perjalanan dan berkata, hei, inilah seperti apa setiap adegan nantinya.
00:04:32Dan itu seperti, ini adalah berapa banyak generasi yang akan dibutuhkan.
00:04:35Jadi akan memakan total empat generasi gambar, empat video penyelaman adegan.
00:04:40Perlu ada penghubung antara beberapa video dan beberapa crossfade.
00:04:43Jadi total ia mengatakan sembilan generasi dan itu memberi Anda perkiraan waktu pembuatan, yang biasanya cukup konservatif.
00:04:49Itu biasanya tidak memakan waktu lama, meskipun kita berbicara tentang video AI.
00:04:52Dan jadi setelah Anda menyetujui itu, hal berikutnya yang akan dilakukan adalah menghasilkan jangkar.
00:04:56Jangkar itu akan menjadi bingkai awal tersebut.
00:05:00Dan kita berbicara tentang bingkai awal itu.
00:05:01Kita berbicara tentang sesuatu yang mirip dengan ini di latar belakang.
00:05:03Itu hanya akan menjadi gambar diam.
00:05:04Dan sekarang terserah Anda untuk mengatakan, oke, saya suka ini.
00:05:06Ini adalah arah seni yang akan mendominasi secara keseluruhan.
00:05:09Atau tidak, mari kita ubah beberapa bagian.
00:05:11Ini adalah bagian yang benar-benar harus Anda perhatikan, karena jika Anda tidak menyukainya dan Anda mengatakan ya, semuanya akan didasarkan padanya.
00:05:17Jadi inilah tampilan gambar yang dibuatnya.
00:05:19Dan saya menyukainya sekarang.
00:05:20Anda mungkin sudah menyadari hal ini.
00:05:21Jika Anda melakukan semua ini melalui Codex dan melalui Sol, yah, itu memiliki pembuatan gambar.
00:05:26Kita tidak perlu mengirim permintaan apa pun ke Higgsfield untuk membuat gambar dengan GPT Image 2
00:05:31ketika kita secara asli memiliki kemampuan itu di dalam Codex.
00:05:34Jadi Anda akan meminta Codex melakukannya secara asli, tetapi Anda masih harus mengirimnya ke Higgsfield untuk pembuatan video.
00:05:41Sebaliknya, jika Anda melakukan ini di Cloud Code, jelas itu tidak memiliki pembuatan gambar.
00:05:44Jadi Higgsfield harus memikul beban di sepanjang jalan.
00:05:48Tetapi inilah gambarnya.
00:05:50Saya menyukainya.
00:05:51Jadi apa yang akan kita lakukan?
00:05:52Kita akan berkata, hei, ini hebat.
00:05:55Tidak bisa mengetik.
00:05:57Maju.
00:05:59Jadi setelah 32 menit, itu telah menyelesaikan situs web kita.
00:06:01Kita mendapatkan empat adegan berbeda.
00:06:02Itu memakan 10 generasi.
00:06:04Dan sekarang sudah di host lokal kita siap untuk digunakan.
00:06:06Jadi mari kita lihat.
00:06:07Jadi inilah situs web wisata Jepang kita.
00:06:08Apa yang akan kita lakukan adalah kita hanya akan menelusurinya dan semacam melihat sekilas.
00:06:12Jadi orang yang bepergian, punya kereta bawah tanah.
00:06:15Kita pindah ke sini ke rumah.
00:06:17Itu terbuka.
00:06:19Kemudian mereka pergi ke hotel.
00:06:20Itu terbentang.
00:06:22Cukup keren.
00:06:23Dan kemudian kita punya burung di sini, yang mulai terbang.
00:06:28Jadi secara keseluruhan, apa yang saya suka?
00:06:30Apa yang tidak saya sukai?
00:06:31Saya suka visualnya.
00:06:32Seperti saya pikir ini terlihat sangat keren.
00:06:34Anda tahu, saya pikir secara individu di dalam setiap adegan, saya suka bagaimana setiap adegan individu berkembang.
00:06:38Seperti bagian di mana kereta bawah tanah masuk.
00:06:41Luar biasa.
00:06:41Masalah saya di sini adalah transisi di mana kita pergi dari adegan satu ke adegan dua.
00:06:46Potongan yang cukup keras.
00:06:47Mungkin Anda ingin potongan yang keras.
00:06:48Agaknya, saya kira ada, ada semacam arahan kreatif di sana.
00:06:51Tetapi itu adalah sesuatu yang bisa kita ubah.
00:06:52Hal yang sama di sini.
00:06:53Saat kita pergi dari adegan dua, detail luar biasa, sejujurnya.
00:06:57Tetapi saat kita pergi dari adegan dua ke tiga, lagi, potongan keras lainnya.
00:07:01Dibandingkan adegan tiga ke empat, saya pikir ini adalah transisi yang luar biasa.
00:07:04Jadi ini terbuka.
00:07:06Boom.
00:07:06Mereka ada di hotel.
00:07:07Tetapi jika Anda menonton di latar belakang, perhatikan adegan nomor empat, seperti masuk ke dalam bingkai.
00:07:12Seperti pada awalnya itu kabur, muncul, memberikan seperti sangat seperti efek 3D ini.
00:07:17Dan memberikan kedalaman pada situs web.
00:07:19Dan kemudian itu dengan mulus bertransisi ke adegan empat.
00:07:22Seperti itu hebat.
00:07:23Jika ia memiliki itu saat pergi dari adegan satu ke dua dan dari dua ke tiga, saya akan sangat senang.
00:07:28Itu keluhan utama saya dengan ini.
00:07:31Tapi semuanya terlihat bagus.
00:07:32Dan bisa menambahkan transisi adegan semacam itu dan memperhalus, saya tidak berpikir
00:07:35akan terlalu sulit.
00:07:36Karena jika Anda membandingkan generasi itu, yang lagi-lagi adalah sole GPT 5.6, dengan apa yang kita buat
00:07:41di Claude Code, transisi adegan jelas sedikit lebih ramping di sini.
00:07:45Jadi ini adalah adegan satu, kan?
00:07:46Jadi hal-hal ini mendorong keluar dari atas dan itu seperti transisi mulus ke hal-hal tersebut
00:07:52menjadi seperti, yah, sedekat mungkin dengan mulus ke hal-hal yang menjadi kabel di sini.
00:07:56Hal yang sama di sini.
00:07:57Kita masuk.
00:07:58Oh, boom.
00:07:58Itu terbuka.
00:07:59Dan kemudian kita hanya pergi ke atas ke adegan berikutnya.
00:08:01Jadi adegan ke adegan dengan transisi Fable 5, saya pikir kita lebih baik.
00:08:06Hal yang sama di sini.
00:08:06Boom.
00:08:07Kita di sini.
00:08:07Zoom keluar.
00:08:08Adegan berikutnya.
00:08:09Jadi itulah keluhan utama saya.
00:08:11Saya pasti akan memberikan Fable 5 keunggulan dibandingkan sole 5.6 di sini.
00:08:15Tapi seperti, ini adalah satu tembakan, kan?
00:08:18Seperti dengan satu keahlian.
00:08:19Seperti saya sangat terkesan secara umum dengan seberapa baik keahlian itu telah, Anda tahu, dibuat.
00:08:25Ini luar biasa.
00:08:26Nah, pertanyaan selanjutnya menjadi, oke, ini adalah tontonan visual.
00:08:29Bisakah kita membuat ini menjadi situs web yang lebih fungsional tergantung pada apa yang Anda coba
00:08:33lakukan?
00:08:33Dan saya rasa itu sama sekali bukan masalah.
00:08:34Saya pikir masalah teknis membuat situs web pengguliran animasi seperti ini yang
00:08:38terlihat koheren dan tidak terlihat aneh dan tidak terlihat berkualitas rendah itu cukup sulit.
00:08:43Anda tahu, jika saya meminta Anda untuk melakukan ini sendiri, saya pikir Anda akan mengalami banyak kesulitan
00:08:46dan memakan banyak waktu untuk sampai ke sana.
00:08:47Dengan dasar semacam ini, saya pikir sangat mudah untuk kemudian seperti, oke, seperti apa yang kita lakukan
00:08:51dengan teksnya?
00:08:52Apa yang kita lakukan dengan CTA?
00:08:53Bagaimana kita sebenarnya menarik pengguna dari hero sampai ke?
00:08:56Itu seperti mengisi semacam formulir.
00:08:57Saya tidak berpikir itu terlalu sulit.
00:08:58Saya tidak berpikir kita seperti, Anda tahu, harus menemukan kembali roda di sana.
00:09:01Itulah yang dilakukan setiap situs web.
00:09:02Dan bisa menempatkan itu di atas apa yang kita miliki di sini, lagi, dengan Fable 5 dan dengan
00:09:065.6 sama sekali bukan tantangan.
00:09:09Dan fakta bahwa ini hanyalah satu keahlian dalam satu tembakan adalah sesuatu yang mengejutkan.
00:09:13Lagi, jika Anda ingin melakukan ini sendiri, tiga bulan lalu, enam bulan lalu, sembilan bulan
00:09:16lalu, itu semacam menyebalkan.
00:09:18Jadi lagi, shout out untuk Peter Wang untuk versi asli keahlian tersebut.
00:09:21Kedua versi, baik milik saya maupun miliknya, akan ditautkan di bagian bawah deskripsi ini.
00:09:24Dan seperti yang Anda lihat, ini sangat mudah.
00:09:26Anda benar-benar tidak perlu melakukan apa pun.
00:09:27Anda hanya perlu muncul.
00:09:28Anda perlu memanggil keahliannya.
00:09:29Anda perlu memberikan semacam arahan kreatif, dan itu akan langsung bekerja.
00:09:32Jadi itulah di mana saya akan benar-benar meninggalkan kalian untuk hari ini.
00:09:37Beri tahu saya, seperti biasa, apa yang Anda pikirkan tentang ini di komentar.
00:09:40Pastikan untuk memeriksa Chase AI Plus jika Anda ingin mendapatkan akses ke Master Cloud Code saya
00:09:43Kelas dan semacam pelajaran AI lainnya seperti yang satu ini.
00:09:46Dan selain itu, sampai jumpa.

Key Takeaway

Kombinasi penggunaan keahlian 'scroll world' dengan model AI seperti Claude Code atau GPT 5.6 memungkinkan pembuatan situs web animasi premium secara efisien langsung dari terminal.

Highlights

  • Pembuatan situs web dengan animasi gulir koheren dapat dilakukan dalam satu pengambilan gambar menggunakan keahlian 'scroll world' dari Peter Wang.

  • Proses pembuatan situs web sepenuhnya dikelola di terminal menggunakan alat AI seperti Claude Code dan GPT 5.6.

  • Data gambar dan video diproses melalui Higgs field MCP, memanggil model GPT Image 2 dan Seed Dance tanpa harus meninggalkan lingkungan terminal.

  • Pembuatan situs web untuk merek perjalanan Jepang dengan empat adegan membutuhkan sekitar sepuluh generasi media.

  • Penggunaan empat adegan merupakan titik optimal untuk menjaga biaya kredit Higgs field tetap efisien sambil menghasilkan pengalaman visual yang berkualitas.

  • Fable 5 menawarkan transisi antar-adegan yang lebih halus dibandingkan dengan GPT 5.6 saat menangani efek animasi gulir.

Timeline

Dasar Animasi Gulir dan Alat AI

  • Animasi gulir yang koheren merupakan hasil penggabungan beberapa bingkai video yang diproses melalui FFmpeg.
  • Keahlian 'scroll world' yang diinisiasi oleh Peter Wang mempermudah proses pembuatan animasi yang sebelumnya sulit dilakukan secara manual.
  • Perbaikan pada versi terbaru mencakup pengoptimalan anggaran untuk jumlah adegan dan peningkatan fitur untuk perangkat seluler serta SEO.

Pembuatan situs web premium yang menggabungkan beberapa animasi gulir memberikan pengalaman pengguna yang mulus. Proses manual yang rumit—seperti pengambilan bingkai satu per satu—digantikan oleh otomatisasi yang memanfaatkan kode open source yang telah dioptimalkan untuk efisiensi biaya dan kinerja seluler.

Alur Kerja Teknis di Terminal

  • Higgs field MCP berperan sebagai penghubung antara agen AI dengan model pembuatan gambar dan video.
  • Pengguna dapat melakukan autentikasi dengan menyalin URL MCP ke Claude Code atau Codex.
  • Sistem membimbing pengguna melalui langkah-langkah kreatif untuk memastikan setiap adegan saling terhubung dalam satu cerita.

Integrasi alat AI di dalam terminal memungkinkan pengguna mengakses model GPT Image 2 dan Seed Dance tanpa perlu antarmuka eksternal. Setelah mengonfigurasi Higgs field, pengguna hanya perlu memberikan arahan kreatif, dan sistem akan memvalidasi gambar sebelum melanjutkan ke produksi video penuh.

Demonstrasi Pembuatan Situs Web

  • Proses pembuatan situs web untuk merek perjalanan Jepang hanya memerlukan perintah 'forward slash scroll world'.
  • Pengguna dapat memilih antara empat hingga enam adegan, dengan empat adegan dianggap sebagai titik keseimbangan biaya terbaik.
  • Sistem memberikan estimasi total sembilan hingga sepuluh generasi media untuk menyelesaikan situs web.

Demonstrasi menunjukkan proses pembuatan situs web dari pemilihan gaya origami hingga persetujuan bingkai awal. Sistem secara otomatis menyarankan jumlah adegan dan memberikan estimasi waktu pembuatan yang konservatif sebelum memulai proses produksi video yang intensif secara kredit.

Evaluasi Hasil dan Transisi

  • Situs web hasil akhir mencakup empat adegan dengan transisi yang bervariasi dari potongan keras hingga transisi halus.
  • Fable 5 menunjukkan keunggulan dibandingkan GPT 5.6 dalam menangani kehalusan transisi antar-adegan.
  • Integrasi teks dan elemen fungsional seperti tombol ajakan bertindak (CTA) pada dasar animasi ini relatif mudah dilakukan.

Meskipun beberapa transisi antar-adegan menghasilkan potongan keras, kualitas visual keseluruhan tetap tinggi. Fable 5 terbukti lebih unggul dalam memberikan transisi yang mulus, namun kedua alat AI tersebut berhasil menciptakan situs web fungsional dengan cepat dari satu keahlian tunggal.

Community Posts

View all posts