Student Device Preferences

[mmoore1]

I recently attended a webinar called “Student Device Preferences for Online Course Access and Multimedia Learning”, and it tied in nicely to my presentation from this past summer about using mobile devices to increase student engagement in the online classroom.  The research that was completed at Oregon State University’s Ecampus has some interesting results from its 2035 respondents such as  . . .

• Nearly 100% of the respondents owned some form of a smartphone. (only 3 students did not) And 99% owned laptops.
• Students preferred laptops for accessing their LMS (73%), Viewing video (68%), and learning with games and simulations (59%).
• Devices such as laptops and desktops appear to be the best choice of study for effective results

I am inferring from the study too that students seem to understand that the Laptop and Desktop are more effective; however, they would prefer a mobile device such as a tablet or smartphone for the convenience and perhaps ease of use.

I am not sure that this is overwhelmingly new research in this study, but it does seem to be a nice reference as it is recent research and a leading online program.   Perhaps more mobile learning environments will be created in the future to accommodate the preference.  If you would like to learn more about the study, please refer to the attached PDF or Oregon State's Ecampus reasearch team.

I have been asked to share this research, and I welcome any feedback.

[Shar]

Hi Matthew Moore,

I also attended that Oregon state webinar and got a few surprises from the takeaways. And then I went to the Educause webinar on IT Experiences of Undergrad Students 2018 ECAR Findings which surveyed over 64k students in 9 countries. There were many of the same results with the important tech for academic success being a laptop and then hybrid device (like Surface or Yoga).

At any rate for me as an Instructional designer, the big implication is that I may design courses with 2 large monitors but that's not how students are going to consume the information. So I always test my view on a smaller screen like tablet/laptop and Canvas mobile app to make sure that I'm not causing more hurdles than helping with crazy-over-the-top design.

Designing with the smaller screen (laptop/tablet) user in mind means specifically:

• Don't waste vertical space with decorative banners
  • Every page has a H1 name/title, use meaningful names to denote where it is in the course
• Provide quick navigation links to get around, like linking to the specific module on the modules page
• Use Module requirements so it will act as a checklist for students to remember where they left off
  • put a reminder note at the page bottom when the page has to be manually mark as done
• Be aware of data display in a table
  • Wide tables surround with <div style="overflow-x: auto;">...</div> so the table can scroll across the page
    • in mobile app the wide table sets the page width and regular text can show up squished
  • Use specific px widths sparingly. For equally distributed columns use style="table-layout: fixed; ...."
  • Shorter tables use percentage widths like  style="... width: 96%; margin: auto; ..."
    • I like 96 because it's divisible by 12!
  • Use the cellpadding attribute as Canvas app doesn't inherit any of the canvas properties
    • in general, how it looks in the RCE during editing is how it will render in Canvas app.
  • Collapse the borders. style=".... border-collapse: collapse;"
  • Set the first row and cells as type header with the RCE table editor.
    • or by hand using <thead> and <th>
  • Vertical-align: top for cells with multi-line data.
• Be mindful of video usage
  • Short videos display on the page and restrict width to 640
  • Longer videos link to new window to appear full screen
  • Include how long the video is (2:30) so the student can decide they want to watch it now.
    • no mouse hover in mobile means they miss that extra info on the video itself
  • Provide context for what's in the video either with keywords or sentence description
• Chunk content meaningfully with related components together
  • Overview, objectives, workflow - all related, should all be on the same page
  • Different subtopics on separate pages if there are associated assets (like videos, readings) with each
• Use a page to describe longer assignments before the actual assignment page
  • in mobile app Assignment pages display slightly different especially with the rubric
  • it's easier to edit a content page (wiki page) than an assignment page with the Page History feature
• Comment content that is better viewed in a web browser rather than mobile app
  • <div class="hidden-desktop">Please use a full-size web-browser to use the interactive features on this page.</div>
  • <div class="visible-desktop" style="display: none;">...web browser stuff...</div>
• Label external links with what kind of resource so the student can decide if they want to go there now.
  • like [PDF], [Video], [Website], [Blog article] at the end of bibliographic references instead of showing the whole ugly long URL.
    • Again, no mouse hover means they miss seeing the URL in the status bar.
    • Also your screen-reader users will thank you for not having to listen to it read h-t-t-p-colon-slash-slash....
• Resize graphics for smaller file sizes and less code on the page.
  • For information banners, I like 802px. For faculty images, 100px. For module images on a homepage, 100px or 150px max!
    • I'm going to switch to 804px since that's divisible by 12 too. I think in general I've seen large images display at 768px when I inspect the code in the browser. I like 802/804 because it's a little bit bigger and will compress down to fit nicely when set on the page as width=100%.

Ok, this post ended up being a lot longer than I intended. I put a lot of thought into how both the student and teacher users will interact with the course pages. Ultimately I want the technology to disappear and the learning to be effortless, so I try to remove as many barriers or clunkiness while still giving a clean and modern aesthetic.

Happy New Year 

Cheers - Shar