Sample Course: Chinese Tea Culture (Responsive Course Design)

This sample course was designed and developed in Lectora using Responsive Course Design (RCD). The course showcases swipe gestures for navigation, branching navigation, drag and drop interactions, status indicator icons and multiple question types. Check it out now by accessing the course on a smartphone using the QR Code. 

Note: Within the Download folder is a Lectora Online PKG and Lectora v16 Zip for you to choose from.


Preview image

Tags: , , , , , , , ,


  1. Profile photo of Trav Owers
    Trav Owers

    Wow great course. Love the Green to suit the theme of the tea.

    Looks fantastic and Reacts very well to rotating the device.

  2. Profile photo of Jurg van der Vlies
    Jurg van der Vlies

    I really like the scaling to different devices. What settings did you use?
    I’ve beta tested Lectora 16 but couldn’t adjust the width. On my nexus 5 the screen wasn’t full size, with this example it is.

    Swiping left and right does allow you to also scroll up and down, but it is very sensitive. You easily skip forward and backwards while just scrolling up and down. Also when skipping video content, you sometimes jump to the next page.

    Great example that shows a whole lot of new possibilities with the responsive Lectora.

    1. Profile photo of Wendy Miller
      Wendy Miller Post author

      Hi Jurg,
      No special settings were used in this RCD title. All of the page sizes are the default. The pages are supposed to fill the width of the device automatically with no adjustment to page size needed. This title was created in Lectora Online. If you were not seeing the pages fill the width of the screen in the Lectora 16 beta, it is very possible that it was a bug that had yet to be addressed and will likely be resolved by the time Lectora 16 is released next month.

      Yes, the swiping can be very sensitive on some devices. And on other devices it is almost non-existent. There is nothing that the Lectora programmers can do to control that as all touch device hardware is a little different. When I build a title for mobile, I always provide an alternate method of navigation in addition to swiping. And if the swiping is really bothersome on some pages, I just disinherit it from those pages.

      Thank you for the feedback! 🙂

      1. Profile photo of Jeremy V
        Jeremy V

        Hi Wendy,

        I’m having the same experience using the full version of Lectora 16. I have converted a course to responsive design, made my changes, and then loaded to our LMS. When I launch the course from a mobile device there is a ton of scrolling?

        I also just created a one page course using a pre installed “style”. When I launch that from a mobile device, there is still a ton of scrolling. However, when I load your course using the QR reader, there was no scrolling on my device.

        I know that you stated that you did not have to use any special settings, but I’m not sure that it is working correctly. Any thoughts you might have on this would be greatly appreciated!



        1. Profile photo of Wendy Miller
          Wendy Miller Post author

          Hi Jeremy,

          Try checking the Page Size property on the Properties ribbon for your pages. When content exceeds the lower bounds of the default page height, Lectora will automatically resize the page height to accommodate the content. I had this happen a couple of times while I was building this title. So I moved the content back above what would have been the lower bounds of the default page height and then rechecked the Inherit Page Size property to set it back to the defaults. The default page sizes are as follows:
          Desktop and TabletLandscape: 1009 x 662
          TabletPortrait: 785 x 1000
          PhonePortrait: 480 x 763
          PhoneLandscape: 785 x 450

  3. Profile photo of Jurg van der Vlies
    Jurg van der Vlies

    Thanks for your reply!
    Great! Am looking forward to L16.
    Good advice, I will make sure test swipe actions thoroughly and make an alternative navigation available.

Your email address will not be published. Required fields are marked *