MS ePortfolio - Moodle Customization (CSS)

This project was part of the Instructional Design I (ETEC 5440) course. The project, Understanding the Building Blocks of a Boost Preset, featured various modules aiming at supporting individuals interested in customizing their own Moodle Cloud LMS through the understanding and implementation of a Boost Preset. In particular, the module we chose to develop through the ADDIE model, focused on CSS.

You can experience the full course here.

The Canvas Support page provides instructions on how to sign up for a Canvas account with a join code (above).

View the Slideshow in .ppt format

The process

Below, you can find all the reports for each phase of the ADDIE process. At a glance, these were the main choices our team made for each phase:

ANALYSIS

In the analysis phase, we explored the potential for a training module that empowers independent educators to customize Moodle themes, addressing platform complexities while taking advantage of its open-source flexibility to create professional, cost-effective online learning environments.

Download Full Paper

DESIGN

The design phase aimed to outline learning objectives, assessment strategies, and a structured approach to teaching theme customization skills to guide educators through personalizing Moodle's Boost theme using Bootstrap, CSS, and SCSS.

Download Full Paper

DEVELOPMENT

The project developed an accessible, UDL-aligned online course using Canvas to teach CSS and Moodle theme customization, focusing on diverse content formats, hands-on learning, and digital accessibility principles to create an engaging educational experience.

Download Full Paper

IMPLEMENTATION

A formative evaluation revealed a successful implementation of UDL principles, creating an accessible, engaging learning experience through structured modules, interactive elements, and diverse content formats. Challenges in platform constraints and technical complexity were identified.

Download Full Paper

EVALUATION

A summative evaluation aimed at measuring the course's effectiveness through a multi-level assessment that revealed high participant satisfaction, significant learning outcomes, increased confidence, and potential for future CSS application.

Download Full Paper

Course Preview

Below you can see some screenshots from the course. The learning experience is organized into modules with a "Start here" section with instructions.

We developed Module 2: CSS Syntax, which featured sections with instructions to be completed at the student's own pace together with practical real-world practice for each section.

We added a section with additional resources to further explore the module's topic, as well as a discussion board where students could build a community and share their progress and concerns.

You can see a more detailed course preview in HTML format and experience the course by clicking the "Next Example" button at the bottom of the page.

What I learned

Adjusting and realigning without fear - it is not failure, it's part of the process!
Importance of SMEs, having an understanding of the topic and/or allotting time for it
Chunking is important to avoid cognitive overload and ensure maximum retention + serve different types of learners (e.g. busy or overwhelmed)
Importance of correctly interpreting data, especially in the implementation phase
Always strive for better (the beauty of future iterations)

🏠︎ Back to Design

Next Project ➡️