arcadia
1.0.0
ยินดีต้อนรับสู่ Arcadia เครื่องจำลองละคร AI ยุคกลาง โปรเจ็กต์นี้เป็นการทดลองใช้เทคโนโลยี generative AI เพื่อสร้างประสบการณ์การเล่าเรื่อง ขณะเดียวกันก็หวังว่าจะเป็นตัวอย่างให้กับชุมชนขนาดใหญ่ที่ใหญ่ขึ้นเกี่ยวกับแนวทางปฏิบัติที่ดีที่สุดเกี่ยวกับวิธีใช้ generative AI API ต่างๆ
โปรดทราบว่าเวอร์ชันเสถียรล่าสุดจะโฮสต์อยู่ที่ https://www.generativestorytelling.ai เสมอ
Arcadia เน้นการใช้ LLM เพื่อสร้างเรื่องราวแบบแอนิเมชั่น โดยให้รายละเอียดเกี่ยวกับละครในราชสำนักที่คุณเลือก รายชื่อเพื่อนและครอบครัวของคุณ และดูพวกเขาทรยศ วางยาพิษ แต่งงาน และแทงกันเพื่อควบคุมอาณาจักร!
คำบรรยายจัดทำโดย GPT 3.5
พื้นหลัง 3 มิติมาจาก Blockadelabs
ภาพตัวละครถูกสร้างขึ้นโดย Dalle
คุณสมบัติที่กำลังจะมีขึ้น ได้แก่ การบรรยายข้อความเป็นคำพูด เพลง เอฟเฟกต์เสียง และความสามารถในการบันทึก แชร์ และเล่นซ้ำเรื่องราว
เพื่อให้แน่ใจว่าสิ่งนี้สามารถเป็นตัวอย่างให้กับผู้คนได้ ฉันได้พยายามที่จะลดการพึ่งพาบุคคลที่สามในโค้ดให้เหลือน้อยที่สุด และเพื่อให้ระบบการสร้างเรียบง่ายที่สุดเท่าที่จะเป็นไปได้ เมื่อมีตัวเลือกระหว่างการทำสิ่งต่าง ๆ ด้วยวิธีที่หรูหรา (เช่น Sass, OpenAPI) หรือวิธีง่ายๆ (ไดเร็กทอรีที่ใช้ร่วมกันของไฟล์ TypeScript) ก็ได้เลือกวิธีง่ายๆ แล้ว
โดยหลักการแล้ว หากคุณคุ้นเคยกับ TypeScript, Express และ HTML คุณควรจะสามารถเข้าใจฐานโค้ดได้
Svelte ถูกใช้ที่ส่วนหน้า หากคุณไม่คุ้นเคยกับ Svelte มันเป็นชุดเครื่องมือขั้นต่ำมากสำหรับการผูกข้อมูลใน HTML พื้นฐานสามารถรับได้ภายในเวลาไม่ถึงหนึ่งชั่วโมงด้วยบทช่วยสอนแบบเต็มที่ใช้เวลา 2 หรือ 3 ชั่วโมงสูงสุด แม้ว่าคุณจะไม่รู้จัก Svelte แต่ก็หวังว่าโค้ดส่วนหน้าจะยังคงเข้าใจได้ง่าย
รหัสแบ่งออกเป็นสามโฟลเดอร์:
โฟลเดอร์ shared เชื่อมโยงกับโฟลเดอร์ backend และ frontend ซึ่งเป็นเคล็ดลับที่ดีที่ช่วยให้สามารถแชร์ประเภทและโมดูล TypeScript ระหว่างโปรเจ็กต์โดยไม่ต้องตั้งค่า mono-repo แบบเต็ม หากคุณใช้ Windows เวอร์ชันเก่า (ก่อน Windows 10) คุณอาจต้องเปิดใช้งาน symlink ด้วยตนเองสำหรับบัญชีที่ไม่ใช่ผู้ดูแลระบบในระบบของคุณ
แบ็กเอนด์คือเซิร์ฟเวอร์ Express.js แบบขั้นต่ำที่สาธิตวิธีแจ้ง GPT เพื่อให้ตอบกลับอย่างมีโครงสร้าง จากนั้นจึงแยกวิเคราะห์คำตอบเหล่านั้น มีตัวอย่างการดึงข้อมูลจาก GPT สองตัวอย่าง ตัวอย่างหนึ่งไปที่ตำแหน่งข้อมูล REST สำหรับการแชท และตัวอย่างที่สองแสดงการตอบกลับแบบสตรีมสำหรับการแชท ในทั้งสองกรณี ผลลัพธ์จะถูกส่งจากเซิร์ฟเวอร์ผ่านซ็อกเก็ตเว็บไปยังเว็บไคลเอ็นต์ส่วนหน้า
เพื่อให้แบ็คเอนด์ทำงานได้ คุณจะต้องสร้างไฟล์ .env ของคุณเองโดยมีคีย์ OPENAI_API_KEY อยู่ในนั้น หากคุณต้องการบันทึกเรื่องราว คุณจะต้องเพิ่ม AWS_ACCESS_KEY_ID และ AWS_SECRET_ACCESS_KEY ด้วย โปรดทราบว่า vultr น่าเศร้านั้นมีการเข้ารหัสแบบฮาร์ดโค้ดในฐานะผู้ให้บริการ s3 ซึ่งจำเป็นต้องแตกไฟล์ไปยังไฟล์ env ด้วยในบางจุด
ส่วนหน้าเป็นเว็บแอป Svelte ที่รวบรวมชื่อของสมาชิกของราชสำนัก ส่งไปยังแบ็กเอนด์ และเมื่อมีการดึงเรื่องราว จะทำให้เคลื่อนไหวในคอมโพเนนต์ Dialogue.svelte
ประเภททั่วไปและฟังก์ชันยูทิลิตี้อยู่ใน shared ใช้เป็นหลักสำหรับประเภทข้อมูลที่แชร์โดยส่วนหน้าและส่วนหลัง
เนื่องจากปัญหาด้านการสร้างบนระบบปฏิบัติการบางระบบ น่าเสียดายที่ตอนนี้แบ็กเอนด์มีฮาร์ดสำเนาของประเภทที่ใช้ร่วมกัน จำเป็นต้องหาคำตอบว่าทำไมระบบไม่รับการเชื่อมโยงแบบสมมาตรบน MacOS
ในการรันโปรเจ็กต์ ให้ทำดังต่อไปนี้:
backend ให้สร้างไฟล์ .env และเติมด้วย OPENAI_API_KEY= แล้วกรอกคีย์ของคุณbackend และ frontend shared ให้ทำการ npm install และ npm buildfrontend แล้วป้อน npm run dev ที่จะเริ่มต้น vite และคุณสามารถเชื่อมต่อกับ http://localhost:5173/ เลือกทั้งสองช่องทำเครื่องหมายด้านบนและ แล้ว make some drama 
ก. หากต้องการเปลี่ยนเรื่องราวที่สร้างไว้ล่วงหน้าที่จะแสดง คุณสามารถเปลี่ยนดัชนีในบรรทัดที่ 14 ของ StoryFetcherws.ts
`const events = parseOutEvents(pregenStories[2].story);`
backend แล้วป้อน npm run dev เมื่อเรียกใช้ส่วนหน้าในเครื่อง ส่วนหน้าจะพยายามเชื่อมต่อกับส่วนหลังบน localhost โดยอัตโนมัติnpm run debug บนแบ็กเอนด์เพื่อรันโหนด node --inspectคุณสมบัติที่จะเกิดขึ้น:
