Making Moodle multi-device friendly with bootstrap - Bas Brands Presented at Moodlemoot Edinburgh 2014 www.moodlemoot.ie

1. Making Moodle Multi-device
Friendly with Bootstrap
Dressing for success in a Multi-
Device World

2. What do we all have in common?
http://www.flickr.com/photos/7682132@N05/9913956096/

3. You (often) interact differently
on each device
Your read texts on your mobile while
traveling
You write on you laptop
You watch youtube on your tablet
You game on your gaming console

4. Your LMS is already being used
on multiple devices.

5. Choosing the right theme is a
first step
No Zoom
Focused
Easy to read

6. Somebody had a great idea
Picture of @fat on twitter

7. CSS provides a set of styled
elements
Image by Bas Brands

8. JavaScript makes Bootstrap
interactive
Image by Bas Brands

9. It’s simple right?
Theme processes

10. Okay maybe not, help is needed
Developers
Testers
Users
Github

11. The Grid
City University London

12. The Grid
City University London

13. The Grid
City University London

14. The Grid
City University London

15. Collapsed blocks
King Faisal University

16. Expanded blocks
King Faisal University

17. Mobile blocks
King Faisal University

18. Theme Moodle bootstrap, what's
new?
Complete rewrite
New settings
Auto generated CSS
Bootswatches

19. Bootswatches

20. Bootswatches

21. Bootswatches
http://www.flickr.com/photos/21503901@N05/5380882279/

22. The webvideo Activity
mod webvideo

23. The HTML5 video filter
mod webvideo

24. Responsive Images
mod webvideo

25. Thank you!
https://www.flickr.com/photos/31149081@N02/7761213134/

26. contact me @basbrands