My 1st watchface: MoveToBeActive

Hi all!

First I wanted to say that I'm not a Java/C developer at all and my last brief contact with those languages was 13 years ago. The closest that I could get to that is a broad experience with SQL, but not real app development.

The idea behind the watch face is that I have been using my current Garmin watch (Vivomove HR) for a few years now and plan to replace it sometime in the future. So I started researching how the new watches work and decided that I wanted to learn how to create my own watch face, as I thought that it would be fun.

So this post is seeking to share you with the link to my published watch face page and ask for your help/suggestions on:

  • Since I don't yet have a real watch to test custom watch faces, any feedback on how it is working on yours would be very much appreciated. I can see it's working on the simulator, but not sure how comparable that is to the real watch. The main focus here would be the existence of error messages, sensor figures accuracy and update frequency, etc.;
  • I do care about battery life, so that's why I decided to leave out the seconds hand and I'm ok with the heart rate and other figures being updated every minute or so. That's how I'm expecting it to work, but not sure if that's what's really happening or not;
  • I have published the open-source code on github, so in case you have some free time, please have a look at it and give me some feedback on how the code can be improved. I got to the max of my very limited knowledge on garmin watch faces, so not sure if everything is as optimized as it could be.

The link to my watch face is:

https://apps.garmin.com/en-US/apps/736a2d5a-3b08-4cb1-8358-461f7374b0c8

Thanks!

  • You shouldn't have published, but instead asked your questions in the discussion forum instead of showcase.

  • Sorry, my bad. The description of that area of the forum is too generic and doesn't help ("Discussion of all things Connect IQ"), but I should have entered it just to know what was discussed in there. Since this one was related to support of published apps, I thought it was the correct one.

  • Hi Felipe,

    Really great watch face, it's the first analogue watch face that I actually like! Battery life is really great as well, probably helped by the 1 minute update. Since you are currently working only in the simulator and you designed this originally for your intended new Vivoactive 4 that you may want to see what it looks like on the actual Vivoactive 4 screen.

    I was initially disappointed with the display of the garmin wearables since it does not output colours very well. They are not very bright . So the screen shot from the simulator of the "Vivomove green" color is far more yellow in reality. Linked below is some screenshots of the watch and also the settings screens, I know you were trying to  figure out how the settings work, I can't help with documentation infortunately, but I can show you how your current menu and settings screen looks. I would say the "Press menu for settings screen" is not needed, since it follows on from swiping up on the pencil icon to access settings .

    github.com/.../MoveToBeActive-screenshots

    Apologies in advance if you have already seen how it looks in reality. 

    I hope you find this useful, let me know if I can help in any way.

  • Hi , thanks a lot for your feedback and willingness to help! That is very much appreciated and it is indeed the first time that I'm seeing my watch face on the real vivoactive 4 Slight smile

    The settings menu that you can see is the standard one that Garmin gives to the developers as an example. I figured out by looking at the code that it should look something like that (different options and a toggle), but thanks for showing me how the menu is actually accessed using the watch, as I didn't have a clue of how that worked. While I agree that the "press menu" option is not needed for the vivoactive, I'm thinking that the reason why Garmin added that to the example is maybe because of watches that don't have a touch screen (like fenix 6)? Not sure though, I'll need to investigate it when I start adding things to the settings. I haven't started that yet, as I am still to figure out how to access that same menu using the developer simulator, but I'll remove most settings options, just for people to not think that it actually changes something (I'll leave just one there as a placeholder only).

    Regarding the colour difference, I understand that it probably will look different on the transflective LCD when compared to my IPS laptop display, but I'm thinking that maybe it looks kinda yellow to you because of the backlight being turned on? If even with the backlight off it does look yellowish, then maybe you can help me to pick a better colour from the ones available? Reference Guides (garmin.com)

    I'm currently using 0xaaff00, so maybe 0x55ff00 would look better? I was kinda worried that it would look too bright, but that is definitely never going to be the case on transflective LCDs anyway. Maybe it would be too bright on the Venu with an Amoled Screen? If you agree with changing the colour to 0x55ff00, then I'll give it a try on the next update (probably later today or tomorrow), leaving the Venu and D2 Air with the current colour.

    I would also like to have your input on the location text. I have a user saying that it should be better to show only the city name instead of city + country. Looking at your example, it actually doesn't look bad to have both, maybe because Berlin is quite a short city name and Germany is also not too big, but for other cities with bigger names I imagine that it might look bad to have both in there. Are you ok with removing the country?

  • The va4 is MIP (like most garmin watches) The Venu is Amoled and the venu SQ, lcd. See 

    https://developer.garmin.com/connect-iq/compatible-devices/

    for the display tech on the various devices.

  • Hi Felipe,

    No problem at all, as someone that also recently started experimenting with app development for Garmin CIQ I know how helpful to be able to get feedback of how things look on the actual wearable (I can highly recommend the Vivoactive 4 by the way).

    Interesting about the menu screen being in the standard template, you're right, perhaps it looks different on button watches. I haven't played around much with watch faces yet, so I'm not too sure..perhaps I'll experiment with how it looks without that screen.

    Regarding the color options, since your code is open source, I took the liberty of dowloading it and experimenting with different colour options to see what alternative greens look like. It does look perhaps a bit more green with the backlight off, but if you have gesture enabled backlight on, which most users probably do, its going to be on the yellow hue whenever you're actually looking at the watch. I think we're hitting the limitation of the MIP screen with the hue variation, so I'm not sure how much better the others look, but it may be helpful to you to make a choice on which you think is best! The images from the colors as shown on the watch have been uploaded to the Github page.

    I like the look of both city and country for the location string, but I can see how it would be too long for some locations. One option is to just show a country abbreviation, such as "DE"  for Germany, but that could be too much effort and the memory hit for the dictionary or whatever for assigning the abbreviation is probably not worth it. I think just showing the city would look absolutely fine. 

  • I released a new version now that is trying a new green tone (0x55FF00), which looking at your pictures seems to be better suited for transflective screens. I kept the old green tone for amoled watches, though.

    My solution for the location name was to keep both city and country in case they have less than 15 characters (comma and spaces included), but if it has more then it displays only the city name. Please let me know if it's still showing both city and country to you, after updating.

  • Great, it does look a biit more green, I like it! Sounds like a good solution for the location name. It still shows both city and country for me. Thanks again for the great watch face, all the best!

  • Thanks , glad you liked that one better. Today I've been doing some reading and testing on the settings menu and finally was (kind of) able to make it work on the simulator. However, I'm not sure if it's going to work on the real watch, so now I need your help.

    If you have some time, could you please test the new source codes that I have updated today on GitHub? Now you should be able to see a toggle for the accent color on the settings page. I'm going to wait until you can confirm that it is working, before publishing this new version on the IQ store. Fingers crossed! Fingers crossed

  • Hi Felipe,

    Just had a look for you. Getting to the settings page works fine, and changing the icon state works fine, but the onBack() command does not work...it pops to the previous icon state but stays on the settings screen. and gets stuck there! Only way to get out of it was to restart the watch. Once restarted it has the new colour, so that part works. Just need to sort out the onBack() function. Not sure what to suggest unfortunately..