 I am Yash, these are my teammates Nikhil, Mayukh, Sutanya and we will be talking about Analyze students response to H5P submissions in Drupal8. These are the list of the topics we will be covering in our presentation, starting off. For our project we have focused on the teachers who put up interactive contents for the purpose of online education. There are many content developers who work with content management systems like WordPress, Drupal, etc. For the purpose of online education and many users worldwide interact with these contents. So the aim of our project is to provide these content developers with the data, interaction data that users, my users produce interacting with that activity so that these content developers can analyze their work and improvise the content. For our project we have focused on the content developers who use H5P to develop content and with Drupal as their platform. As you can see here this is a table that shows result data for a single H5P activity in Drupal. Each field here describes the single user response and as you can see the only data which we are available with is the name of the user starting and end time of the activity and the points of order. What we do not have here are the interaction details. Now H5P does provide us with these interaction details but all of them are lost and that is the main drawback of H5P module that we intend to work upon and that is the problem we face. So that brings us to the purpose of our project which is to develop a custom module for Drupal 8 that can capture and store the interaction details of an activity. Then according to the requests made by the content developers provide them with the details and also in a manner so that they can interpret it easily and thus help them analyze their work. So now I would like to pass it down to Nikhil. Good morning everyone. I would like to talk about H5P. H5P stands for HTML5 package. So what are the reasons for us using H5P? First of all, it's an open source community-driven project. It allows us to create and share rich interactive content online. Now it's cross-platform compatible. You can use it in your mobile devices. All you just need is a web browser and it will work. Now it helps in creating and sharing rich interactive content. There are various types of exercises available from which you can build your content. For example, you have course presentations, you have MCQs, quizzes, drag and drop exercises, etc. And it's reusable. Once you create a content in any website, you can use it directly and integrate with the other website. So it's reusable across websites. H5P has integrations with the popular CMSs like Drupal and WordPress. And the most important feature of H5P is that it facilitates the use of experience APIs or XAPIs. I'll cover that in the later slides. Now why Drupal? Drupal has a module H5P which allows us to create this H5P content in Drupal 8. Once we create a content in Drupal, we can embed it in IIT Bombay X, Moodle or any other educational platform. Now the technology that we have used are Drupal 8, H5P, XAPIs, Plotly and JSON. Now XAPIs is a new specification of learning technology that allows us to capture data about experiences of activities, both online and offline. Now the records that are captured are shareable, trackable and quantifiable. Now the technology that existed before XAPIs was SCOM. SCOM stands for shareable content object reference model. Now it had many shortcomings. Many of them are that it displayed only one result. Secondly, it worked online. It needed a web browser and whereas XAPIs don't require that, they overcome all these shortcomings. The structure of statements in an XAPI statement is of this form, noun, verb and object. For example, I did this. Now this is a sample JSON file which stores the XAPI statement. As you can see here, the name is the noun here which is administrator. The object here tells us about the content ID and the choices available etc. And the verb here is the interaction that the user did with the content. So here he answered the question. So the verb is answered. The verb is answered and we can also see that it shows the details of results. Like the response number he chose, the duration he took, the score he got. Now this is our module with H5P that we developed for Drupal 8. Now what it basically does is it captures these XAPI statements and then convert into JSON objects, manipulate it and then save it in our database. Then through a form, we retrieve this data and display it in tablet and graphical manner. Now my friend Mayunk will show you how it's done. Good morning everyone. I am going to talk about basic skeleton of our module with H5P. Here you can see the basic files.info.yml, routing.yml, module, install, services.yml, library, links, menu.yml. These are essential files for any custom module you are going to create for Drupal 8. Then there is another JS folder in which it consists of three files. Plotly, latest, min.js, capture.js and graph.js. Plotly is the library we have used for plotting and graph visualization purposes. And capture.js and graph.js are two custom JavaScript libraries we have used. And another directory is source directory which consists of form generator files, database connection services and controller files. It is our workflow diagram. Here you can see this is Drupal core. It consists of Drupal's API and there is database connection service which ensures the connection between database and the Drupal core. And here is hook is implemented. Hook provides the platform for communicating between the custom modules and Drupal core. And hook consists of JavaScript library and H5P integration. JavaScript library does contain those two custom JavaScript files mentioned here, capture.js and graph.js. And H5P integration ensures that our module with H5P only captures except a statement from those pages where at least there is one H5P interactive content. Here is our VH5P module and here is H5P module. And it consists of interactive contents like MCQs, quizzes, interactive videos and so on. They are all stored in this content repositories. When a user starts to interact with these contents, then the XAPI captures its statement as JSON format and stores the result data through our module with H5P into the Drupal's database through database connection service. And as soon as a administrator of our website is asked for the same data for analyzing purpose, then he is redirected to this form page and he has to put some details about the user. And I am going to talk in later demo. Then the request he has made is fetched from the database through database connection service and it is being displayed on the same page through tabular and graphical manual. Next is demo. Here you can see I have already created some contents. I can create more and I am logging in as a user and I have total 4 users and I have interacted with those content with all of the users before and now I am going to interact again with an MCQ question through user 3. So I am logging into the system. Now I am logged in and I am going to attempt the question that is MCQ. And the question is what color does the blacker and berry actually have and options are black, very dark purple and blue. I think it is black. Now I am going to change the option and two very dark purples. So I have interacted twice and now I am going to submit it and as you can see it is submitted successfully. And now I am logging out and again logging in as administrator to analyze the result. I am now logging in as administrator and I am opening my module. And here you can see VGH5 display is our module and it is our result page. Here we have to select some drop downs from the drop downs to select a particular user a particular question to analyze his result and we select content ready to for the MCQ. The user 3 as we have interested in user 3 and the attempt number the latest attempt we have made. And here you can see that there are two interactions as I have made two interactions with the question and attempted and answered. And here is the graphical result here the y axis is depicting time and x axis there are four things to notice time to interact. It is the time from attempt first attempt and the first interaction then interaction time it is the total interaction the user has made and the number of interaction the user has done and the lastly time taken to answer is the last interaction time and the submission instance. As you hover over through each of the histograms you can see the distinct values of each column and the blue column is depicting the average of all of the users logged into the system and attempted and at least answered the question. And the user's average is shown in the orange column and the green column is showing that the how the user has performed in the current attempt. This wraps up our demo and next is the histogram which I have already discussed and display this is the table I have already discussed it and now this limitation and I am handing over to my friend Sutana. Hello everyone I am going to talk about the limitations of our vis H5P module. Currently our module in only the administrator is allowed to access the result data. As we have already seen the JSON object that we have captured here we have tried to exploit most of the details but the complete data is still not exploited. Our vis H5P module as of now supports only on the Drupal 8 platform. Now I am going to talk about the further developments or improvements that we can make in our module. Rating system for the questions. We can rate a question on the basis of the result data that we have received. For example, when we are creating an activity then we will get the details such as the number of time that is required for attempting and answering a question. The average accuracy rate of the question for the user and the time taken before submitting the answer. On the basis of that we can rate the questions. User categorization and grading. On the basis of the above facts we can grade the users based on their performance. As I have already told only currently the administrator of the Drupal website is going to access the content. But our further improvement can be that the users who are going to create the content can also access the content irrespective of whether they are administrator or not. We can also add additional feature for seeking permission to view other content user details. Here is the link to our module and the documentation that we have prepared. Here are the references that we have. Any questions? Good job. It would have been useful if you had also studied as a background what kind of events are captured in OpenEdX or IIT BombayX because some of these activities are already being captured. Like how much time a user is spending on answering which question, how many corrects etc etc. So to that extent this is a sort of add-on that you are doing. Of course this is independent and it will apply to all H5 content that you create which is okay. Very good use of plotly and so on. So here is a pointer to all of us. Suppose you were to write everything from scratch how many months or years it would have taken you to do that. The availability of simple things like plot libraries or all the JS files that you mentioned that means you have been able to quickly exploit some effort by a lot of different people and put together a very functional system and that is the direction of all future software development. So your ability will never now be measured in terms of how many lines of code that you can deliver alone. That will remain important. But how smartly you write those lines of code to exploit whatever others have done. Did I mention to you the site the site IFTTT ever? How many of you are familiar with the site called if this then that? None of you. I am very one or two. Please look at that site. It permits you to create an application without writing a single line of code using public services. About five years ago my friend Anand Deshpande introduced me to that and we constructed an application which says that if the Bombay weather is sunny then I should get a Gmail and even today I get a Gmail if there is going to be, Bombay is going to be sunny. Now this kind of thing exploits all the available public services which are accessible through APIs and all the actionable items which are again accessible through API. So that is going to be the future and this kind of work which I am sure many of you would have done would move into that direction as well. Just one pointer is because you are actually doing event capturing which can be analyzed you did not create adequate sample data to make your tables and displays more meaningful. So what prevents you from creating let's say 100 artificially created data points and in that context if you look at the local usage of one person or two persons it makes more imminent sense. Otherwise the graphs look jazzy but they do not convey the concept of the statistics that is actually intended, right? Just remember that whenever you are giving a demo, never create a demo with just one or two sample cases. The second thing is unless you create thousands of samples you will never understand the implication of performance that you may have on. Because one or two or three transactions will go in on any Lallu system. But when you have lakhs of things you have a problem and usually the developers almost always ignore performance issues about their software that becomes somebody else's problem later and which is often not tractable. Thank you.