زه د ډیرو لوبغاړی RPG ویب پلیټ فارم جوړولو په اړه فکر وکړم ځکه چې زما وختونه د فلیش پراختیا په توګه دي. دلته ډیری آنلاین TTRPG اختیارات شتون لري (د ډیری غوره!) مګر د دوی څخه هیڅکله د دې لپاره چې زه غواړم چې څنګه لوبوي.
تاسو وګورئد ویډیوکله چې Deborah Ann Woll Jon Bernthal ته ښيي چې څنګه D & D کولی شي؟ (د 2M نظرونه لري!)
دا ډیر ښکلي دی. که زه کولی شي یو څه چې په دې ډول احساس کوي؟
د Idea
د انټرنېټ ډیزاین، د ډیرو لوبغاړي آنلاین rpg پلیټ فارم، د قواعدو په اړه رڼا، مګر د مشترکه تاریخو په اړه لوړ، د پایلو له خوا د D20 رول له خوا ټاکل کیږي.
زه تل د عشقد D & D ماډلونهد تفصيلات لټونونه او عصري داستانونه پلانونه د لوبغاړو لپاره کشف کړي لکه څنګه چې د دوی د شخصیتانو په اوږدو کې د کلمکیک فینال ته لاړ شي.
چیرته چې زه کولی شي د خلکو لپاره د خپل ماجراجویی ماډلونه جوړ کړي، د هر RPG ژانر لپاره، بیا د ګرځندهانو ته اجازه ورکړي چې د هغه ماجراجوییونو له لارې خپل ځانګړتیاوو ترسره کړي؟
کوم به د لوبو چلند وکړي؟ د لوبو ماسټرونه په لټه کې دي. که زه کولی شي د AI روزنه ورکړي چې د لوبو ماسټر وي؟ په واقعیت کې د یو ښه جوړ شوي ماجراجویی پلان (د انسان جوړ شوی دی!) چلولو لپاره چې د لوبغاړي لپاره خوشحاله وي او نه یوازې د ډوډۍ لپارهد Slop?
په پیل کې
زه د AI سره ډیری شیانو جوړولو سره تفریح وکړم (د وګورئ)د پروژې پیل). زه به زما د ترټولو غوره stack کارويD20Adventures.com په اړه، د UI لپاره د Tailwind سره د Next.js ویب اپلیکیشن (کیا دا حتی باید وايي؟) له خوا دد SDKد Gemini او A کارولد Convex ډاټاپه Vercel کې جوړ شوی.
او زه په پراخه کچه جوړ کړم، د کوډ چاپ کولپه Github.
د نمونوي
د نمونوي لپاره، زه په اصل کې د پوډکډ کې بیان شوي سټریو څخه پیل وکړم، یو رینجر په رات کې د جنگل له لارې چیرته چې په اوږدو کې د رطوبت غږ کوي، کوم چې په پایله کې یو خاوند وي.
زما هدف دا ده چې یو مختصر یو ټوکر ماجراجویی جوړ کړي او وګورئ که زه کولی شي د AI DM روزل شي چې په حقیقت کې د دې ماجراجویی لپاره یو کوچني لړ وکاروي. زه د پیژندنې په اړه یو کوچني کڅوړه جوړ کړم:
د نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږدې نږ
The Midnight Summonsد یو قدیم druid ملګري له خوا یو غریب رینجر ته د Valkarr جنگل د وحشيې ته وده ورکوي.
د ډیری آزموینې او غلطۍ وروسته، زه په پایله کې د بشپړ پیژندل کولو لپاره وساتي او دا په یوټیوب کې ورسیږي:
څنګه کار کوي
Landing Page
د ځمکه پاڼه یو لوی قهرمان انځور دی (د Midjourney سره د "د D20 د قدرت" پاملرنه جوړ شوی). زه د نوي CSS @starting-style قانون په کارولو سره په انیمیشن کې ځینې ساده چټک اضافه کړم:
.fade-in {
@apply opacity-100 transition-opacity duration-1000 ease-in-out;
@starting-style {
opacity: 0;
}
}
Authentication
د چټک پیل لوبوي، زه اړتيا لري د کاروونکي حساب. دا ده چې له امله د نامتو خلکو یا بوټانو له امله زما APIs کارولو لپاره ډیری پیسو لرو.کلینیکدا د کاروونکي مدیریت اضافه کولو لپاره خورا ساده کوي، او زه دوی په ټولو زما پروژو کې کاروي.
برسېره پر دې، زه د ټوکن کارولو څارنه لري چې زه د ټوکن سیسټم سره د کارولو محدود کولی شي، په کوم ځای کې چې تاسو د ډیمو څخه یو لوبې ترسره کولو لپاره ډیری ټوکن سره پیل کړئ، نو تاسو کولی شئ په داسې حال کې ډیر خریدئ.
The First Turn
کله چې کاروونکي د تیزیه پیل لپاره د ماجراجویی پاڼه ته ځي، لومړی څه چې ترسره کیږي، موږ د ډیمو ماجراجویی لپاره د معلوماتو لوستل، کوم چې یوازې یو ساده JSON فایل دی (لکه څنګه) په S3. په زما سیستم کې یو ماجراجویی ماډل یا پلان د لړ لړ څخه جوړ شوی دی، چې د LLM لپاره د لارښوونې سره یوځای شوي دي:
"encounters": [
{
"id": "broken-silence",
"title": "Broken Silence",
"intro": "Thalbern, a solitary ranger of the Valkarr woods, has always trusted the silence of the wilds more than the promises of men. Orphaned by border raiders and raised by the elves of the Valkrarr Forest, he has spent years living on the edge of Kordavos, guiding travelers, hunting for his own survival, and keeping his distance from the tangled politics of the city.\n\nYet on this night, a message delivered by a red squirrel bearing the unmistakable script of Wollandora, a trusted elven friend and druid, has drawn him from his hidden home. The note was simple and urgent: Meet me at the Old Standing Stones at midnight. The balance of the forest could depend on it.\n\nNow, as midnight approaches, Thalbern moves quietly through the dense undergrowth, guided by memory and instinct. It is dark with almost no moonlight coming through the forest canopy.\n\nSuddenly, the hush of the night is broken by a sharp crack. Something large has just stepped on a branch somewhere off in the distance.",
"instructions": "A perception check is appropriate if Thalbern investigates (low difficulty with a plus 3 modifier). If successful, he will determine it is a large creature that is approaching quickly. With a high roll (18+), he will determine it is an Owlbear. If combat ensues and Thalbern is below 25% health, Wollandora will intervene. If Thalbern avoids or defeats the Owlbear, or if Wollandora saves him, he proceeds to the Old Standing Stones.",
"image": "images/settings/realm-of-myr/the-midnight-summons/broken-silence-2.png",
"transitions": [
{
"condition": "If Thalbern successfully uses stealth to evade and proceeds cautiously towards the Standing Stones, go to meeting-at-stones.",
"encounter": "meeting-at-stones"
},
{
"condition": "If Thalbern fails a perception check, advance to owlbear-confrontation.",
"encounter": "owlbear-confrontation"
},
{
"condition": "If Thalbern fails any dice roll (including stealth, perception, or any other check), advance to owlbear-confrontation.",
"encounter": "owlbear-confrontation"
},
{
"condition": "If Thalbern does NOT successfully use stealth to evade, go to owlbear-confrontation.",
"encounter": "owlbear-confrontation"
},
{
"condition": "If Thalbern does nothing or takes no action, go to owlbear-confrontation.",
"encounter": "owlbear-confrontation"
},
{
"condition": "If Thalbern has a healthPercent of less than 50%, go to wollandora-intervention.",
"encounter": "wollandora-intervention"
}
]
},
{
"id": "owlbear-confrontation",
"title": "Owlbear Confrontation",
"intro": "From the direction of the sound, a little bit of eye shine glints in the shadows of the tree line. A hulking fifteen foot tall monster with the body of a giant bear and the head of an owl. As it crashes out from the undergrowth, it lets out a guttural squawk, clearly agitated and territorial.",
"instructions": "The Owlbear will attack. If Thalbern attempts an animal handling check (high difficulty) and succeeds, he can move past the Owlbear. If Thalbern wins initiative and attempts to hide, he can move past the Owlbear if he passes a medium difficulty stealth check. If Thalbern's health drops to a critical level, Wollandora appears and drives off the Owlbear, transitioning to 'wollandora-intervention'. If Thalbern defeats the Owlbear, describe his victory and transition to 'meeting-at-stones'.",
"image": "images/settings/realm-of-myr/the-midnight-summons/owlbear-confrontation.png",
"npc": [
{
"id": "owlbear",
"behavior": "Aggressively attacks any perceived threat. Will fight until heavily wounded or driven off.",
"initialInitiative": 1
}
],
"transitions": [
{
"condition": "Thalbern defeats the Owlbear, manages to evade it, successfully uses Animal Handling to pacify and move past it, or successfully rolls any other way to move past it.",
"encounter": "meeting-at-stones"
},
{
"condition": "Thalbern is reduced to critical health by the Owlbear.",
"encounter": "timely-rescue"
}
]
},
...
]
The First Reply
لکه څنګه چې موږ په ډیمو موډل کې دي، په بکسینډ کې هیڅ واقعي ماجراجویی نلري. دا کیدی شي کله چې لوبغاړی لومړی ځواب ورکوي. د هر ځواب سره، موږ دا چلند کوو که څه همformatNarrativeAction
د فابريکې کاروي چې د AI کاروي ترڅو ځواب ته ارزښت ورکړي ترڅو ډاډ ترلاسه کړي چې دا په تګلاره توګه درست دی، په درې شخص کې او د تبادلې یا نورو پروس اضافه کوي ترڅو دا په ادبی کلامي سبک کې ښه کار وکړي.
د فارمیټ کولو وروسته، ځواب به د سرور عمل ته ورسیږي. ځکه چې دا د ډیمو دی، موږ د دې لومړي ځواب ترلاسه کولو وروسته د ډاټاټا کې ماجراجویی جوړ کوو. کله چې دا ترسره کیږي، دا به د لوبغاړي ځواب پروسس لپاره د عادي جریان پیژندل کیږي.
Processing Player Responses
دprocessTurnReply
دنده د Convex، د S3 څخه د ماجراجویی ډاټا څخه د اوسني چڼاسکه لیږدوي، او د ځانګړي لټون او د کار د کارولو کارول کونکي مشخصوي.
د دې کنکشن سره، دا وروسته د AI کاروي ترڅو مشخص کړي که آیا د عمل پاملرنه ده (د لوبې ازمايښت په وخت کې زما پسر د رینجر سره د واورډر په اړه یو ناو) او، که دا دی، که آیا د ډیزاین رول په ميخانيکي توګه اړتيا ده (د مثال په توګه، د "اټاک رول" یا "ایټالټ چک") ، په ګډون د رول ډول او د هغه سختی.
موږ کولی شو دا سره دنده د تماس، چې موږ کولی شو د AI چې موږ غواړم چې د جوړ شوي معلوماتو ته ورسیږي، په دې صورت کې دrollRequirementSchema
:
import { z } from "zod";
export const rollRequirementSchema = z.union([
z.object({
rollType: z.string().describe("The type of roll required, e.g. 'Stealth Check'"),
difficulty: z.number().describe("The difficulty class (DC) for the roll"),
modifier: z.number().optional().describe("Bonus or penalty to the roll, e.g. +2 or -1"),
}),
z.null()
]);
export type RollRequirement = z.infer<typeof rollRequirementSchema>;
بيا موږ یو دنده لري چې د تفصيلي پروپیلن او سیسټم ته ورسیږي.generateObject
:
export async function getRollRequirementForAction(action: string) {
const prompt = `
Given the following player or NPC action, determine if a dice roll is required for the character to attempt the action. If a roll is required, return a JSON object with "rollType" (choose the most appropriate from the list below) and "difficulty" (a number between 5 and 25). If no roll is required, return the JSON value null (not a string).
Possible roll types:
- Perception Check
- Investigation Check
- Insight Check
- Stealth Check
...
Examples:
Action: "Try to sneak past the guards."
Result: { "rollType": "Stealth Check", "difficulty": 15 }
Action: "Attack the goblin."
Result: { "rollType": "Attack Roll", "difficulty": 12 }
Action: "Try to determine what the sound is."
Result: { "rollType": "Perception Check", "difficulty": 10 }
Action: "Say hello."
Result: null
Now, given the following action, determine the roll requirement.
Action: "${action}"
`;
try {
const result = await generateObject({
schema: rollRequirementSchema,
prompt,
});
if (
result.object &&
typeof result.object === "object" &&
"rollType" in result.object &&
(result.object.rollType === "null" || result.object.rollType === "none" || result.object.rollType === "")
) {
return null;
}
return result.object ?? null;
} catch (error) {
throw error;
}
}
کله چې د لوبغاړي ځواب د turn's story ته ورسیږي، که د کڅوړې رول ته اړتيا لري، موږ په Convex turn معلوماتو کې د کارتون حالت تازه کوو ترڅو ښيي چې دوی ځواب ترلاسه کړ، مګر د دوی turn نه بشپړ دی. دا update د UI ته د واقعي وخت کې تازه کوي چې د رول تفصيلاتو ښيي او د لوبغاړي ته د D20 رول کولو د بڼه ورکوي.
کله چې د کاروونکي رول، موږ دresolvePlayerRollResult
د سرور د عمل چې د پایلې د بصری نندارتون سره د نندارتون تازه کوي او د پایلو په اړه پروسیس لیکنه کوي. موږ هم یو بل AI دنده تماس لري چې په بل کې د ټولو ځانګړنو د روغتیا او حالت تازه کړي.
NPC Actions
کله چې د NPCs ځواب ته ورسیږي، موږ د لوبغاړو په توګه ورته نمونې پیژندل کوو، په دې صورت کې د AI به ځواب ورسیږي. هر لټونونه د NPCs انگیزه په اړه معلومات شامل دي او کله چې تر اوسه پورې د ماجراجویی روښانه سره یوځای شوي، امید چې د AI کولی شي یو ښه ځواب جوړ کړي، بیا خپل ځان ډیزاین رول او پایلې تازه کړي.
Training AI to Run RPGs
که تاسو کولی شئ په چټک کې د AI سره د لوبې سیشن چمتو کړئ، تاسو پوه شئ چې دا څومره چټک کولی شي د ریل څخه راځي.
امیدوارم چې د مناسب کنکشن، ځانګړي پاملرنې لارښوونې او جوړ شوي ډاټا فابریکه تماس وړاندې کولو له لارې، موږ کولی شو د تجربه ترلاسه کړي چې خوښ وي.
ډیری آزموینې او غلطیونه، د کنسول ریکارډ کولو او د لارښوونې بدلون لري. د مثال په توګه، کله چې پوښتنه وکړم چې څنګه چې د AI زما د ازموینې په یوه کې د نندارتون لارښوونې نه کوي، دا هغه څه دی چې د کورسور چټک زما سره وايي:
په خلاصه توګه، د LLM د انتقال لپاره د خپل واضح لارښوونې نه پیژندل کله چې یو شخصیت د اندیښنې چمتو کولو سره ناکام کیږي، په داسې حال کې چې د دې طرحې ناکامۍ او د دې ځانګړي سکرینګ لپاره د انتقال قواعدو سره ثابت شوي دي. دا د LLM له خوا وړاندې شوي منطق غلط غوښتنلیک شتون لري.
په خلاصه توګه، د LLM د انتقال لپاره د خپل واضح لارښوونې نه پیژندل کله چې یو شخصیت د اندیښنې چمتو کولو سره ناکام کیږي، په داسې حال کې چې د دې طرحې ناکامۍ او د دې ځانګړي سکرینګ لپاره د انتقال قواعدو سره ثابت شوي دي. دا د LLM له خوا وړاندې شوي منطق غلط غوښتنلیک شتون لري.
زه فکر کوم چې د AI په واقعیت کې چې دقیقا هغه څه نه کوي چې انتظار کیږي ممکن د تفریح برخه وي. زه فکر کوم چې موږ به پوه شي!
دلته یو مثال دی چېد نندارتونونو کې یو.
تاسو کولی شئ د دې پروژې لپاره بشپړ سرچینې کوډ وګورئد انټرنیټ کارپوه کارپوه کارپوه کارپوه