MM-402
Mobile Learning for education

by Lars-Otto Bjerkeng

27 November, 2019

Assignment

Create a detailed curriculum design brief for a course that you would like to teach or be taught for the year 2030.

Delivery

A visualization on how a “Web Development” course can be taught in 2030. By the help of mobile learning and transmedia applications to engage learners from anywhere at any time. A full report on the course structure, objectives and salience is included.

This delivery is made as a webpage, because I want to present the report in a unique way, and catch the readers attention by using animations, images, videos and text. 

Abstract

Regarding the previous assignment we had, I’ve changed my mind about my project. I didn’t manage to find the connector i was looking for in the agriculture simulator, so I’ve chosen a new direction. I’ve decided to create a course about Web Development. I chose this topic, because I have lots of experience in the field, and it’s something I might want to teach in the future.

The reasoning behind choosing a Web Development course, is that it’s still going to be relevant in 10 years. The web just keeps evolving, and you won’t stop having websites for businesses any time soon. What will change is the way we code, develop and host websites, and also the technology that display the websites. Which means that the course have to consider these factors.

This design brief gives a visualization on how a web development course can be run in 2030, with the use of the imaginative mobile LMS application called “Live Code”. Live code is an application like canvas, but built solely for programming students. It works just like canvas with the modules, for each of the course’s units, but it also has a custom built AI mentor that guide you through the modules instead of a teacher.

 

 

 

Web Development Course in 2030

Course Description

The Course “Web Development” is a course created to introduce the student to web development, design and SEO. The course is separated into four units, which all have their own sub-sections of learning content.

The course runs over two semesters, where you learn about unit one – Basic Web Programming ,and unit 2 – Web Responsiveness.

The course is built around the use of webapplications as tools to helps the student in the best possible way. We’re providing licences to the new “Live Code” application which the students are using to learn basic Web Development.

 

The Live Code application

The Live Code application is a modern form for a LMS (Learning Management System) that is built solely for coding purposes. The students will be provided with a user that can access all the modules for the four different units in the course.

The LMS is built up by modules for each of the Units. Every unit has upto 5 video tutoring sessions, where the students AI mentor teach them about the subject, before they head into the applications workspace. During every module, the students need to complete a set of tasks to move further on. These tasks are performed in the Live Code workspace.

The workspace is divided by a splitscreen that separates a code editor on the right side, and a live preview on the left side. The ability to see a live preview directly in the application will help the students understand how coding works much easier. If the students are stuck or need guidance, our custom built AI “Mentor” will help guiding the students with their tasks in the best possible way through voice-communication.

The course is made solely through the “Live Code” application, which means that it’s completely mobile. The students are able to complete the course from anywhere at any time.

 

Click to preview the “Live Code” Application

Course Objectives

This course is made to invite students into a web development path that can strengthen their multimedia knowledge and prepare them for future job scenarios. The course will give a detailed introduction to webdevelopment through HTML7, CSS and Javascript / Typescript. The students are learning how to build and design modern websites for modern devices. It will give the student a great understanding of how SEO works, and how to use it in practice. 

With the help of “Live Code” the students will be able to access their modules and workspace from anywhere at any time.

Course Goals

On successful completion of the course, the student should be able to,

  • Create their own website from pure HTML7 and CSS5.
  • Understand the basics of Javascript & Typescript.
  • Understand the science behind Responsiveness.
  • Create responsive websites for all sorts of devices, including traditional and modern AR / VR devices.
  • Set up a CMS (Content Management System).
  • Install Themes, Plugins and Administrate the CMS.
  • Design a modern webpage, using modern design techniques.
  • Adapt to the newst trends within webdesign.
  • Understand the basics of SEO (Search Engine Optimization)
  • Setup a RankMath, Google Site Kit & Tag Manager combination.

Course Structure

The course structure is built up by four different units. These units are sorted in a specific order to make sure the learner gets to learn the fundamentals of web development before they go into heavier topics. Each of the units will be explained in their own section further down.

Unit 1

Basic Web programming

1. Introduction to www

2. The basics of HTML7

3. The basics of CSS5

4. Introduction to Javascript &  Typescript

Unit 2

Web Responsiveness

1. Introduction to Responsiveness

2. Methods & Tools

3. Traditional Devices

4. Modern Devices

Unit 3

Webdesign & CMS

