Oliver received feedback on UX and has improved the content type accordingly
Oliver received feedback on code and has improved the code accordingly
Content type is released
"Schule Bubendorf" took care of basic funding for the content type "Pick the Symbols" that I created according to their requirements.
As a teacher, you can enter a text and define a set of symbols (usually punctuation marks, but could be anything to allow flexibility) that should be picked correctly by student. The content type will replace all spaces and symbols from the set with blanks. After clicking on the blanks, an overlay will present symbols to choose from.
If there are consecutive blanks that need to be filled (e.g. for direct speech with foo: "bar" having a colon, a blank and a quotation mark one after the other), students might have to add/remove blanks if the teacher didn't present all required blanks up front.
UX might be improved, but the popup was specifically requested that way based on how a similar software product handles this. Made sure it has a title, close button, can be closed by clicking outside, etc. which seem to be good practice.
Supports xAPI reporting as fill-in interaction type just like Fill-in-the-blanks (correct responses pattern is dynamic however due to the flexible number of blanks and blanks that don't require to be filled but could incorrectly).
Supports "save content state".
A11y should be fairly well. I assume for blind people, instead of moving "from word to blank to word to blank to ..." it might be easier to just tab from blank to blank and let the readspeaker announce the word/symbol before and after the blank. I used Fill-in-the-Blanks as a reference however and it behaves the same way (losing context information about the text if you tab from blank to blank). For keyboard use, the popup behaves like a modal dialog as suggested at https://www.w3.org/TR/wai-aria-practices/examples/dialog-modal/dialog.html
The content type hub icon is rather a placeholder
A demo can be viewed at https://www.olivertacke.de/labs/2020/03/06/pick-the-symbols/
The authoring side can be played with at the usual location
The code can be found at https://github.com/otacke/h5p-pick-the-symbols