Please go to this Reddit forum for all your Comments, Questions & Suggestions.
https://www.reddit.com/r/watchfacebuilder/
Garmin Device App Online Builder is a powerful and flexible design tool to build a Garmin device app. This guide will walk you through how to use the various tools within the Garmin Device App Online Builder interface.
How to install watchface
Follow this post to install your app to your device.
How to install watchface : watchfacebuilder (reddit.com)
The following are manual steps:
Go to the top right section that says “Save & Build” clicking this will download a zip that contains the watchface
- download the zip file and unzip it, you should get a .prg file.
- connect your watch to your computer with the device’s USB cable.
- wait till the icon of your device shows up, double click to open it, and you should see the Garmin folder, open it, and double click to open the Apps folder in this Garmin folder.
- drag the unzipped .prg file into this Garmin\\Apps folder.
- unhook your watch and your designed watchface should show up in a few seconds.
Note- If you’re using a Mac you’ll need to download Android File Transfer utility
Working With Widgets
Selecting Widgets
Widgets can be selected by either left-clicking them, dragging a selection box around them, or clicking on the widget’s tile in the Widgets panel.
To select multiple widgets at a time, hold down shift while selecting them, or drag a selection box around the widgets you wish to select.
Moving Widgets
Once selected, a widget can be moved either by dragging it, or using the arrow keys on your keyboard. For smaller movements, use the shift key and arrow keys at the same time.
Resizing Widgets
Once selected, a widget can be resized using the resize controls in the corners of each widget. (Please note that some widgets must be resized using the font option in the widgets panel)
Rotating Widgets
Once selected, a widget can be rotated using the floating rotate control that appears above the selected object.
Deleting Widgets
Once selected, a widget can be deleted by clicking the Delete button at the top of toolbar, or press Delete key on your keyboard.
Duplicating Widgets
Once selected, a widget can be duplicated by clicking the Duplicate button at the top of toolbar.
Widget’s Alignment
The default widget’s alignment will be center, which means the content of that widget will be centered. If you want the content starts from a certain left position, you should choose “Left” alignment. And if you want the content ends at a certain right position, you should choose “Right” alignment. Content will always be centered vertically.
Color Palettes
Browsing Color Palettes
Garmin Device App Online Builder features a powerful palette system for dynamically recoloring your label design. Click the Browse button within the Global settings section on Widgets Panel to select color scheme in hundreds of palette options.
Palette Variations
Each palette is available in four different variations, and each variation changes the order that the palette’s colors are applied to your design. To try a different variation, click the Swatch in the Global settings section on Widgets Panel.
Swatch Assignments
The palette system assigns a color swatch to each of your widgets based on widget type, however once selected you may wish to make further changes to some of your widget’s color assignments. You can assign a different swatch position by dragging the four color boxes to re-arrange the color order. Feel free to make further changes to your design’s colors until everything looks just right.
Widgets Panel
Selecting Widgets
Each widget in your design is represented by a tile within the Widgets Panel on the right side of the editor. Selecting any widget in your design is as simple as clicking on its associated tile, even if that object is below another object.
Locking Widgets
A widget can be locked or unlocked by clicking on the Lock Icon within that widget’s tile. When a widget is locked, you can only select that widget by clicking on that widget’s tile.
Widget Visibility
A widget can be hidden or made visible by clicking on the Eye Icon within that widget’s tile.
Math Expression
You can use math expression to extend the build-in data fields. For example: (ds9) – 10 will return 10 less of current heart rate from sensor history.
How it Works?
This section provides a brief description of process.
When you first open the Garmin Device App Online Builder, you will need to select which Garmin device you want to build an app for. This is where the real fun begins and where your creativity will be called upon. <…brief steps…>
Once you have your design setup up exactly the way you like it, click “Build App” on the top right corner. Wait a while, and your app file’s download link will be displayed or an error message will show if there is any error.
Download the zip file, unzip it, copy all files on to your device (Garmin\Apps folder), and launch it to see it action.
If you have an account with us, you can sign in, and click “Open” to retrieve your previous designs.
Hello, it seems like I am having trouble with my watch face. It won’t show on my watch which is a fr235. Could it possibly be the seconds sleep thing added? I have made watch faces with the exact same data and they work. My app id is 61e46d8013e07.
Thank you for the great application – it really helps on my Venu2.
Maybe a very simple question: on the shapes/basic shapes only the line works on my side (in both Opera and Firefox), but none of the other basic shapes. While the line is automatically copied to the watch face, the other shapes just dont react at all (while the other shapes all work fine). Any idea?
Best
C.
One of the reason I can think of is that line height is too thin and when your device renders it, it got removed. Could you please send me your appid so I can take a look at it in my simulator.
Thanks,
here
It is really strange, because the “line” gets copied without any issues from the basic shapes, but the rest of the basic shapes are not. The “copy” part just doesnt happen and the view does not change to the watchface (as it does with the “line”).
I just realized that the “rect” (rectangle) from the “other shapes” does work, which is fully sufficient for my purpose as a workaround.
I see what you say. I found the bug and fixed it. You should be able to click those basic shape icons to add them to canvas now.
Thanks,
Please, pressure chart does show values the opposite way. Past values are at the right side. Can you please check my watchface 61de9785d4e4c ? Thanks
Thank you so much for reporting the bug. I think I found and fixed it. Please repopen your design in builder and click “Save & Build” to get the latest version.
Thanks again,
Now it works fine, thanks!
Dumb question. On temp chart. The min and mak would be the low/high temps I want Displayed? min=0 and max 100.
If you set min/max for a chart, the y-axis will have values from min to max.
For example, if you set temps min=0,max=100, and temps’ range is from 55 to 65, then the chart will be drew along a line at 60% height.
If you set the min/max too narrow, and the history data’s range is bigger, the chart will be drew outside the chart area.
Hope this makes sense for you. Let me know if you want me to create a demo for you. Thanks,
Many thanks
Hi, is it possible to upload your own design to the Connect IQ store ?
No, Connect IQ store won’t accept prg file.
WOW!! The new site UI looks amazing.
Thank you.
How exactly can I upload the design to my Fenix 6X? it’s not clear to me how i gain access to the Garmin\Apps folder you mention “Download the zip file, unzip it, copy all files on to your device (Garmin\Apps folder), and launch it to see it action.” thanks
First you will need to connect your watch to your computer via the charging cable.
If it’s PC, you should be able to see your device storage shown on your desktop, or you can open it in File Explorer. If you have Mac, I believe you will need a software (Android connect?), and your device will show up on your mac desktop.
Double click the watch icon and go to Garmin\Apps folder, then drop the xxxxx.prg to it.
Hi. could you look at 61df7538aff0d doesnt want to load. was working earlier then changed graph and placement now it doesnt load on watch.
I was able to open it in my simulator. It looks nice that you are already add a layer mask on top of time strings.
There are a lot of datafields in your design, and my front server is a small server with less memory to compile, so it gives me “out-of-memory” error, then for a few seconds later, it got transfer to my 2nd server, and your design was compiled successfully.
thank you, for some reason it was not working while I had another face loaded.
How do you actually download the file and view it on the watch. My laptop won’t let me open the file as it’s a prg.
Thanks for this site, it’s amazing!
Hope I’m not stepping on any toes here, but I can answer your question. Hook your watch up to your computer with the USB cable. Once your watch shows up as a drive, just copy the prg file into the Garmin/Apps folder. Once you unplug your watch and it restarts, voila, it will be there just like your other watch faces.
Thank you, randypenn!
Hi, thanks for sharing that page. i really like to work on my one watchface.
I have a Fenix 5 plus.
Two points:
1. Is it possible to get a bigger Time? The biggest is size is 58, but i like it if it´s over the hole screen.
2. weather: you mentioned: “Right now this online builder only uses Garmin weather data, and unfortunately your device (fenix3) doesn’t have it. In the future I will pull weather data from an online source so all devices can have those data fields.”
I think that also means that my fenix 5 plus can´t work with weather – right? Do you know when you will change that to an online source?
Thank you so much.
Greetings
elifendt
You will need a custom font for #1. The BMF (bitmap font online builder) is not working right now. After I fix BMF, I will working on adding new features to builder.