Garmin WatchFaces Online Builder

Watchface Builder for Garmin


Version 7.4.0

  • Added: Curved Text

Curved text is added into the datafield. Check out this demo:

Watchface – Watchface Builder for Garmin

The curved text only apply to data field. After you add the datafield to the canvas, move it to where you want it to be displayed, and click “Curved Text” checkbox, the builder will automatically calculate the rotating angle as well as rotating center.

You can adjust those numbers (radius, angle, x, y) in the left side widget section.

Version 7.3.6

  • Added: two animation controls

Animation layer can be set to play once or play in infinite loop. You can also set the animation layer either on topmost or bottommost (but still above the background layer).

Check out this demo: Watchface – Watchface Builder for Garmin

PS: animation uses up a lot of memory, I tested it on my Fenix 6 pro, and it ran out of memory on a big animation file. So if you see IQ error, it might be out of memory, make the screen size small, and/or cut it shorter.

Version 7.3.4

  • Added: Animation
  • Added: Clone button (under appid text box in the global section)

Animation is supported now. Please check this demo:

animation demo – Watchface Builder for Garmin – Watchface

The limitations of animation layers are:

  • Only one animation video can be added
  • Animation layer will always on the top layer
  • Animation layer will be hidden automatically during the low power mode

The builder will accept animation gif file as well as any video files. Please consider the limitation of your device’s memory, as well as the battery life.

Version 7.3.3

  • Added: Smooth rotating second hand
  • Added: SVG path editor for clock hand

You can add a smooth rotating second hand under Date/Time menu. During the high power mode, the second hand will rotate at most 10 times per second. It will make the rotation look smoothly.

I also forked a github project (Yqnn/svg-path-editor: Online editor to create and manipulate SVG paths (github.com)), adjust a few settings and add a few stock hand shapes. You can click “Modify hand shape” button to create your own hand shape.

Check the “How to use” on the bottom left corn to learn how to use the tool.

Version 7.3.2

  • Added: global variables
  • Added: code block

You can declare global variables under widget’s global section. Choose the variable name carefully, make sure it will not conflict with others. I suggest you add a prefix “g_” for the global variable name.

A new code block data field was added under data field menu. It replaces the custom code data field. You can access your global variables declared under global section, as well as local variables like:
1. x, y: the code block’s position
2. now: the current time

Version 7.3.1

  • Updated: AOD pixel estimation

New estimation algorithm for AOD mode. Click “AOD” tab on the top left corn, then under global widget section, you will see a button to calculate the percentage of on-pixel in AOD mode.

Half of the on-pixels in AOD screen will be toggled on/off by app automatically, so if the estimated percentage is less than 20%, the message will be green. But because some characters could light up more pixels than others (ex. letter M vs . (dot)), you should give yourself a little bit of wiggle room when designing your watch face.

Version 7.3.0

  1. Added: InstallGWF 1.0.0
  2. Added: SVG-like rotating hand
  3. Added: Data fields from Activity Monitor heart rate history
  4. Added: Expression on the background color
  5. Added: Expression on min/max values for chart
  6. Fixed: a bug on empty expression
  7. Fixed: a bug on SVG id
  8. Fixed: a bug on updating color

You can install your watch face app using the new released program InstallGWF. Please check this post about how to install, and how to use it. How to install watchface : watchfacebuilder (reddit.com)

Rotating hand from svg path shape will not count toward 256 image limit for Garmin app. So you can add a lot more rotating hands in your design.

Background color can use the expression now. Now you can set the background color based on the data field’s value.

I overlooked those data fields from the heart rate history from activity monitor. It’s different from the heart rate history from sensor history. It seems to get updates every seconds during the high power mode.