Building Blocks are the ‘tools’ with which the educator can build an e-Learning Activity. Examples are a simple text, a question or an embed block. They’re the core blocks that can ‘connect’ the ‘historical thinking’ blocks together. Examples are the Sorting, the Prioritising and the Analysing Tool. Every Block contains once placed in the e-Learning Activity sequence line contains basic functionalities delete and edit. Clicking the edit icon opens the Activity Builder and leads to the Building Block.
The white area in the middle, the canvas, is developed by the external party. The orange buttons in the upper left corner are used to add interaction (Add images, Add background, etc.) to a Building Block. There are Building Blocks which work with multiple images or as in the Analysing Block that is based on one images where annotations can be added.
Beware that the Builder is transitioning to a more conclusive interface. As soon as they are implemented in the code this section will be updated.
We aim for creating a more responsive site. The present maximal width is based on the idea that Activity Builder and eLearning Tools should be usable on a tablet and not on a mobile. In this screendump you also see the future plan for creating a new navigational layout. Pagination and next/previous on top, overarching buttons (add sources, assigments) on the right, interaction buttons on the canvas.
On the wishlist:
A Building Block that is part of the e-Activity Builder is written in Vue.js.
Questions to be documented
The BuildingBlock environment was the first complex Vue implementation we did. We had quite some existing code from our prototyping stage which we wanted to re-use. The fact that the code was jQuery based added an additional layer of complexity. From all the hoops and loops we went through we have learned quite a few things. Later when most of the dust was settled and we had more insights we created a new block from scratch. The way that was done was a lot more efficient.
Later we will work out an example based on the code of that block.