Smart Builder Presented By Smruti Shah

Transcription

1 Smart Builder Presented By Smruti Shah 1

2 Table of Content Sr.No Topic Pg.No 1 Introduction 3 2 Pre-workshop Preparation 4 3 Classroom Design 6 4 Session Plan 7 5 Content Analysis 11 6 Appendices Handout Steps to Be Followed Sheet 35 2

3 Introduction Smart builder is a tool which can be used to create interactive learning objects. You can add rich media, gaming elements, scenario branching and powerful assessment options. Community version of Smart Builder is completely free, however you cannot download final learning object, and it remains on the cloud hosted by Smart Builder. You can share learning objects using the link generated or embedding it in website. The workshop will focus on introducing this tool to learners for creating learning objects with basic interactivity. You can visit: for accessing the tool. 3

4 Pre-Workshop Preparation: Finalize names of the group, based on the topic on which learners are expected to create learning object during the session. Nine topics included 1. Multiple Intelligence 1 2. Multiple Intelligence 2 3. Bloom s taxonomy 4. ADDIE Model 5. Maslow s Needs of Hierarchy 6. Communication Cycle 7. Cognitive Development 8. Sampling Techniques 9. Laws of Perception Find two images for each topic, one for title page and one for main content page, make sure to edit the image for content page such that no label or written information should be visible, as learners will be providing interactive labels and information on mouse actions. Example 1: MI-1 Title Page Main Content Page Example 2: Maslow s- Title Page Main Content Page 4

5 Register on Smart Builders with IDs as many number of topics, nine in my case and upload images on media and assets of each cloud with one topic. Also include option of for background for learners to choose from. Make note of -id, it s password and topic uploaded on each ID. example: Sr.No IDs Password for SB Topics 1 educationaltechnology0 Password as ed MI1 (4) 2 ictexplorer01 Password as ed MI2 (4) 3 theoriesoflearning01 Password as ed Bloom s Taxonomy (6) 4 technosavy02 Password as ed Maslow s Hierarchy (5) 5 mobilelearner01 Password as ed ADDIE Model (5) 6 technologyrules0 Password as ed Communication Cycle (4) 7 technologyeducation02 Password as ed Laws of Perception (5) 8 educationimplication@gmail.com Password as ed Stages of Cognitive Development 9 researchineducation27@gmail.com Password as ed Sampling Techniques (4) Prepare document with information on each topic, which can be used by learners to copy information and paste it on smart builder during the session. Prepare set of chits with each topic. Number of sets depend on number of participants in each group. For example, if 3 participants are working in a group, prepare 3 set of chits with each topic. On the Day of workshop: 1. Place all the chits in the bowl which will be used during session. 2. Create a computer name (same as your topic name), place Steps to be followed sheet (attached in appendices section of Manual) and chit of paper with Computer Name, ID for topic and password for each ID, example : Multiple Intelligence educationaltechnology0@gmail.com Password- password as ed 3. Upload documents of topics on every computer as per its name. 4. Set up classroom as designed. 5

6 Class Design 6

7 Session Plan-Smart Builder Total Time- 90 Minutes Material Required: Working computers with internet connectivity for each pair. Sr.No Topic Objective Activity Duration Learner s will be able to: Name Presenter s Role Learner s Role In (Mins) 1 Introduction Explain what is Smart-Builder Verbal Introduction Show presentation consisting of slides of content outline and objectives, with basic introduction. View the presentation and take notes if required. 5 2 Logging-In, Launching Application, Basic Interface and Examples. Visit the site Log-In Launch the application Demonstration from Presenter s computer. Visit the website and show participants how to log-in and launch the application. Show them example of learning object already developed. Watch the steps followed by presenter and take down notes if required. 8 3 Ice-Breaking- Group formation: A bowl with chits will be passed around to participants. Each participant will pick up one chit and find the computer with name of the mentioned topic. There will two participants on each computer. 7 7

8 4 Creating New Lessons, Add Images and Text and New Page to Canvas. Demonstration: Create New Lessons. Add Images on Canvas Add Text to Canvas Add new Page Demonstration and Practice Presenter will show Participants how to create new lesson and basic interface of canvas. Also show how to add images in text. Watch the demonstration by presenter and practice in pair. 30 Participants will be facing presenter, and watch how new lesson is created (1 min), how is image added (3 mins) and adding and formatting text (3 mins). Presenter will also show Participants how to add pages on canvas (2 Mins). Pairs will create a title page, as per topic given to them with images already uploaded in their respective account cloud. Participants will be informed to choose the image titled, TITLEPageImage. They would add image and format text, Text to be typed will be their Topic. They would then create new page, and add image. Participants will be asked to add image titled, Page1Image on canvas. Texts would be randomly added with related topics. Participants will be provided text in a note pad for copy pasting on computer. 5 Adding Action and Response. Create Hot- Spot. Give Response for action of RollOn. Give Response for action of OnClick Demonstration and Practice. Presenter will show participants how to create hotspots, give actions and responses. In brief they would also be explained importance of previsualizing action and Participants will watch presenter s demonstration and listen to participant s explanations. 30 8

