Anonymous

Changes

From Open Educational Resources
1,294 bytes added ,  12:14, 25 November 2024
m
no edit summary
Line 60: Line 60:  
[[File:01 Main Dashboad.png|center|thumb|900x900px|Image of main dashboard]]
 
[[File:01 Main Dashboad.png|center|thumb|900x900px|Image of main dashboard]]
   −
On the main dashboard, A new window will appear with two choices '''Open Existing File''' and  '''Create New H5P'''.
+
 
 +
<big>On the main dashboard, A new window will appear with two choices '''Open Existing File''' and  '''Create New H5P'''.</big>
    
[[File:Creating New Project New.png|thumb|883x883px|Image of creating new project |alt=]]
 
[[File:Creating New Project New.png|thumb|883x883px|Image of creating new project |alt=]]
Line 80: Line 81:     
[[File:04 Installing New packages.png|center|thumb|900x900px|Image Installing New packages]]
 
[[File:04 Installing New packages.png|center|thumb|900x900px|Image Installing New packages]]
 +
      Line 148: Line 150:     
=====Multiple Choice Questions=====
 
=====Multiple Choice Questions=====
[[File:06 MC Opt.png|thumb|457x457px|Adding details to multiple-choice questions interface.]]
+
[[File:06 MC Opt.png|thumb|673x673px|Adding details to multiple-choice questions interface.]]
 
First, we created a True or False content type. Now, let’s explore another example: '''Multiple Choice.'''  
 
First, we created a True or False content type. Now, let’s explore another example: '''Multiple Choice.'''  
 
   
 
   
Line 159: Line 161:  
'''3. Default Options''': By default, two options will be pre-loaded for you.
 
'''3. Default Options''': By default, two options will be pre-loaded for you.
   −
[[File:06.1Options.png|left|thumb|640x640px|Adding details to multiple-choice questions interface continued ]]
+
[[File:06.1Options.png|thumb|670x670px|Adding details to multiple-choice questions interface continued |alt=]]
 
'''4. Add New Option:''' If you need more options, click the "Add New Option" button at the bottom.
 
'''4. Add New Option:''' If you need more options, click the "Add New Option" button at the bottom.
   Line 183: Line 185:     
=====Fill in the blanks=====
 
=====Fill in the blanks=====
 +
[[File:Lumi Fillintheblanks1.png|thumb|673x673px|Adding title and question in fill in the blanks]]
 
After opening the Fill in the Blanks package, follow these steps to create or edit your questions:
 
After opening the Fill in the Blanks package, follow these steps to create or edit your questions:
   Line 188: Line 191:     
