Creating a CLIO Program
Overview
Understanding the Content Folder
All of the data used by Interactives, Programs and Activities are stored as flat files within the 'content' directory at the root of the web application. When CLIO is loaded, it will search this directory for available Programs. This is because CLIO does not use a database server to store activity configurations.
Creating a Program Folder
Navigate to the ‘content’ folder, located within the web server’s root directory. Create a folder here with a descriptive name for this Program. This folder name must start with a letter, but it can contain numbers. Spaces are not allowed, but you can use underscores or camelCaseType to help with organization. The name you use for this folder becomes the ID that CLIO uses to load and manage Programs.
Using the Getting Started package available for download at cliomuseums.org, navigate to the Template folder. Here you will find a folder named Program. Inside this folder, copy all of the contents, which will include three folders and three files:
| Resource | Type | Description |
|---|---|---|
| @Activities | Folder | Contains all of the Program’s Activities. |
| @Facilitation | Folder | Contains all of the Program’s Facilitation information. |
| @Media | Folder | Contains all of the Program’s multimedia files. |
| @About.json | File | Contains the description information about the Program. |
| @Audiences.json | File | Contains the Program’s audience configurations. |
| branding.css | File | Contains custom CSS to be used when the Program is loaded. |
These files are the basic structure of a Program that is used by the CLIO web application. In the next section, we will go over configuring the descriptive information about this Program.
Configuring the Program Details
In order to edit the Program details, we will need to open the file titled @About.json. This file format, known as JSON (JavaScript Object Notation), allows data to be stored for later use in a way that is easily readable and writable by both humans and computers. JSON files can be opened using any plain text editor, which is available on every operating system. For ease of editing, you can also use a JSON editor, such JSON Editor Online (jsoneditoronline.org).
When the CLIO web application loads a Program using the Settings menu, it will read this file within a Program first to get its name, description and other properties. To edit the JSON file, we must first open it. I have decided to use a JSON editor, because it helps to keep track of syntax, which is very important to keep JSON files readable by the computer.
This is what a JSON file looks when opened through JSON Editor Online. As you can see, all of the descriptive information, such as the Institution’s name, the Program’s name, and description, are listed under ‘object’ with a numerical signifier of how many ‘keys’, or descriptive pieces of data, are within this object. ‘Object’ is in reference to the file format’s name, JavaScript Object Notation.
Simply speaking, an ‘object’ in JavaScript is a collection of unordered data, which can be composed of smaller pieces of paired data, called ‘keys’ and ‘values’. Typically, all of the data in one Object is related to the same thing. Objects are extremely useful because they are a way to systematically access important data, such as the Institution’s name or Program’s Description, by simple providing a ‘key’ to the Object and requesting back it’s ‘value’. For the purposes of the CLIO web application, they are essentially performing the role of very small, offline databases.
JSON files can become complex very quickly, depending on how much data you need to store within them. You can also create objects within objects, so that you can try to create a sense of organization within large JSON files, or you can instead choose to create more JSON files that contain more specialized data. This illuminates the importance of ‘key’ and ‘value’ pairs; they make it easier to keep track of data, especially when it starts to sprout into a large tree of information.
You can think of a ‘key’ as a descriptive name, designed to inform you what data that key contains. By knowing the ‘key’, we can request the related ‘value’ from an Object. In our example, the ‘key’ is ‘Institution’ and the ‘value’ is ‘CLIO Museums’.
Now that we’ve gone over a basic explanation of what JSON is and how it functions, we can finally edit the file. This file only contains 4 ‘key’ and ‘value’ pairs, but they are used frequently within the CLIO web app, allowing institutions to update Program information by editing the least amount of data possible. Below are descriptions of each ‘key’ and what the expected ‘value’ pairing is.
| Key | Description | Expected Parameters |
|---|---|---|
| Institution | The name of the institution this Program is associated with; i.e. the Museum’s name or department. | Plain Text |
| Program | The "friendly" name of the Program that is shown as part of the CLIO web application when it is loaded; i.e. the name of the pop-up exhibit or the out-reach program this is related to. | Plain Text |
| Description | A brief description of the Program, as shown to kiosk users through Exhibit Mode. | Rich Text |
| About | Information about the program, as shown through Facilitator Mode’s Help and Facilitation menu. | Rich Text |