9 Give Response for action of RollOut response. Example, suppose on mouse roll over, I want certain text to appear, and on click some different action. After this, what should happen after that hiding of text box. A small paper with steps to be followed written on it will be provided. Demonstration: Participants will be shown how to create hot-spot and preview it s effect (2 mins). Explanation different kinds of possible actions, visualizing their actions, and response (2 mins). Setting visibility, giving action of OnRollOver and OnClick (4 Mins). Importance of hiding on ROllOut, giving action and response of RollOut (2 Mins). Participants will then give consider text they have copy pasted from notepad, in previous demonstration, set it s visibility, to hidden in start, followed by give actions of mouse onrollover, OnClick, and OnRollOut. They would also keep previewing their objects in between. (15 Mins). 6 Conclusion - Verbal Conclusion Presenter will conclude by showing participants how to share and publish their learning objects once completed and how can they use it for creating learning objects. Followed by Participants will listen to presenter. Ask questions/ clear their doubts. 10 9

10 summarization of session. Solve the doubts of participants, and explain summative evaluation s activity. Back Up Activities: If time permits, participants can also be explained how to create drag and drop object, though they wouldn t really be able to practice it. Summative Evaluation: Create a learning object on Smart Builder application on topic of your choice and it to presenter. 10

11 Content Outline 1. Introduction 2. Smart Builder 3. Example Parts of Brain 4. Features and Actions 5. Demonstration 6. Conclusion Learning Objectives After this session learners will be able to Content Analysis 1. To create new lesson on Smart-Builder 2. To add and format images and text on Smart-Builder Canvas 3. To create Hot Spot 4. To give response actions of mouse RollOver, OnClick and mouse RollOut 5. To publish and share Learning object 11

12 Introduction: Elearning is becoming trend in education, where learners can access their learning material using some electronic medium, like tablet, mobiles, computers or even television. There could be telecast of educational program on television or radio, or educational CD for computers, and lately, we have access to learning content on internet, where content is uploaded on particular site, and students with ID and password can access it. Smart builder is a tool, which can be used to develop learning objects for accessing online. In this session, we will be learning how to create small objects using smart builder. Smart Builder: Website: For this session, we have already logged into the application, but this is how you can log in. On top right you have an option to sign up. Click on it and fill up all the required fields and click on sign up. After this you can Log in, using your ID and password, which you have received in your . YOU WILL GET PASSWORD, in your . Once you have logged in, you will have to click on launch application 12

13 We have already launched it for you, and you all can see this page: Example - Parts of Brain I will first begun by showing you some content I have developed, using Smart Builder, I need to click on My published content on left panel, and on lesson below it, to see all your content which you have completed developing. 13

14 I can then click on the lesson, I wish to view and then click on View on top. 3 rd Window will pop-up which will have your lessons. This is my title page, I will go on to second page, where you can see image of brain. If I bring my mouse on any of it s part, I get a text having name of it s part, and if I click on it, I will get some information about it. 14

15 Next, what we can do is, click on small arrow, here next what we can do is click on the small arrow in the bottom to go on the next page where you can see options of drag and drop. You can see page of drag and drop here, where different parts are written on top, and learners will have to drop it at correct place. 15

16 You can click on name of the part of brain and drop it in correct box You will get green tick, if you drop it in correct place 16

17 And Red Cross for Wrong answer Features and Actions During this session, we will learn how to create such learning objects. However if you have observed, we have considered several actions in this example for purpose of interactivity. 1) Slide 1 1. Adding Images 2. Adding Texts 2) Slide 2 1. Adding Hot Spot 2. Roll Over 3. On-Click 4. Double-Click (Optional) 5. Roll Out 17

18 3) Slide 3 1. Drag-N-Drop 2. Feedback- Correct and Wrong 3. Final Feedback However in this session, we only focus on few of these features, due to time constraint, and make interactive learning objects, with actions of Roll Over, On-Click, and Roll Out along with basic features of adding images, adding objects- text and shapes and adding hotspot. 18

19 Demonstrations Before we begun, let us know some things we need to do, before designing an learning object. 1) Creating New Lesson: Go on new lesson on home page Enter details about the lesson we are creating: and click on ok. You will get basic blank template of lesson, where you will be creating an object. 19

