Skip to main content

Uploading Media to your Interactive Videos

Find out more about our amazing Adobe Express editor

Use Adobe’s Express’ new editing tools within Stornaway’s interactive video web editor.

Stornaway is the first company to integrate Adobe’s video editing tools inside its own web app, using Adobe’s new Express Embed software development kit.

Creative teams can craft interactive journeys through an unlimited number of video clips, harnessing the power of Adobe’s cutting-edge video editing and AI content creation tools – all inside Stornaway.io’s web interface.

Click here to find out more:
https://www.stornaway.io/adobe-interactive-video/

How do I use the editors and stock footage links in the upload panel?

You need to use a video editor to made MP4 videos to upload to each Stornaway island.

We provide links to 3 free video editors and 3 free stock footage services in our Add Video panel, to let you get started quickly with web-based tools.

Follow the links to these platforms and then download MP4 (or MOV) files from them which you can upload to your islands in Stornaway.

 



Free web-based video editors

Make videos with these and export them as mp4 files for upload to Stornaway.

They all provide the ability to make videos using templates, stock footage, music and text. See which one has a template and interface that best suits your needs.

Adobe Express will let you make and download a video for free without a watermark and has a unique chapter-based interface, and asks you to sign in first.

Canva doesn’t require you to sign in, and has a lot of templates – but will add a watermark to your downloaded file if you’re not a paying user.

Veed doesn’t require you to sign in, and has great subtitling and text features, but will add a watermark if you’re not a paying user. A lot of our tutorial videos are currently made by Abbie using Veed.

Adobe Stock is generally a premium stock footage library, but we’ve given you a special link to their 10,000 free assets. Continue to search with “Free” selected in the search panel. You can click License and then instantly download a video.
Pond 5 is also a premium library, aimed at filmmakers – with some interesting and unusual footage to be found – and we’ve given you a special link to their many thousands of free assets. You have to sign in and check out as if buying, but it’s still free.
Pexels is the huge free library contributed by the Pexels community and owned by Canva. A lot of their featured videos are vertical/portrait now – to find horizontal/landscape, search and add a filter for Horizontal:

What other video editors do you recommend for beginners?

What do the Pros use?

The top professional video editing applications for film, tv and video production are Adobe Premiere (and After Effects for graphics), Avid Media Composer and Final Cut Pro (FCP). We have lots of users editing Stornaway projects with these. They all have huge feature sets, steep learning curves, and are powerful beasts. Adobe and Avid have pro subscription prices and FCP has a one-off cost of $300. The free Davinci Resolve is coming up fast as a great free pro editor, since its long history as a color-grading application, but is still quite complicated to use in comparison to those listed below.

We also have an Adobe Premiere and After Effects panel in beta, which opens your Stornaway story map inside your editing application, letting you playtest your story while you edit. Let us know if you’d like to use it.

For everyone else…

We don’t recommend these 4 to most people – they’re over complicated for simple editing and beginners.

We have partnered with Adobe to include Adobe Express inside Stornaway. Click here to find out more:
https://www.stornaway.io/adobe-interactive-video/

For other easy, affordable and free applications, read on:

Desktop computer applications:

Mac: iMovie or Adobe Rush

PC: Adobe Rush or Vegas

Mobile apps:

Capcut (free – popular with TikTokers and YouTubers) or LumaTouch (more powerful at $30) or iMovie on iPhone and iPad ($5).

Web browser editors (like Stornaway):

Adobe CC Express, Canva or Veed.io

We link to the last 3 from our Upload panel in the app. We discuss their pros and cons a little bit in the section above, and recommend that you try them out for use with Stornaway.

What to choose and how to learn

There are amazing online tutorials on YouTube for all of them. Pick one from the list above that seems right for your device and budget, and try it out – or search on YouTube for tutorials to see if you like the look and feel of it.

Let us know what you prefer to use, and how you get on – or help other Stornaway users by sharing your experiences and expertise on social media.

What settings should I use for normal video?

For regular videos (not 360 or images), we recommend the following settings when you export from your video editor:

File size:
We have a maximum file size of 500MB, for various reasons. This gives 8.5 minutes of video at the recommended HD settings shown here. If you need to use longer files, see the help section below.

File type and codec:
We accept files that end with .mp4 and .mov, containing H264 and H265/HEVC codec. Export these from your video editor and use the settings below.

Advanced note: mp4 and mov (also known as Quicktime) files can contain lots of different types of video data, known as codecs. Examples of codecs include VP9 and ProRes which have different quality settings and vastly different file sizes. We accept H264 and H265 codecs and recommend the settings below.

Resolution / Frame Size:
1920 x 1080 recommended – i.e. 1920 pixels wide by 1080 pixels high – the standard HD video size.

Advanced note: We also accept 4K/UHD files at 3840×2160, though we don’t recommend this, and lower resolutions like 1280 x 720 (at 4Mb/s) which is popular on the web particularly for smaller embedded videos to use less data.
For more details of these, see below.

Frame Rate:
30fps (frames per second) recommended.
It will accept whatever you give it, but 30fps works well on the web, and gives a good file size at a reasonable quality.

