tutorials | galaxy watch, marketplace
Create Eye-Catching Galaxy Store Listings With The Watch Asset Creator
Senior Developer Evangelist
NOTE: This article was updated on 3 September 2019 to reflect changes to the tools and processes used to create Galaxy Store listings.
If you’re serious about your watch apps and watch face designs appealing to a wide audience, it’s important to put thought and effort into how your content is displayed in the Galaxy Store. Thanks to the new Galaxy Store Asset Creator, creating a professional-looking Product Detail Page is no longer a time-consuming endeavor. In this blog I’ll guide you through the process of using the tool to reduce the time it takes to publish your watch apps and faces.
How Does It Work?
The Galaxy Store Watch Asset Creator easily exports the assets you need to publish your watch face to the Galaxy Store. In order to take advantage of the tool's special features, you must use Photoshop version 16.0 (CC 2015) or later and have a basic understanding of Photoshop. Earlier versions can open the file, but functionality may be limited.
This Photoshop template uses multiple artboards and the Generate Image Asset feature to greatly reduce your design time. As you work with the artboards, each asset is updated with your current artwork. These assets include the icon shown in the Galaxy Store directory, the cover image that appears at the top of the watch face page, as well as the product images known in the Seller Office as screenshots.
This tool is a good starting point, but I encourage you to experiment with and customize your designs so they stand out from the competition.
Using The Tool
The first step is to capture your watch face design. The easiest way to do this is to take a screenshot while using the [Run] emulator in Galaxy Watch Designer. This lets you set a custom time and change additional data readings like heart rate, battery power, and date, which is a great way to highlight specific watch features. To take a screenshot, click the Preview Capture button in the Run window.
Open the screenshot in Photoshop and select the full canvas area. Copy it to your computer’s clipboard by using the [Copy] command.
Next, open the Galaxy Store Watch Asset Creator Template. Photoshop automatically generates a folder containing all of the required assets using the default imagery. If this folder is not generated, go to [File] > [Generate] and select [Image Assets]. Keep in mind that the artboard name must end with the file extension .png or .jpg for an artboard asset to be generated. Choose PNG if you want any part of the background to be transparent and JPG if the background is to be visible.
There are a total of 11 artboards. The first artboard shows what the Galaxy Store watch page looks like to help you better understand the size and location of each asset. The remaining artboards are used to produce the required assets, and include the icon, cover image, and eight product images. The default layers are simply suggestions for each artboard; you are free to select different backgrounds, add additional layers, and customize the elements as you like.
When you open an artboard in the Layers window, you have the option to select different watch frames, add a highlight to the watch screen, add text, and change the default watch face.
One of the best features of the Asset Creator is that when you change the default watch face for one artboard, all artboards update automatically.
To change the default watch face:
- Open the sub folder titled Watch Face from within one of the artboards and double-click the layer titled Watch Face Artwork. This opens the embedded Smart Object for the watch face.
- Since your watch face was copied to the computer’s clipboard previously, use the Paste command to place your custom watch face above the default watch face.
- Delete the default watch layer, then save and close the Smart Object. When you return to the Asset Creator file you will see that all instances of the watch face have been updated with your custom watch face design.
Working With Artboards
To customize the look of the artboard assets, I like to start with the Icon.png artboard because it’s the one most visible to the public. This icon is not only shown on your watch face store page but also in the Galaxy Store directory for all watch faces.
You can choose to display your icon in a specific Galaxy watch by turning on one of the watch layers in the Layers window. You can also select one of the preset backgrounds, change the color of a background, or place your own custom background design as a new layer.
Cover Image The cover image is the initial graphic users see when they view your watch face design. If you are looking to incorporate a background photo, I’d suggest a website like pexels.com. There you will find lots of commercial free backgrounds that you can use in your assets.
Screenshots Screenshots are the product images of your watch face design. This is where you showcase the different features and alternate styles.
- Vertical Screenshots: These are a great way to show the details of your design. When the user clicks a screenshot, the image is enlarged to fill the entire phone screen when held vertically.
- Horizontal Screenshots: Use horizontal screenshots to display functions and features because there is room to incorporate text. However, since users generally hold their phone vertically, horizontal images will appear small. Users must turn their phone horizontally in order for the horizontal image to fill the screen.
- Portfolio Screenshots: Showcase your other watch face designs by adding them to the Portfolio Artboard. Rather than showing the Smart Object of your featured watch face, simply add your other designs as new layers in the Watch Face subfolders for each of the Galaxy watch models.
Adding Artboards For Additional Assets If you would like to add additional Artboards to the template file, select [Layer] from the top nav bar and then [Duplicate Artboard…] from the dropdown menu. In the Dialog window that appears, type a new Artboard name and include the file extension .jpg at the end. Doing so will auto-generate the new artboard as an additional asset in your asset folder.
Be Creative The Asset Creator is a great starting point to help speed up your watch face publishing process. As you get more comfortable with the tool, apply the same level of creativity to your layouts as you do your watch face designs.