20 The basic interface, is simple like any other slide tools, or image editing tools, where you have panels on both side. On left panel, you will different tools, you could be using for creating your learning objects and in the right panel you would be having panels, of layers, properties and basic template. We will not move on two next step, of adding images. 2) Adding Images Images can be added by clicking on graphic tool on left panel: 20

21 Click on small arrow on graphic box, and chose an option to select media, You will get new window pop-up, where in you can select media, images you have already collected, OR upload new one, with an option on top left, as it s yellow highlighted. If you chose to upload you have one more screen: 21

22 However for this session, you all, already have an uploaded images in your gallery, chose the image, of your group name. (I will keep images uploaded, to save time here in the gallery of each account, with group name of content they will be creating, or maybe numbered and things will be in demo). Chose the image and then click on select. Image will appear on your slide. You can resize it, and rotate it using the scaling options. Along with it next we will see how to add texts. 22

23 3) Adding Texts Once again on left panel, just above graphics you will have an option of adding text there, and just click on it. Text box will appear on the slide, You can move and resize the box. You can choose the font, size, and color for text from above panel: Now if you wish to add text in the box then you will have to use properties option in the side panel, which gives additional option to change properties or wish to give rotation to the text, as per requirement of your content. 23

24 4) Adding New Pages: On top towards left there is an option of pages, you can inset the page from here by clicking. Type the name of the page: and clicking Ok. I am going to type objectives here. And I get a new page, where again I will add images and texts, to make it look better. 24

25 On top you can see, names and page number, which can be used. And also there is an option of edit, clicking on where you will get an option to delete or change sequence of the pages. 5) Creating Hotspots: Creating Hot spot: Here am just adding an image, which has two coloumns. And each coloumn has list. We would have an interactive activity, where a learners can bring mouse over different parts of image and it should get come out with some details about that factor. Click on this empty dotted square on left side and create a rectangle at required part of image, you can scale the highlighted area using scaling Then click on preview on top panel, and roll your mouse over the hot-spot area, where regular pointer will turn into hand, indicating hot spot has been added. showing in screenshots, but if you bring your mouse on Setup for Learning the mouse pointer will change into hand. 6) Creating mouse roll-over effect: Add an image that can describe the Factor. (not In the Properties section of image, untick Start Visible. 25

26 Now click on small arrow on top of the hot spot area, and click on Create Action (or just take your mouse over the option). Then click the option onrollover. You will get new window, consisting of Object selected and response option. Click on response, find the object which should respond- followed by chose the Response it should give on action. Here I want, my image Set-Up-For learning to show up when a learner brings over Set Up for Learning on image. Click on OK. Once again click on preview in top panel, and bring your mouse on set up for learning, 7) Adding response for Action of OnClick For which I have added text and fill to text from Properties. You can name the text box, and untick Star Visible. Add text fill option and with colour of your choice. Once again go on small arrow, on top of 26

27 hotspot, and Create Action. Chose on click. Once again a pop-up box will open, choose response, of Show. Click OK. Once again Preview, the whole slide to confirm, the working of an action. 27

28 8) Hide on RollOut Once again, imagine, of having it seen, and after roll out, if text doesn t hide, it will make slide look messy with too many texts. Hence, we need to make sure, that text and image hides on roll out of mouse. Here we need to get two responses for single action. Let s see how do we go about it. First click on small arrow of hotspot given. Choose Create Action and then, OnRollOut. A pop up will open. Click on response and chose the object, which needs to response, and then click on Hide. Click OK. After this you can once again create an action, and chose a response for an image to Hide : Once again Preview, the whole slide to confirm, the working of an action. 28

29 By take the mouse over set up for learning, and click on it. Now take the mouse away from the selected section. IN this way you can give action and responses for these every factor, and create an object, where students can use it. 9) Share and Publish: Once you complete the whole learning object, by giving the action and response, let us see, how to publish the content and share the link with your students/ learners. You can click on File on top panel, and click on Save and Publish. After this add some description, and click on OK. Published lessons will appear in the cloud section for it, on Left Panel: 29

30 Click on lessons you wish to share with Learners, and click on the option of share on top panel. A link will appear, you can embed the flash object on your website or share the link for students to access the learning object. 30

31 Conclusion Smart Builder has many more features, which you can use for making your learning objects interactive, like the one we had seen of drag and drop, you can create quizzes, and feedback options. You can also give sound effect for every correct answers and wrong answers, which can add motivation for learners. I hope you enjoyed the session, would find smart builder useful for creating some interactive learning objects. 31

32 Appendices (Next Pages) Handout (Next Page) 32