'''2. Enter the Text:''' Under the text block column, you'll find a text box labeled "Line of Text." Here, enter the entire sentence including the blank answer. For example: '''"The roots of a tree grow deep into the ground."'''
 
'''2. Enter the Text:''' Under the text block column, you'll find a text box labeled "Line of Text." Here, enter the entire sentence including the blank answer. For example: '''"The roots of a tree grow deep into the ground."'''
  −
<gallery mode="packed" heights="400">
  −
File:Lumi Fillintheblanks1.png|Fill in the blanks activity
  −
File:Lumifillintheblanks2.png|Fill in the blanks interface
  −
</gallery>
  −
      
'''Follow these steps to mark the blank answers:'''
 
'''Follow these steps to mark the blank answers:'''
Line 213: Line 210:  
The final question might look something like this: "The *roots/Roots:Hint: This part of the tree helps it stand tall and absorbs water from the soil* of a tree grow deep into the ground."
 
The final question might look something like this: "The *roots/Roots:Hint: This part of the tree helps it stand tall and absorbs water from the soil* of a tree grow deep into the ground."
   −
'''3. Behavior Settings :'''
     −
'''* Enable "Retry" Button:''' Allows users to retry if they give the wrong answer.
+
[[File:Lumifillintheblanks2.png|center|thumb|923x923px|Preview of fill in the blanks]]
 +
 
 +
=====Flashcards =====
 +
The Flashcards content type allows learners to engage with a set of cards, each containing a picture on one side and a corresponding text on the other. The learner is asked to type a word or expression that matches the picture before flipping the card to reveal the correct answer.
 +
 
 +
'''How to Create Flashcards'''
 +
 
 +
After opening the Flashcards package, follow these steps to create or edit your flashcards:
 +
 
 +
'''1. Title :''' To set the title , please refer to Steps in the True or False section.
 +
 
 +
'''2. Task Description:''' Use this option to provide a clear explanation of the task, helping the user understand what is expected and how they should answer.
 +
 
 +
'''3. Creating the Flashcard:'''
 +
 
 +
<nowiki>*</nowiki> In the card section, there are four available options. Let's say you want to show an image of a human brain and ask the user to identify it. First, you need to upload an image. Under the "Image" column, there is an option called "Add Image." Click on it, and it will prompt you to upload a relevant image from your computer. Select the image and click on "Select/Upload."
 +
 
 +
<nowiki>*</nowiki> Now that you have uploaded an image of the human brain, type your question in the question box, such as "Identify the following human body part."
 +
 
 +
<nowiki>*</nowiki> In the answer box, type "Brain." You can also include alternative answers by separating them with a forward slash ("/").
 +
 
 +
[[File:Flash cards 0.png|left|thumb|630x630px|image of creating a flash card]]
 +
[[File:Flash cards 1.png|thumb|665x665px|Preview of flash cards]]
   −
'''* Enable "Show Solution" Button:''' If the user answers incorrectly, they will see a "Show Solution" button after submitting their answer. Clicking it will display the correct answer.
     −
'''* Automatically Check Answer :''' This option automatically checks the answer as soon as it's clicked, eliminating the need for a "Check" button.
     −
'''* Case Sensitive:''' If enabled, the user must input the answer exactly as you have written it.
     −
'''* Require All Fields to Be Answered Before the Solution Can Be Viewed:''' Users must fill in all blanks before the hint is shown.
     −
'''* Put Input Fields on Separate Lines:''' This option allows users to enter their answers on separate lines.
     −
'''* Show Confirmation Dialog on "Check":''' Before submitting an answer, the user will be asked to confirm their submission, helping prevent accidental submissions.
     −
'''* Show Confirmation Dialog on "Retry" :'''  This works the same as the previous option but applies to the "Retry" button.
     −
'''* Accept Minor Spelling Errors:''' If activated, the answer will still count as correct even with minor spelling errors (1 error for 3-9 characters, 2 errors for more than 9 characters).
     −
'''4. Add New Question:''' To add a new question, click on the "Add New Text Block" button. The rest of the process is the same as outlined above.
     −
=====Flashcards =====
  −
The Flashcards content type allows learners to engage with a set of cards, each containing a picture on one side and a corresponding text on the other. The learner is asked to type a word or expression that matches the picture before flipping the card to reveal the correct answer.
     −
<gallery mode="packed" heights="400">
  −
File:Lumi Flashcard1.png|Flashcard settings
  −
File:Lumi Flashcard2.png|Flashcard 'view'
  −
</gallery>
     −
'''How to Create Flashcards'''
     −
After opening the Flashcards package, follow these steps to create or edit your flashcards:
     −
'''1. Title :''' To set the title , please refer to Steps in the True or False section.
     −
'''2. Task Description:''' Use this option to provide a clear explanation of the task, helping the user understand what is expected and how they should answer.
     −
'''3. Creating the Flashcard:'''
     −
<nowiki>*</nowiki> In the card section, there are four available options. Let's say you want to show an image of a human brain and ask the user to identify it. First, you need to upload an image. Under the "Image" column, there is an option called "Add Image." Click on it, and it will prompt you to upload a relevant image from your computer. Select the image and click on "Select/Upload."
     −
<nowiki>*</nowiki> Now that you have uploaded an image of the human brain, type your question in the question box, such as "Identify the following human body part."
     −
<nowiki>*</nowiki> In the answer box, type "Brain." You can also include alternative answers by separating them with a forward slash ("/").
     −
'''4. Behavior Settings:'''
     −
'''* Case Sensitive:''' If you enable this option, the user must input the answer exactly as you have typed it.
     −
'''* Require All Fields to Be Answered Before the Solution Can Be Viewed:''' The hint will not be shown until all fields are completed.
     −
'''* Randomize Answers:''' Enable this to randomize the order in which the answers are displayed.
     −
'''5. Adding More Flashcards:''' Once you’ve finished creating a card, you can click the "Add Card" button to add more flashcards or questions.
     −
'''6. Finalizing the Project:''' Once everything is done, your flashcard project should look something like this, with each card featuring a question and an image, ready for the learner to interact with.
      
===== Timeline=====
 
===== Timeline=====
 
The Timeline content type lets you arrange a sequence of events in chronological order. You can add images, text, and even assets from different internet web platforms.  
 
The Timeline content type lets you arrange a sequence of events in chronological order. You can add images, text, and even assets from different internet web platforms.  
<gallery mode="packed" heights="400">
+
[[File:Lumi TImeline1.png|thumb|600x600px|Image of creating a timeline]]
File:Lumi TImeline1.png|Timeline creation settings
+
'''How to Create a Timeline'''
File:Lumi Timeline2.png|Timeline creation settings
  −
</gallery>
  −
 
  −
'''How to Create a Timeline'''
      
Once you’ve opened the Timeline package in your H5P editor, follow these steps:
 
Once you’ve opened the Timeline package in your H5P editor, follow these steps:
Line 305: Line 290:     
Click to watch –  NC
 
Click to watch –  NC
 
+
[[File:Lumi Timeline2.png|thumb|600x600px|Continued image of creating a timeline]]
'''7. Creating the Timeline:'''
+
'''7. Creating the Timeline:'''  
    
'''* Dates:''' Expand the date column to input the dates for each event. Dates should be entered in the format YYYY, MM, DD. If you don't have the exact date, the year is mandatory.
 
'''* Dates:''' Expand the date column to input the dates for each event. Dates should be entered in the format YYYY, MM, DD. If you don't have the exact date, the year is mandatory.
Line 334: Line 319:  
'''Tips:'''
 
'''Tips:'''
   −
- For better understanding it is always recommended to use all the features one by one and preview your project after every step.
+
-For better understanding it is always recommended to use all the features one by one and preview your project after every step.or
 +
 
 +
 
 +
 
 +
For better understanding using '''Timeline,''' [https://cloud.itforchange.net/s/Csq5nna9qBptP4F Click here to watch the video]
      −
{{Note}} '''Difference Between Save and Export'''
+
==== Common behavior settings ====
    +
===== True or false =====
 +
#'''Enable "Retry" Button:''' Allows users to retry if they give the wrong answer.
 +
#'''Enable "Show Solution" Button :''' If the user answers incorrectly, they will see a "Show Solution" button after submitting their answer. Clicking it will display the correct answer.
 +
#'''Question Type:'''
 +
#* If your question has a single correct answer, choose "Single Choice" (Radio Button).
 +
#* If your question has multiple correct answers, choose "Multiple Choice" (Check Boxes).
 +
#'''Give One Point for the Whole Task:''' Enable this option to give a total of one point for multiple correct answers. This option is not available in "Single Choice" mode.
 +
#'''Randomize Answers:''' Enable this to randomize the order of the answers when displayed.
 +
#'''Show Confirmation Dialog on "Check":''' Before submitting an answer, the user will be asked to confirm their submission, helping prevent accidental submissions.
 +
#'''Show Confirmation Dialog on "Retry":''' This works the same as the previous option but applies to the "Retry" button.
 +
#'''Automatically Check Answer:''' This option will automatically check the answer as soon as it's selected, so there will be no need for a "Check" button.
 +
 +
===== Fill in the blanks =====
 +
#'''Enable "Retry" Button:''' Allows users to retry if they give the wrong answer.
 +
#'''Enable "Show Solution" Button:''' If the user answers incorrectly, they will see a "Show Solution" button after submitting their answer. Clicking it will display the correct answer.
 +
#'''Automatically Check Answer :''' This option automatically checks the answer as soon as it's clicked, eliminating the need for a "Check" button.
 +
#'''Case Sensitive:''' If enabled, the user must input the answer exactly as you have written it.
 +
#'''Require All Fields to Be Answered Before the Solution Can Be Viewed:''' Users must fill in all blanks before the hint is shown.
 +
#'''Put Input Fields on Separate Lines:''' This option allows users to enter their answers on separate lines.
 +
#'''Show Confirmation Dialog on "Check":''' Before submitting an answer, the user will be asked to confirm their submission, helping prevent accidental submissions.
 +
#'''Show Confirmation Dialog on "Retry" :'''  This works the same as the previous option but applies to the "Retry" button.
 +
#'''Accept Minor Spelling Errors:''' If activated, the answer will still count as correct even with minor spelling errors (1 error for 3-9 characters, 2 errors for more than 9 characters).
 +
 +
===== Flash Cards =====
 +
#'''Case Sensitive:''' If you enable this option, the user must input the answer exactly as you have typed it.
 +
#'''Require All Fields to Be Answered Before the Solution Can Be Viewed:''' The hint will not be shown until all fields are completed.
 +
#'''Randomize Answers:''' Enable this to randomize the order in which the answers are displayed.
 +
#'''Adding More Flashcards:''' Once you’ve finished creating a card, you can click the "Add Card" button to add more flashcards or questions.
 +
 +
 +
 +
'''Note:'''
 +
 +
# These check boxes should be checked according to your specific requirements. There's no need to check or uncheck all of them.
 +
# For better understanding, it's recommended to try checking and unchecking each option one by one and previewing the results.
 +
 +
[[File:Exporta.png|thumb|418x418px|An image of exporting Lumi ]]
 +
 +
 +
==== {{Note}} '''Difference Between Save and Export''' ====
 
'''Save:''' When you done the changes you've made are stored in the project file. If you share this project file with others, they will need to have the Lumi application installed on their devices to view or edit your packages. However, they won’t be able to interact with it.
 
'''Save:''' When you done the changes you've made are stored in the project file. If you share this project file with others, they will need to have the Lumi application installed on their devices to view or edit your packages. However, they won’t be able to interact with it.
   Line 345: Line 374:  
'''Recommendation:''' It is recommended to use the HTML file ( exported ) on a computer for better viewing and easier interaction.
 
'''Recommendation:''' It is recommended to use the HTML file ( exported ) on a computer for better viewing and easier interaction.
   −
<nowiki>====</nowiki> '''How to Export?''' &lt;nowiki&gt;
+
===== '''How to Export?''' =====
<gallery mode="packed" heights="400">
  −
File:Exporta.png|Exporting the lumi project
  −
</gallery>
   
1. Preview your project to ensure everything works as expected.
 
1. Preview your project to ensure everything works as expected.
  
54

edits