Advanced note: Using more frames per second demands proportionally higher bitrates and file sizes to keep the same quality, without any real visual benefit on the web by adding more frames per second. Some sports cameras record at 60fps or 50fps by default – to save data, try to make your video editor import them to your edit project at half the frame rate (30 or 25fps) without slowing them down or making them jittery.

Quality / Bitrate:
8 Mb/s recommended
Use this rate for 1920 x 1080 videos at 30fps.
which means a single clip can be approx 8.5 minutes at our 500MB limit.

Audio:
AAC 16 bit Stereo 96kbps 44.1kHz recommended
Other audio settings are also acceptable.

Other resolutions and quality levels for regular 16:9 video:

4K/UHD – 3840×2160 at 14Mb/s (at ~30fps). We don’t recommend this, because even though 14Mb/s is our balance of quality vs size for streaming, many people are on internet connections that will struggle to stream at this bitrate – and most people cannot tell the difference between HD and 4K/UHD video on a computer screen. People use this only when using 360 video and only then if the subject matter needs extra visual quality.

1280 x 720 at 4Mb/s at ~30fps – this is popular on the web.
People use this if they are embedding their videos at a smaller-than-HD size, or want to use less data, or want a video to last longer than 8.5 minutes within the 500MB file size limit (see below).

640×360 at 1Mb/s at ~30fps – this is considered very small and low quality in the modern era – though not long ago it was what most web videos used to be!
People use this if they are embedding their videos for smaller mostly-mobile screens, or need to be streamed by people with very low speed internet connections, or want to use much less data, or are making an audio-only experience, or want a video to last a long time within the 500Mb limit, delivering on mobile only.

What settings should I use for static images?

1920 x 1080 pixels resolution recommended – but any size is possible within the player’s 16:9 rectangular frame. Resize using the Adobe image converter linked below.

JPG at 8/12 or 75% quality recommended.

We also accept PNGs but they are larger and take a bit longer to load.

We do not accept webp images yet. Please convert them in your computer’s image software.

To convert image file types (eg png to jpg), crop, or change frame sizes:
On Mac: Open the file in Preview, make changes and choose File>Export.
On PC: Open the file in Photos, click the three-dot menu icon at the top right corner of Photos and choose Save As…, then in the new window click the “Save as type” dropdown menu and change the file format to jpg.

Or use the Adobe image converter online – click the Features menu at the top here for lots of options.

What settings should I use for 360 VR videos?

Stornaway.io creators can add 360º videos to their stories and link them up using on screen links to create interactive experiences that are even more immersive.

We support Equirectangular/Sphere video at 360º. See settings below for how to activate this once your video is uploaded.

360 videos should be 2:1 width to height ratio, rather than regular 16:9.

The files that come out of a 360 camera like an Insta 360 are huge – both in their height & width resolution and in the amount of data they use. 

For Stornaway, we need to stream these files to people all over the world with different internet connection speeds and data costs, so we need to be very efficient about the balance of quality and file size so that the files will stream and it won’t cost too much.

So we compared notes with other streamers and chose a balanced resolution and file size of 2880×1440 for the web at data rate quality of 14 megabits per second if you’re publishing just on the web.

And we recommend you export your videos for upload at 3840×1920 and 20 megabits per second of you’re also planning to publish to VR via our App Builder.

Stornaway currently has an upload limit of 500MB per clip (for all sorts of good reasons) which is about 5 minutes per clip at 14 megabits per second and 3 minutes per clip at 20 megabits per second. 3 or 5 minutes are usually more than enough for an interactive clip – but if you want longer, there’s a way to join up longer clips described below.

The next question is, do you want to take clips direct from your camera app into Stornaway, or do you want to put them into a video editing app like Premiere or Final Cut first? 

If you’re taking it out of the camera app (eg Insta 360 Studio) into Stornaway, you should export it at the above settings, depending on whether you’re making it just for the web or for both VR apps and web.

If you want to take it into an editing app first, then you should export it from your camera app at the original resolution to keep the quality highest in your editing app and improve flexibility for later – and then when your edit is done, you should export from your editing app using the above Stornaway settings.

More about 360 in Stornaway

Your project can be entirely 360, or a mix of different media. Each Story Island is its own unique section. You can link from 360º to regular 16:9 video and stills in different story islands, and it will all flow on seamlessly. They all show with the Stornaway links you know and love.

To ensure your 360 video plays as intended, set the 360 projection within the video upload settings in your island sidebar.

In your project settings, tick the “use device orientation” button to enable those watching on iOS to trial out beta version of this device orientation feature.

Why is my file not completing its upload/transcoding/converting process?

Videos should process quickly – they should take much less time to process than their playable duration.

Have you checked the Video Upload Queue in Settings for your project? All videos should have a Complete status soon after upload.

If they are stuck on Transcoding or Processing, the most likely cause of it not processing is that the file name is too long. There is a limit of 120 characters for the combined project name and file name in the URL of the streaming video file.

Try shortening the name of the file – let us know at support@stornaway.io if that doesn’t fix it, or if you’re having another problem.

Why is my video showing in the preview player but not in my published project?

The Preview player shows all the recent changes you’ve made to the map.

The Published version of the project is a snapshot of a moment in time. So if it’s not showing the latest changes, that’s because it’s showing a version of the project that you published previously. It won’t auto-update.

When you’ve made changes to your project after publishing once, you have to re-publish to make those changes visible in the Published version.