33 Smart Builder Workshop Conducted by Smruti Shah On December 11, 2015 Smart builder is e-learning lesson authoring tool, i.e. you can create interactive lessons, with rich multimedia, gaming elements, branch scenarios and powerful assessments, for e-learners. Smart builder is free for community editions, which will allow you to create single learning object and share the objects with your learner, through link generated for lesson or by embedding it in your own website. Visit website: You can sign up for Smart Builder by clicking on Sign Up option on top right of the page. You will be asked basic details about yourself, which you can enter. Password will be sent you on your registered . Click on Log-In on same page on top right and enter your ID first, on clicking Continue you will be asked to enter password, which has been sent to your (Changing password is not possible in smart builder, hence make sure you keep the confirmation and note down the password). Once you log-in, you will be directed to a page, which has one green button in middle with Launch SmartBuilder, click on the button, new window will open. This window is your smart builder cloud, which will save all your learning objects and media. Every time you launch smart builder a pop-up will appear, (unless you Untick on show on every start up), which can direct you to it s tutorial. You can click on Video Tutorials, for detailed videos on how to create different interactive elements on Smart Builder. Or you can log onto: These tutorial videos are also available on You Tube, which consists of all the tutorial videos. 33

34 During the workshop, we focused on creating adding and formatting images and texts and giving basic interactivity like Mouse RollOver, RollOut, & OnClick. You can explore other features of Smart Builder through it s tutorial videos, like Drag N Drop, Creating quizzes, gaming elements, etc. Create one learning object which includes ATLEAST basic interactivity of creating actions and response on Mouse onrollover, onrollout, onclick, & ondoubleclick on topic of your choice. Share the link of published lesson, on my addresssmrutishah2014@det.sndt.ac.in and I will get back to you with feedback on your learning object. 34

35 Steps to be followed Page: Note: this page is to be provided only during workshops, as it focuses only on steps to be followed by Participants. Participants are however expected to explore other features of tools on their own. SESSION 1: Steps to be followed for creating Lesson: 1. In drop-down menu on top-left select Master Page. 2. On right Panel, chose the background. You can set Background colour or any graphics as background. 3. Once again from drop down menu chose- Page 1 4. From tool bar on left side of screen, select Text and drag it to Canvas, You can edit text with title of your lesson. You can format text from top panel option- of choosing colors and size. On right panel, you will find an option for Graphic Effects. 5. Select on Image tool, and bring it on canvas. Click on small arrow on top and chose Select Media. Media has been uploaded for you, chose media meant for TITLEPG 6. Arrange Text and Image on canvas. 7. Click on Plus sign next to drop box and add pages to your learning object. 8. Now you need to be very careful while working on this page,( you can go on page 1 from drop box, and Copy the title text, if you want by pressing Ctrl+C and paste it on page 2). Now add graphic, and select media titled as PAGE1 or something similar, make it huge in size so every different object/ levels be clearly visible. 9. Go on text and drag and drop it on canvas and type out label for any level/object. BE SURE TO NAME from right panel, and use a name you can easily identify, preferable, (label_name)_l. 10. Be sure to untick, Start Visible option, which can be seen on right panel, below Name. 11. Now press Ctrl+C and Ctrl+V, replace the text with new label name and change the NAME from right panel. Continue this copy pasting till all levels/ Objects are labelled. 12. Now decide the place where you wish more detail and information you wish to display on click. Remember, you can Overlap information text on canvas. Copy paste information for each label from word document that is kept opened in your computers. REMEMBER TO UNTICK Start Visible and NAME The text box, with appropriate name that can help you remember it. You can copy paste the information text boxes and replace content, to maintain the format. 35

36 SESSION 2: 1. Create Hotspot by clicking on dotted square tool from right panel, and drag and drop it on canvas. Resize it as required by any part of image, and NAME the hotspot as per level from RIGHT Panel. 2. You can copy paste Hotspot to different parts of image, by Ctrl+C and Ctrl+V. MAKE SURE TO NAME THEM CURRENTLY 3. Once every part of image is covered with Hotspot, select one hotspot, and click on curved arrow located on right top of hotspot box, Create action: a. OnRollOver, a pop-up box will appear, chose response as Text of Label Show; and then click on OK. Give following response for every action. b. OnClick, chose response of text of information Show c. OnRollOut, chose response of text of information- Hide. 4. Repeat it for every hotspot that you have given. 5. You can preview it at certain intervals to confirm working of interactivity aspect of learning object. SESSION 3: Click on File on Top Left, and Click on Save and Publish. Once you have saved and published, close the canvas, and you can find your learning object in Published content on left side of home page. On top you can find, Share option, click on it, and a window will pop-up. Click on Generate the Code, You can share the link using first option to your learner, via, or you can paste it on learning management system, add link in document. Any learner with the link will be able to access your learning object. If anyone who knows coding can use second option and embed the learning object in their web-page/ website. 36

37 37