Course Design and Aesthetics

Explore visual tools for organizing pages and enhancing design using customizable UI elements.

Articles (8)

Pinned Article Add an Image in Moodle

A quick introduction to how to add an image to your course page or an assignment in Moodle.

Pinned Article Add an Image in Moodle with a Border and Rounded Corners

Learn how to add an image in Moodle with rounded corners and a border with any colour.

Pinned Article Add Icons and Emojis in your Moodle Course Design

Use Emojis and Fontawesome Icons to animate the content of your Moodle Course pages. Beyond the smiley faces and thumbs up are useful graphics that can be used to create rich design in your courses that follow Universal Design for Learning principles.

Pinned Article Add Subheadings in Moodle Using Labels

Use labels in your Moodle shell to create organizational subheadings in your online course page.

Pinned Article Add UI Elements to Moodle Courses for Improved Design and Usability

You can enhance the appearance and interactivity of your Moodle content by utilizing certain user interface (UI) elements. These reusable UI elements can be easily added using the Moodle editor, and they utilize a mixture of Bootstrap and FontAwesome.These elements are already integrated into Moodle so editing is a breeze.

Get Re-usable UI elements for Moodle: https://birdyoz.github.io/helpers/ui-elements.html

Pinned Article Copy and Paste HTML in Moodle [EXPANDING ACCORDION EXAMPLE]

Learn how to copy and paste HTML from one Moodle activity or resource to another. In this example we use an expanding accordion that can be used to simplify Moodle content and enhance the user experience.

Pinned Article Design Expanding Accordions with AI for Moodle 4.1 Using ChatGPT

Save time by using the power of AI to design expanding accordions for Moodle.

Pinned Article Enhancing Moodle Course Headers Using AI-Generated HTML

This tutorial shows how to enhance Moodle course headers using AI-generated HTML. It covers image selection, overlay text, design customization, and accessibility tips to create an engaging and user-friendly course header.