2. Our Objectives
• To create innovative e-learning resources for Primary
and Secondary education mathematics
• To present them through highly interactive and graphical
Apps
• To create an engaging educational experience for tablets
• To completely separate the production of educational
content from the presentation mechanism
• To develop a highly automated and repeatable
publication process
5. Composition of a Hybrid
• All the Apps are composed of the following shared components
o iOS framework responsible for navigation, management and page loading
o A pure JavaScript Web-App framework responsible for any functionality relating
user interaction with the application specific content
o A media responsive CSS3 library
o Common graphical controls: static images and dynamic SVG and MathML
templates
• Each individual Apps has its specific data context
o A CoreData database which contains all the App content and defines its
navigation hierarchy
o App specific graphical controls: static images and dynamic SVG and MathML
templates
6. Content is Key
• All the content of the Apps is contained in a set of Excel
Spreadsheets
• The spreadsheets contain instructions, scripts and references to
graphical assets
• The Scripts take the form of HTML, CSS, SVG, MathML or Tex
• Each App is composed of a set Spreadsheets, each Spreadsheet is
composed of a set of worksheets and these define the structure and
content of a first level element in any App
• The content is self referential allowing links to be made between the
Web-Apps
7. Enriching Content
• The Spreadsheets are imported into a enrichment program which
interprets the instructions in spreadsheets, and from them creates a
set of HTML and JSON documents which represent the questions
and examples
• The enrichment program also extracts the SUBJECT : Element :
Document hierarchy and resolves all cross references between
documents and to the templates
• The enrichment process makes an important link between the
document and its associated Web-App in the JavaScript framework
• Once the document has been created it is exported to a CoreData
database which becomes the single artifact that distinguishes one
App from another
10. Runtime Document Loading
• When an App run and the user navigates to a question the following
occurs
o The document is loaded from the database
o The Web-App relating to the question type is initialized and the JSON
data is loaded
o The SVG question input template is dynamically loaded
o Any MathML templates are dynamically loaded
o Any data driven SVG creation code is executed
o The input handlers initialized based on the question type
o The HTML and SVG DOMs are dynamically reconfigured for the first
question based on the supplied JSON question data
• App is now ready
12. The Code
• 30,000+ lines of JavaScript code
• 42,000+ lines of Java code
• 18,000+ lines of Objective-C code
• 3,600+ lines of SCSS
• 4,000+ lines of XSL
• 1,000+ lines of XSD XML Schema
