Step 2: Preview Your App

After you create your app, a preview of your web app appears in the browser. You can adjust the look and feel of your app with the colors and styles you want.

• Preview and Customize Your App
• Save Your Design as a Theme
• Share a Preview Link to Your App
• Preview Your App on a Fire TV Device with Amazon Creator Preview
• Next Steps

Preview and Customize Your App

1. If you haven't already created an app, see create your app first. After you create your app, a preview automatically appears in the web browser. If you don't see the preview, click Manage Apps, and then click the Preview button next to your app.

   Use the virtual remote to play and navigate the videos. This virtual remote simulates the same directional pad on a Fire TV remote control.

   

   Important: You can't use your mouse to interact with the web app in the Internet browser preview. You have to use the virtual remote to interact with it. For example, if you use your mouse's cursor to expand the category navigation bar, the nav bar won't respond. Instead, to select an option from the category navigation bar, use the virtual remote — click the up arrow followed by the center button to expand the items. The center button expands or plays what you have selected with the arrow buttons. The following video shows a demo.

   In the category navigation bar, in addition to any categories from your feed items or sections within your YouTube Channel, you will see an "About" page. This About page is automatically included and required as part of the attribution for using YouTube API services in the app. You cannot remove or customize the About page, nor can you add your own custom pages in the navigation menu.

2. Customize your category navigation bar by configuring your YouTube channel with sections based on playlists. For MRSS feeds, customize the category navigation bar by adding category tags to your feed items.

   Tip: In YouTube, a section is an area within your channel that groups a specific type of content (for example, a playlist). After you assign playlists to different sections in your YouTube channel, the category navigation bar in your Amazon Creator app will show those playlists. But the category navigation bar won't automatically show playlists that aren't assigned to sections. Additionally, not all section types are supported. See Group Videos into Playlists in Your App's Category Navigation Bar for details.

   Note that the thumbnail images from YouTube include black bars at the top and bottom of the thumbnails. This letterboxing is by design — it is the image YouTube provides through their API.

3. Use the virtual remote to explore your app, making sure each option in the category navigation bar loads content.

   If you have an option in your category navigation bar that does not load any content, remove that section from your YouTube channel. Any apps with options that fail to load content will not pass the Appstore submission tests.

   If you desire, you can hide the Latest item (which gets the 50 most recent videos from your channel) from the category navigation bar. You might want to hide the Latest item if clicking it returns a "No Content Found" error and you don't want to adjust your YouTube channel sections. To hide the "Latest" option, go to Manage Apps, click Advanced in your app details, and see the Categories Navigation Bar Options section.

   Note: If you change your YouTube channel's sections or videos and want to see the updates, you need to reload the app preview. Click Manage Apps and then click Preview next to your app. If you don't see the updates, your browser might be caching the old files. Either open an Incognito/Private tab, or clear your cache. To clear your cache, see instructions for your browser: Chrome, Firefox, Internet Explorer.

4. To change the look and feel of your app, click Edit in the upper-right corner.

   The app loads with a visual editor in the sidebar to change the colors, images, and font:

   

5. In the Logo section (in the upper-left corner), click Choose a file and upload a 500px x 500px size image for your logo.

   The logo appears in the upper-right corner of your app. This image is used only within your app. (It is not the app logo tile that is used to promote your app within the Appstore, but it should probably be the same design.)

6. Adjust the colors and background images for your app as desired.

   Tip: Colors might appear differently on TV monitors than they do on your computer. As a best practice, test your colors on an actual Fire TV device. You might find the color palettes and themes in Google's Material Design principles helpful.

   Note that to view the Title Bar/Navigation area, you must use the virtual remote (as shown in the video above) to navigate your app rather than clicking the category navigation bar with your mouse.

7. Click Save to save your style selections as a theme. see Save Your Design as a Theme below for more details.

8. When you're done, click Finish.

   With your app styled and customized, you're ready to Publish Your App in the Amazon Appstore so that others can download and view it.

Save Your Design as a Theme

While editing the look and feel of your app, click the Save button to save your style selections as a theme.

You can save your current theme settings as either a new theme or overwrite an existing theme. (You can't overwrite any predefined themes, such as Default.) Here the theme is saved as "mytheme."

Your saved theme then becomes available in the "Current Theme" option above the app preview:

After you save a theme, it will be automatically applied as the active theme of that app.

Saving themes allows you to not lose your work, and to experiment with different styles for your app — without having to reconfigure everything from scratch when switching back to a previous design.

Share a Preview Link to Your App

If you're collaborating with others on your app's theme, you can share a preview link with others. (Others won't need an Amazon login to view the preview.)

1. Click Manage Apps in the upper-right corner.
2. Copy the Test URL that appears in your app's details.
3. Send this link to others for review.

The link expires after 30 days but can be renewed by clicking Renew.

Preview Your App on a Fire TV Device with Amazon Creator Preview

You can preview your app on a Fire TV device by using a companion app called Amazon Creator Preview.

To preview your app with Amazon Creator Preview:

1. Click Manage Apps in the upper-right corner, and then copy the Amazon Creator Preview Code that appears in your app's details.
2. On your Fire TV device, download and install the Amazon Creator Preview app. (To search for the app, hold down the microphone button (if you have one) on your remote and say "Amazon Creator Preview.")
3. In Amazon Creator Preview, enter your Amazon Creator Preview code.

Next Steps

When you're ready to publish the app into the Amazon Appstore, see Publish Your App. As part of the publication process, you will need to provide a variety of image assets and descriptions to promote your app within the Amazon Appstore. Your app will also need to be approved by the Appstore before it goes live.