iMoot 2014 - B15 / B34 - Designing a Multi-device Moodle Course Site: A Case Study (Paul Hibbitts)

Lien important avec la présentation de Bas Brands sur B28 / B42 - Moodle Mobile.

Conférence de Paul Hibbitts (University of British Columbia, Canada) au sujet de Designing a Multi-device Moodle Course Site: A Case Study.

Moodle 2.5 a amené une plus grande Responsivity à travers différents modèles de site disponible dans Moodle. Le conférencier a quant à lui utilisé Bootstrap Framework (http://getbootstrap.com/) pour éditer simplement son interface et le rendre mobile.

Facile aujourd'hui de faire de s'adapter à du multi-device, mais ce n'est pas facile de bien le faire.

Considérant le «Mobile Learning», on doit se préoccuper

• Ubiquitous
• Situational
• Connected
• Personal : appareil plus personnel... la formation doit être plus personnelle

Les buts d'une expérience multi-device

• Consistence visuelle et conceptuelle entre les différentes plateformes
• Parité entre le contenu et la fonctionalité sur tous les appareils
• Possibilité de transférer les habiletés développées dans l'interface
• Il faut penser à tout l'écosystème de formation et non seulement à un appareil
• et si possible, s'assurer

Un bon livre sur le design pour des devices multiples : Designing Multi-Device Experiences : An Ecosystem Approach to User Experiences across Devices (2014), Michal Levin, http://shop.oreilly.com/product/0636920027089.do

Propose de s'organiser pour qu'un cours Moodle ne ressemble pas à un cours Moodle.

• Utilisation du modèle de cours Social. Conçoit son cours à partir du modèle par semaine, puis active le modèle Social, ce qui permet de cacher les ressource.
• L'interface passe ensuite par Bootstrap framework pour ajouter des class aux éléments d'une page
• Utilisation de Olark (http://www.olark.com/) payant et cloud pour permettre une communication automatique des étudiants avec le prof
• Pour feedback, intègre un lien vers formulaire Google Drive pour colliger les commentaires

Prochaines étapes... quelques idées intéressantes

• Try out the included Bootstrap theme Clean (v2.5+)
  
  • http://docs.moodle.org/dev/Clean_theme
• Check out Bas Brands' Bootstrap themes
  
  • http://theming.sonsbeekmedia.nl/
• Learn more about the Bootstrap Framework
  
  • http://getbootstrap.com/2.3.2/ (version 2.x)
  • http://getbootstrap.com/ (version 3.x)
• Learn more about multi-device design
• http://www.lukew.com/presos/preso.asp?28
• http://blog.teamtreehouse.com/beginners-guide-to-responsive-web-design

Possibilité de développer une Google Chrome App (bientôt possible en mobile) et qui permet d'avoirun bouton rapide depuis un appareil utilisant Google Chrome.

À noter les ajustements CSS faits seront disponibles sur le site de cours du iMoot http://2014.imoot.org/course/view.php?id=30.