Interactive Lesson: How to Create an H5P Game Map H5P Game Map (ဂိမ်းမြေပုံ) ဖန်တီးနည်း အပြန်အလှန် သင်ခန်းစာ

Welcome! This lesson will guide you through creating an H5P Game Map. This content type allows you to place questions and challenges on an image or map, creating a guided learning path or game. ကြိုဆိုပါတယ်! ဒီသင်ခန်းစာက H5P Game Map (ဂိမ်းမြေပုံ) တစ်ခု ဘယ်လိုတည်ဆောက်ရမလဲဆိုတာ လမ်းညွှန်ပေးမှာပါ။ ဒီ content အမျိုးအစားက ပုံ ဒါမှမဟုတ် မြေပုံတစ်ခုပေါ်မှာ မေးခွန်းတွေ၊ စိန်ခေါ်မှုတွေကို နေရာချပြီး လမ်းညွှန်မှုရှိတဲ့ သင်ကြားရေးလမ်းကြောင်း ဒါမှမဟုတ် ဂိမ်းတစ်ခု ဖန်တီးနိုင်စေပါတယ်။

1. Watch the Video Tutorial ၁။ ဗီဒီယို သင်ခန်းစာ ကြည့်ရှုပါ

This video provides a complete visual walkthrough of the H5P Game Map editor. ဒီဗီဒီယိုထဲမှာ H5P Game Map editor အသုံးပြုပုံကို အစအဆုံး ပုံဖော်ပြထားပါတယ်။

2. What is a Game Map? ၂။ Game Map (ဂိမ်းမြေပုံ) ဆိုတာ ဘာလဲ?

It turns a simple image into an interactive game board. Users click on hotspots (like castles, cities, or steps) to unlock questions, videos, or text. They often must answer correctly to advance. It’s perfect for: ဒါက သာမန်ပုံတစ်ပုံကို အပြန်အလှန်တုံ့ပြန်နိုင်တဲ့ ဂိမ်းကစားကွင်းတစ်ခုအဖြစ် ပြောင်းလဲပေးပါတယ်။ လေ့လာသူတွေက မေးခွန်းတွေ၊ ဗီဒီယိုတွေ၊ ဒါမှမဟုတ် စာတွေကို ဖွင့်ဖို့အတွက် hotspots (ဥပမာ ရဲတိုက်တွေ၊ မြို့တွေ၊ ဒါမှမဟုတ် အဆင့်လှေကားတွေ) ကို နှိပ်ရပါတယ်။ ရှေ့ဆက်တိုးနိုင်ဖို့ အဖြေမှန်ကို ဖြေဆိုရလေ့ရှိပါတယ်။ ဒါက ဘာတွေအတွက် ကောင်းလဲဆိုတော့:

• Creating branching scenarios. လမ်းခွဲဇာတ်လမ်းတွေ ဖန်တီးဖို့။
• Gamifying a topic or module. ခေါင်းစဉ်တစ်ခု ဒါမှမဟုတ် module တစ်ခုကို ဂိမ်းပုံစံ ပြောင်းလဲဖို့။
• Virtual tours or escape rooms. Virtual tour တွေ ဒါမှမဟုတ် escape room တွေ ဖန်တီးဖို့။

3. How to Create Your Own (Step-by-Step) ၃။ ကိုယ်တိုင် ဖန်တီးကြည့်ရအောင် (အဆင့်ဆင့် လမ်းညွှန်)

Creating a Game Map involves a few key stages. Game Map တစ်ခု ဖန်တီးတာမှာ အဓိက အဆင့်အနည်းငယ် ပါဝင်ပါတယ်။

