Saving & loading projects in Construct 3

1
Official Construct Post
Ashley's avatar
Ashley
  • 20 Feb, 2017
  • 1,654 words
  • ~7-11 mins
  • 8,697 visits
  • 1 favourites

Running the Construct 3 editor in the browser changes a lot of aspects around how and where you save and load projects — and we've also used this to bring some great new features. Let's take a look at the workflow of saving and loading projects from a browser.

Importing Construct 2 projects

As promised, Construct 2 projects import to Construct 3 with high fidelity. Construct 3 has all the same features Construct 2 has, and we've written an importer to read the XML-based Construct 2 project format and load it in Construct 3. This is well-tested, as we've been able to import large, complex Construct 2 projects kindly donated by developers like Aurelien Regard (The Next Penelope) and Daniel West (Airscape). So you can rest assured your project will import correctly. (Note if you use third-party addons, you will need to install Construct 3 versions of the addons before importing.)

The Construct 3 project format

Construct 3 uses a new JSON-based project format. JSON is a simpler format than XML and a more natural choice for browser-based software. A single-file Construct 3 project now uses the extension .c3p ("Construct 3 Project"). Note Construct 2 projects can be imported to Construct 3, but Construct 3 projects cannot be imported back to Construct 2.

In Construct 3 there are three main ways to store projects. These are:

  1. Using local files, like Construct 2 does
  2. Saving to browser storage
  3. Cloud save

Let's look at how each of these work.

Using local files

Yes, you can still use local files on disk in Construct 3, like you can with Construct 2! You can keep your projects locally and offline if that's what you prefer. Just don't forget to back them up!

Both Construct 2 (.capx) and Construct 3 (.c3p) project files can easily be imported from disk simply by dragging-and-dropping the files in to the Construct 3 editor window. Alternatively you can choose the Open local file menu option to choose a project file from a file picker. Both of these methods were also supported in Construct 2.

Saving files to disk is a little trickier. For (hopefully obvious) security reasons, web pages can't just go ahead and write files to disk. So from Construct 3, you can opt to download a copy of your project. The project is stored locally, so this doesn't really download anything from a remote server in the traditional sense. Instead it invokes a download of the local project, which brings up the browser's download UI and saves the project to your downloads folder. Then you can move it from there to somewhere else on disk if you prefer. Here's what the process looks like.

https://www.scirra.com/images/c3/download-project.mp4

Obviously moving a file every time you save isn't particularly convenient, which is why we have two other options available for saving in the browser. However it does give you a quick way to extract a .c3p of your project from the browser. We will also be providing desktop builds of Construct 3 which will be able to write to disk. So in the desktop versions you'll be able to save to a file anywhere on disk just like you can with Construct 2.

Saving to browser storage

Modern browsers have capable features for saving data locally, such as IndexedDB. Browsers save this data on disk, much like a local file. However it's normally embedded within a database, so you generally can't just browse to the files on disk (but you can still "download a copy" to get a file). Still, it provides a place to save projects locally without needing extra permission and without cluttering up your downloads folder. So in Construct 3, you can opt to save your projects to browser storage, and load them from there again. We built our own file picker UI to make this easy.

You have to use the same browser on the same device to access previously saved projects, since browser storage is unique to each browser and device.

We don't recommend this option for long-term storage, because browsers provide options to clear all your local data, or may even automatically clear local data if disk space is running out. Google are implementing a special "persistent storage" mode to avoid local data ever being cleared that way, which we're also already using. Our aim though was to provide this feature mainly as a convenience. It's a useful place to temporarily store projects, or stow away quick experiments or prototypes that you're not too worried about. It's also where Construct 3 stores auto-saves, in case you need to roll back a couple of saves.

If you have a large project, this is still a quick way to save. So it may be useful to adopt a workflow where you save regularly to browser storage, but at the end of the day save to the cloud, which may take longer for the upload. So while we think this is a useful feature to add, we recommend saving important projects a different way on a regular basis.

Cloud save

We think the best way to save in the browser is saving directly to the cloud. Since you can log in to Construct 3 on a wide range of systems, this makes it easy to also access your work wherever you go.

We don't host your projects. Securely saving data to the cloud while guaranteeing data integrity, even in the face of disaster, is difficult. Existing services already do that well, and lots of people already have accounts with those services. So instead we integrated Construct 3 with Dropbox, Google Drive, and Microsoft OneDrive.

These services all provide a basic free account with lots of storage, and you can get extra space and more features with various upgrade options. Many people already have accounts with these services, so it's easy to use them with Construct 3. Some even provide features like file histories going back in time, providing an automatic backup and roll-back service. And of course you can access them anywhere. This is why we think this is the best way to save projects from Construct 3.

The first time you want to save to the cloud, you simply need to log in to your cloud account and give Construct 3 permission to access files. Dropbox and OneDrive also confine Construct 3's access to its own folder, ensuring it can never access or affect your other files. Then you can save and load projects directly to and from the cloud right from the Construct 3 editor, using the built-in file picker UI shown above. The file picker provides an interface for you to review, search, rename and delete projects. You can also access your .c3p files from the cloud service's web interfaces, or have them synced to your other devices, so you can easily access your files in other ways outside of Construct 3.

All three save modes including Cloud Save are integrated with the save button in the editor, and the recent projects list. For example if you opened a project from the cloud, clicking the save button will save it back to the cloud again. Next time you load the editor you can choose the project from the recent projects list, and it will load it straight from the cloud again. This makes the workflow seamless regardless of where your projects are stored.

The only downside is if you have a slow connection or a very large project, the download and upload times may take a while. However you don't have to wait for saves — the upload works in the background, and you can continue on working on your project while it saves. Alternatively one of the reasons we also provide the browser storage option is to side-step this completely, since it can act like a staging area to have quick saves before you later save back to the cloud.

We strongly recommend saving to the cloud at least every few days, since it's a very reliable way to back-up your work in a way which will be safe even in the event of a disaster.

Folder-based projects

The very largest projects can take a while just to generate the .c3p file, which can even make local saves slow. To solve this Construct 2 can use folder-based projects, and only updates the few changed files when you save. This allows very large projects to still save quickly. As before browsers can't directly access local files, so we can't provide this in the browser. However this is another feature we're adding to the desktop builds. So you'll still be able to manage very large projects with a desktop build of Construct 3.

We're also investigating saving folder-based projects to the cloud. This ought to still allow fast saves as only the few changed files need to be uploaded. We won't have this ready for the initial release, but we'll be looking in to it later down the line.

Conclusion

We're well aware some users will be most comfortable keeping their work locally. You're definitely not required to use cloud save, since we provide other options for saving locally. We're also providing Construct 2-equivalent local file access in the desktop builds of Construct 3. However we think many users will find cloud save a convenient and reliable way to save their work and access it wherever they go. This makes it easy to access and open your projects even from a completely new device. And since it acts like a back-up system, it also helps keep your work safe.

Catch-up

Missed our earlier announcements? Here's a list of all the news about Construct 3 so far:

Subscribe

Get emailed when there are new posts!