re-usable ui elements - moodle: online learning …...re-usable ui elements for moodle (&...

Greg Bird, Colin Foote, Regional TAFE Alliance (RTA)

Re-usable UI elementsAdding some sizzle to your Moodle design

Regional TAFE Alliance project

Shared resources

"Sharing" (CC BY-NC 2.0) by ryancr

What would you prefer, this?

"Scoop of Vanilla Ice Cream Leo’s Restaur" (CC BY 2.0) by stevendepolo

Or, this?

Photo by Brooke Lark on Unsplash

UI Elements to the rescue!

"Knight in Shining Armor" (Public Domain) by pasukaru76

From this …. To this ….

I.D. requirements

✓ Attractive & easy to use

✓ Editable in Moodle

✓ Visually consistent

✓ Interactive elements

✓ Low bar to adoption

✓ Provides visual cues to students

Technical requirements

✓Responsive

✓Accessible

✓Fast

✓Standards compliant

✓Built-in (Moodle Core)

1. Copy 2. Paste

3. Edit 4. Done

MOODLE CORE

• Responsive

• Theme-able

• Design elements

• Interactive elements

• Responsive

• Theme-able

• Scalable

• Font based (no images)

Re-usable UI elements

https://birdyoz.github.io/helpers/ui-elements.html

Get it now

You might also like ……

• Unsplashhttps://birdyoz.github.io/helpers/unsplash_embed.html

• Pixabayhttps://birdyoz.github.io/helpers/pixabay_attribution_helper.html

• Shutterstockhttps://birdyoz.github.io/helpers/shutterstock_attribution_helper.html

https://birdyoz.github.io/helpers/youtube_embedder.html