This session is aimed at Instructional Designers, Learning Technologists and any other EdTech practitioners heavily involved in designing and curating engaging Moodle course pages who would like to take their course page design skills to the next level and pick up a few coding skills along the way.
In this session, participants will have opportunities to see examples of a wide range of interactive and responsive web components (e.g. accordion menus, tree diagrams, profile cards, tabs, drop-down menus, timelines etc.) added to a course page as labels, pages and activity description fields in order to aid interactivity, engagement, user experience and page navigation which is particularly useful when designing content heavy course pages which require substantial vertical scrolling. These web components are powered by the most popular and open source CSS/JS frameworks such as Bootstrap, Shoelace, FontAwesome and LottieFiles and require rudimentary skills in coding using HTML and CSS.
Finally, during the presentation, as well as the entire duration of the conference, participants will have access to a module page in my Moodle portfolio site with actual examples of these web components in action, access to interactive CodePens allowing them to tweak the code in real-time as well as downloadable source code sheets with explicit deployment instructions.
Example module:
https://moodleportfolio.com/course/view.php?id=14
Username: guest.account
Password: MoodleMoot23!