Platform

Create Journey


Overview

Learn how to create new Journeys in Novel, by selecting videos from you library, entering the studio, making your videos shoppable, and creating a Journey ID code to paste into the relevant section of your page within Shopify's theme editor.

Create Journey

Add Videos to Library

The first step in creating a journey is to add assets to the Library. Navigate to Library by clicking the first link in the header navigation. Then click the green Add Video button at the top right of the screen. This will trigger a modal with four options: Upload File, Instagram, TikTok, Fera.

Select either Instagram or TikTok to upload from those platforms. If you have not yet connected, you can authenticate.

From here, a Select an asset, modal will appear. You can select one or more image or video assets from your linked social media account by clicking the checkbox on each thumbnail. When you have selected the assets you would like to upload to the library, click the green Upload Media button in the bottom left of the modal.

You will return back to the Library page with a notification bar at the bottom stating that your assets are uploading. This will resolve quickly once your assets have uploaded.

Select Videos in Library

If you are onboarding to Novel for the first time and uploading videos during this process, you will be directly placed into the Novel studio.

The studio is Novel's workspace where you make your assets shoppable. In the main area there is a large placeholder for adding content to your Scenes. You can customize the names of your scenes via the left panel.

To start, click the central cloud upload icon to trigger the Select an asset modal. Within the select an asset modal, there is a grid of asset thumbnails. Each asset thumbnail includes a checkbox to select the asset.

If you want to create a journey from uploaded videos, simply click the checkboxes next to one or multiple videos and click the Create Journey button that appears once you start checking.

Enter Studio

The studio is where yo you to tag products to your videos and customize purchase CTAs in order to create an engaging shoppable experience.

The interface is divided into three main sections.

The left sidebar lists different scenes in the video. You can navigate through these scenes by clicking on the relevant scene name.

The central panel displays the video you are editing. Here, you can view the video content and decide where to add product tags.

The right sidebar is dedicated to product selection. This section allows you to browse products from your Shopify catalog and tag them in the video.

Rename Scenes

To rename a scene (scenes are individual videos, that together, represent the media contained within a shoppable journey embed), locate the scene you want to rename in the left panel of the studio. Click on the video title directly to begin renaming your video.

Open App Store

To make your videos shoppable in Novel, start by selecting the video you want to edit from the studio. Click on the video thumbnail to bring up the options.

Next, locate and click the Open App Store button. This button is found at the bottom center of the video thumbnail and will allow you to access the app store to add functionalities to your video.

Call to Action Options

After clicking the Open App Store button, you will be presented with several call to action options. These include Shopify, Postscript, Webpage Embed, and Button.

To select an call to action option, click on its corresponding Add button. If you choose the Shopify Storefront option, you will see a checkmark indicating it is selected.

  • Shopify Storefront - Integrates shoppable products directly into the Novel videos.

  • Postscript - Add Postscript integration for SMS phone number input.

  • Webpage Embed - All call-to-action options can be embedded within the video (e.g. iframe).

  • Button - Add a buttons to your video which directs users to any URL that you set.

Add Products

Click the Add button next to Shopify Storefront. In the app store, you will find options to add products to your video. You can search for and select the products you want to include in the video.

Add Single Product

You can either add a single product or create a custom collection of multiple products to feature.

To add a single product, select the Add button next to the product name. This will embed the selected product into your video, making it shoppable.

Create Custom Collection (multi-product)

To create a custom collection, choose the Add button next to the custom collection option. You can then select multiple products to feature in your video. and write and optimize your CTA buttons.

Preview Journey

After you have finished adding the appropriate videos and products in the Studio, click Preview in the top right to enter Preview Mode where all visual customization of your product will take place. Here you will get a 1:1 view of exactly how your journey will appear on your website.

In the Customize Theme right-hand sidebar, you have several options to tailor the appearance of your shoppable video feed. These options help ensure that the embedded feed matches your brand's style.

First, you will find a checkbox labeled Include Headline. When checked, it enables a text field where you can input your desired headline. This text will appear above your video feed.

If you keep it checked, there are Typography Options that let you match the headline's font style with your Shopify theme or choose from a list of Google fonts. This ensures that the text aligns with the overall look of your store.

Text Alignment Dropdown allows you to select how the headline is positioned. You can choose to align the text to the left, center, or right.

The panel also provides Color Pickers for different elements: the headline color, background color, and brand color. You can click on these color pickers to open a color selection tool, where you can choose the exact shades that resonate with your brand's palette.

Additionally, there's an option for a Transparent Background. By checking this box, you can make the background of the headline area see-through, which can add a subtle, polished look to your store's design.

Each of the different layouts contain different options in the Customize Theme sidebar menu, that you can learn about on the respective layout pages (spotlight, carousel, overlay, stories).

After you have configured all your options within the Customize Theme sidebar, click Publish. After clicking Publish you will trigger a Publish & Install modal. Click Publish again.

Copy Journey ID

From the Publish & Install modal, after clicking Publish, two copy-to-clipboard buttons will be exposed. One is Shopify: Copy Journey ID, the other is Non-Shopify Website: Copy Embed Script.

Click the copy-to-clipboard Shopify: Copy Journey ID button. The journey ID is important because it serves as a unique identifier for your video content. When you embed the video on your Shopify store, the journey ID links the specific video to the page, ensuring that the correct video is displayed.

Embed Your Journey

Your journey won't be complete until you embed it within your Shopify theme editor. Note that this cannot be done directly from the Novel studio where you created your shoppable journey.

You are ready to start embedding shoppable videos on your Shopify webstore. You can learn more about embedding journeys via our embed journey guide.

We highly recommend before viewing our embed guides that you check your Shopify version, especially if your Shopify store has been existence before 2021 and you are uncertain as to whether it is on 1.0 and 2.0. There are some meaningful differences in setting up Novel for your webstore depending on your current version.

For that reason, we have a dedicated guide on checking your Shopify version.

Frequently Asked Questions

  • If you have uploaded a video and it is not showing up on your website, first, please make sure that you clicked Save, Publish, Publish again and also copied and pasted the journey ID into the relevant field in Shopify.

  • Yes, Novel will detect differences between the compare-at price and display the discounted price. If you do not see this reflected in your storefront experience, please reach out to support and we will investigate.

  • Scene names are changed within the studio by clicking the video's current name within the Scenes sidebar in the studio.

  • No, there are no limits.

  • The former adds a Novel Journey to a single product page, the latter adds it to all of your product pages. If you want to add a Novel journey a page (i.e. a single page), then please follow the Add to Product Page guide above.

  • View the left panel in the studio menu and click a video. This will trigger a field editing function where the name is renamable.

  • Currently, after exiting a journey, the page scrolls back to the top of the page that the user accessed the journey from.

    We are optimizing this part of our product experience on our near term roadmap.

  • Novel can be embedded on any webpage, including WordPress/WooCommerce. However, shopping features and data integration are primarily focused on Shopify storefront owners.

  • To rename a video, select the video from the list on the left panel. Click on the current name, type the new name, and press Enter to save your changes.

  • Check videos in your library via the checkbox on the left of every video thumbnail and click the Create Journey button that appears in the bottom center of your screen.

  • The video list is located on the left panel of the Organize Videos screen. It shows all your video scenes and allows you to select, organize, and rename them.