1. Find the H5P Editor:H5P Editor ကို ရှာပါ: Log in to your website and navigate to the H5P content area (e.g., “Content Bank,” “H5P Content”). ကိုယ့်ရဲ့ website ထဲကို login ဝင်ပြီး H5P content area (ဥပမာ “Content Bank,” “H5P Content”) ကို သွားပါ။
2. Add New Content:Content အသစ် ထည့်ပါ: Click the “Add new” button. From the list of content types, select Game Map. “Add new” ခလုတ်ကို နှိပ်ပါ။ ပေါ်လာတဲ့ content အမျိုးအစားတွေထဲက Game Map ကို ရွေးပါ။
3. Upload Background Image (Step 1):နောက်ခံပုံ တင်သွင်းပါ (အဆင့် ၁): The first and most important step is to upload your map or background image. This is what your users will navigate. ပထမဆုံးနဲ့ အရေးအကြီးဆုံးအဆင့်ကတော့ ကိုယ့်ရဲ့မြေပုံ ဒါမှမဟုတ် နောက်ခံပုံကို upload တင်ဖို့ပါပဲ။ ဒါက လေ့လာသူတွေ သွားလာရမယ့် နေရာပါ။
4. Create the Map (Step 2):မြေပုံ ဖန်တီးပါ (အဆင့် ၂): Click the “Map” tab. You will see your image. “Map” tab ကို နှိပ်ပါ။ ကိုယ့်ရဲ့ပုံကို တွေ့ရပါမယ်။
5. Add Nodes (Hotspots):Nodes (Hotspots) တွေ ထည့်ပါ: Click on the image where you want to add a stage or level. This creates a ‘node’. အဆင့်တစ်ခု ဒါမှမဟုတ် level တစ်ခု ထည့်ချင်တဲ့နေရာကို ပုံပေါ်မှာ နှိပ်လိုက်ပါ။ ဒါက ‘node’ တစ်ခု ဖန်တီးပေးပါလိမ့်မယ်။
6. Add Content to Nodes:Node တွေထဲ Content ထည့်ပါ: Click the ‘Edit’ icon on a node. Here you can add any H5P content type as the challenge for that stage (like a Multiple Choice, Drag the Words, or a Video). Node တစ်ခုပေါ်က ‘Edit’ icon ကို နှိပ်ပါ။ ဒီနေရာမှာ အဲဒီအဆင့်အတွက် စိန်ခေါ်မှုအဖြစ် ဘယ် H5P content အမျိုးအစားကိုမဆို (ဥပမာ Multiple Choice, Drag the Words, ဒါမှမဟုတ် Video) ထည့်သွင်းနိုင်ပါတယ်။
7. Connect the Path (Optional):လမ်းကြောင်းများ ချိတ်ဆက်ပါ (ရွေးချယ်နိုင်): You can drag lines between nodes to create a specific path, so users must complete Level 1 before unlocking Level 2. Level 1 ပြီးမှ Level 2 ကို ဖွင့်နိုင်အောင်၊ node တွေကြားမှာ လမ်းကြောင်းဆွဲပြီး သီးခြားလမ်းတစ်ခု ဖန်တီးနိုင်ပါတယ်။
8. Save and View:Save (သိမ်းဆည်း) ပြီး ကြည့်ရှုပါ: When finished, scroll to the bottom and click “Save” or “Create.” ပြီးသွားရင် အောက်ဆုံးကို ဆင်းပြီး “Save” ဒါမှမဟုတ် “Create” ကို နှိပ်ပါ။

4. How to Embed Your “Game Map” ၄။ ကိုယ့် “Game Map” ကို Website မှာ ဘယ်လိုထည့်မလဲ

Just like the other H5P content types, your platform will give you a shortcode to embed your new activity. တခြား H5P content အမျိုးအစားတွေလိုပဲ၊ ကိုယ့် platform က ဒီ activity အသစ်ကို ထည့်သွင်းဖို့ shortcode တစ်ခု ပေးပါလိမ့်မယ်။

It will look just like the new example you provided: သင်ပေးထားတဲ့ ဥပမာအသစ်နဲ့ တူပါလိမ့်မယ်:

When you put this code into your page editor, your website will show the interactive “Game Map” activity (with ID “5”) in that spot. ဒီ code ကို ကိုယ့် page editor ထဲ ထည့်လိုက်တဲ့အခါ၊ website က ဒီနေရာမှာ (ID “5” ရှိတဲ့) interactive “Game Map” activity ကို ပြသပေးမှာ ဖြစ်ပါတယ်။