Create Your First Watch Face

Creating a watch face is simple using Galaxy Watch Studio. In this tutorial, you’ll learn how to start a project and then design a basic analog watch face and a digital watch face.

Once you understand the basics of creating a watch face, you can try out more features to create unique and interactive designs.

Start a Project

A project is a collection of files that make up your watch face (such as image, font, and XML files). You can start a new project, open an existing project, or open one of the sample projects provided with Galaxy Watch Studio.

For this example, you will start a new project.

  1. Launch Galaxy Watch Studio.

  2. If the New Project window is not displayed, from the main menu bar, click File > New to start a new project.

  3. Click New.

  4. Enter a Project Name. The name cannot contain special characters such as: < > * : ” / \ | @

    Do not include spaces in the project name. The Project Name is used to name the .TPK or binary file. You cannot upload a binary file to Seller Portal if it has a special character or space in its name.

  5. Click OK.

    You now have a blank canvas on which to design your watch face!

    See Development for an overview of each area of the Galaxy Watch Studio interface.

    Use File > Save As to save the file in another directory or to rename the project.

Design an analog watch

Create an analog watch in three easy steps.

Step 1. Select a background image

Step 2. Add an index

Step 3. Add watch hands

  1. Select a background image

    On the left side of the window, from the Component menu, click Background, and select a background image from the files provided by Galaxy Watch Studio (or, you can import a custom image).

    The size of the background is 360 x 360 px. However, you may import images that are larger or smaller.

  2. Add an index

    An index is one or more markers that circle the outermost part of a watch face. For example, an index can be used to indicate the hour or minute on an analog watch.

    From the Component menu, click Index. You can select a full set of markers, a single marker, or import a custom image.

  3. Add watch hands

    a. From the Component menu, click Watch Hand, and select one from the files provided or import a custom image.

    b. Configure what the watch hand measures (for example, hours, minutes, or seconds). Select the watch hand. In the Rotation Properties section of the Properties window, set the Sync with option to the appropriate measurement. For example, selecting Hour in Day configures the watch hand to point at the hour of the current time. So, if it’s 2 o’clock, the watch hand would point at the number 2.

    c. Repeat steps a and b to add and configure additional watch hands (that measure minutes and/or seconds).

    d. From the main menu bar, click File > Save to save your project. You have created an analog watch face!

Design a digital watch

Create a digital watch in three easy steps.

Step 1. Select a background image

Step 2. Add a digital clock

Step 3. Customize the clock

  1. Select a background image

    On the left side of the window, from the Component menu, click Background, and select a background image from the files provided by Galaxy Watch Studio (or, you can import a custom image).

    The size of the background is 360 x 360 px. However, you may import images that are larger or smaller.

  2. Add a digital clock

    From the Component menu, click Digital Clock. A digital clock that shows hour, minutes, and seconds is placed in the center of the watch face.

  3. Customize the clock

    Customize the clock by setting one or more of its properties. Select the clock in order to view its properties in the Properties window.

    Configure the ICU Format to customize what the watch displays. You can select a predefined format or you can create your own. By default, the watch is set to a 24-hour format (HH:mm:ss). To set the watch to a 12-hour format, you can edit the ICU format by replacing “HH” with “hh”; or you can select the predefined ICU format h:mm a. Click on the icon for more information about ICU formats.

The selected digital clock’s ICU Format has been changed to display the day of week, date, and year. It uses the default Appearance settings. Note that the size of the component is too small and all the data does not fit in the designated area (the plus sign denotes that not all data is displayed).

The selected digital clock is the same size and shows the same data as the clock above. However, its font size was decreased so that all the data is displayed.

From the main menu bar, click File > Save to save your project. You have created a digital watch face!

Now that you understand the basic steps for creating a watch face, start experimenting with the properties for each of the components and try importing your own graphics. For a tutorial about using your own graphics, see How to Import You Artwork and Create a Watch Face Using Galaxy Watch Designer.