1. Introduction to Webdesign

2. Introduction to CMS

3. Introduction to CMS Builders

4. Fonts, Images, Colors & Spacing

5. Trends & Adaption

Unit 4

Search Engine Optimization

1. Introduction to SEO

2. Rankmath SEO Plugin

3. Google Site Kit

4. Tag Manager

Unit 1 – Basic Web Programming

1. Introduction to WWW

Learn the very basics of how we connect to the internet, how it works, how browsers behave, what’s a domain, how do we make a website, and how we can host both locally and online.

2. The basics of HTML7

Learn the very basics on what HTML7 is, how it’s different compared to HTML6 and how to code. We will learn the students to build their own small webpage from the bottom by using html7.

3. The basics of CSS5

Learn the very basics on what CSS5 is, how it’s different form CSS4 and how we can use it to style our website. The students will learn about ID’s and Classes, how they behave and how we can style elements using them.

4. Introduction to Javascript & Typescript

A slight introduction to Javascript and Typescript. The students will learn how these types of codes work, and it will give them a good starting point when it comes to start learning these languages. Typescript is the future of Javascript and is very much a hot topic today (2030).

Unit 2 – Web Responsiveness

1. Introduction to to Responsiveness

This sub-section is about teaching the students about Responsive websites. Why do we need them? what are they? How are they done? 

2. Methods and Tools

Studies that directs its focus to the different methods and tools that can create responsive websites. The students will learn how to use the traditional bootstrap method, to using flex boxes and applications such as Dreamweaver to design responsive websites.

3. Traditional Devices

Studies on how to use flex-boxes to design responsive webpages for traditional devices, such as Big Screens (Tv’s), 4K Screens, Desktops, Laptops, Tablets, and phones. 

4. Modern Devices

Studies on how to design responsive web solutions for VR Devices and AR Devices. Ranging from the Oculus, to the HTC Vive, to Google Lenses etc.

Unit 3 – Webdesign & CMS

1. Introduction to Webdesign

Learn the basics of webdesign, how you can sketch your designs, prototype them and what makes a website appealing to look at.

2. Introduction to CMS

Learn what a CMS (Content Management System) is. Learn how to setup and install your CMS from scratch. You’ll learn how it’s connected to the database, how to create blogposts, users, allowing comments and logins.

3. Introduction to CMS Builders

Learn how you can design the looks of your own CMS by using themes, and plugins to change the looks of your website. You’ll learn how to use the builder tool itself and how to build a website using modules.

4. Fonts, Images, Colors & Spacing

Learn what estethics that makes a website look good, and professional. You’ll learn how you’re supposed to space out your content and use different fonts to keep a good flow in the websites design.

5. Trends & Adaption

Learn how trends affect the webdesigns of the future, learn to understand how trends start and when to catch the trend wave. Learn how to adapt to the current trends, by looking at inspirational websites from other designer and so on.

Unit 4 – Search Engine Optimization

1. Introduction to SEO

Learn how search engines crawls website to gather information they can present in the search engines. Learn about meta data and how to optimize it in the best possible way to score high in search engines.

2. Rankmath SEO Plugin

Learn how to setup the Rankmath plugin to give your website an easy way to present the metadata for the search engine crawlers. Learn how to use Rankmath to score higher on the search engine sites.

3. Google Site Kit

Learn how to use Google Site Kit to gather data about your Search Engine Scores. The students will use it in practice to track a premade site during the course.

4. Tag Manager

Learn how to use Tag Manager to track site visitors actions, such as pressing buttons and clicking images. Learn how to use this to your advantage when setting up Google Site Kit and Rankmath.

Conclusion

For my delivery, I’ve made a design brief of a web development course in 2030. The course is run through the imaginable LMS called “Live Code”. Live code is a LMS made solely for programming courses, and provide the tutor with custom modules that the tutor can build from scratch using videos, audiobooks, podcasts, and AR / VR applications. The tutor can choose to use the custom AI mentor, to provide all help the students could need during their tasks.

The students use the LMS to progress slowly through the course by completing modules. These modules are made by a tutor, and can contain Videos, audiobooks, podcasts, and AR / VR Applications.

Live Code has tools that help the students program webapplications and websites on the go, and it provides the student with a live preview on the side of it.

Sources

Icons used are made by Freepik from www.flaticon.com