Health E-Learning and Media Team RLO Redevelopment Project 2016
As part of a coordinated effort within the Health E-Learning and Media (HELM) Team Aaron has been assigned one of the HELM Teams Reusable Learning Objects (RLO) to redevelop in HTML5. As part of this process Aaron has taken a fresh look at the essential components of the HELM Teams RLOs and tried to develop the best possible learner experience. This essentially has taken the form of a blank sheet of paper approach. Aaron set the following goals to focus his efforts:
- Improve the learners experience of the learning resource by focussing on the learning content and activities, visually or structurally pushing other elements to the background
- Improve and streamline functionality of the resource
- Improve the code organisation and structure to ease maintenance and development
Aaron’s approach has been to:
- Remove all no content elements leaving learning content only
- Introduce elements and examine each on a case by case basis
This has resulted in several elements being re-worked or omitted considering how these contribute to the overall established goals.
Original RLO form 2004
RLO using the current HTML5 template (2016)
RLO using the Aaron's revised approach (2016)
Here is a breakdown of areas which have been examined:
1. Removal of Narration Play Pause / Restart
The narration functionality continues to raise many questions about its purpose, how it functions, auto play and labelling to mention a few. The use of separate narration does generate a few key questions about different scenarios within resources:
Scenario 1: Narration of main text with no other video/audio component within the page
Scenario 2: Narration of text with additional video content containing its own distinct audio content
Scenario 3: Narration of text with Video/animation component containing an audio component which is identical to the textural content
2. Removal of the Remove Text Feature (REMOVE)
Potential confusion for the users as some screens might not have two columns, choice may persist across sessions without the user understanding there is hidden content.
3. Text Resizing (REMOVE)
This function is handled by the browser or device so replicating the functionality
4. Full Screen Navigation Panel
Resource full navigation is contained within a full screen fly-out panel and this is triggered by a familiar Menu/hamburger button.
5. Fixed Next and Previous Navigation
I have anchored the next and previous navigation buttons to the base creating a navigation bar which persists across the device providing familiar mechanise for linear movement throughout the resource.
Small to medium screen sizes see the next and previous buttons on the left and right side of the screen. Tablet devices get the added University of Nottingham logo in the centre of the bar but desktop size viewports have the next and previous buttons positioned together over in the right hand corner to reduce the physical travel between buttons.
6. Small Viewport Fixed Top Navigation Bar
Provided a fixed top navigation bar to provide an app like experience and easy access to full resource navigation panel
7. Progress Bar Integration
Integrated the progress bar within the base navigation feature to visually show progress throughout the resource
8. Inclusion of Page Number (ADDITION)
I have included the page number within the title to give a quick orientation of the user’s location regardless of entry point, highlighted in colour to offer visual cue.
9. Main Content
Main content has a dropped shadow effect on larger viewports to give a contained feel this is not present on smaller screens as the device forms the container.
10. Experiment - Read Aloud
Removal of the narration tool and provided a read aloud html5 audio player, initially opacity dropped and when the user rolls over this the opacity returns to 1. This gets repositioned within small viewports so appears above the text.
11. Inclusion of rate this resource feature (ADDITION)
The system records the user’s rating along with the RLO number and date and time within a database table. This system should allow flexible expansion moving forward as newer RLOs are developed.
12. Feedback Form
Inclusion of Feedback form using iFrame, an approach utilised in the Team’s most recent RLOs and which appears to be having a positive impact upon feedback submissions. Aaron has utilised viewport specific styling to try and eliminate “scroll within a scroll”.
13. Redevelopment of Resources JS code
Redevelopment of the code which controls the Resource section content:
Original: approx. 300 lines of code -> New: 6 lines of code
14. Inclusion of HELM Icon Files (ADDITION)
This allows helm icon to appear in the browser tab window, bookmarks and when added to home screen within android and IOS
Other Area for Investigation
Aaron would like to explore the use of offline caching of the resource using web Cache and will look to undertake some experimentation in the near future.
Note on Content Redevelopment
Because the HELM Team has and inventory of over 200 learning resources redevelopment of these resources to overcome the issue of inaccessible due to unsupported technology (Many resources have been developed in Flash and Director which are becoming increasingly difficult for learners to access), the approach taken has been to try and provide the best possible conversion. This has resulted in a approach which falls short of undertaking complete resource redevelopment but offers a sustainable level of work with a hi quality end result.
Aaron feels that the end result is an improved Learner experience allow focus upon the crucial content. Function aspects of the resource are handled in a manner that ensures usability without hindering the learning experience. Aaron has given much thought to the use of the resource on differing devices and tried hard to ensure a great experience whatever device the learner may be using to access the device.
RLO using the Aaron's revised approach (2016)
RLO using the Aaron's revised approach(2016) medium viewport
RLO using the Aaron's revised approach(2016) small viewport
The article was viewable from Friday, 4th November 2016.