[new clock] configurable analog clock (preview) #3826
Replies: 1 comment
-
Posted at 2022-01-06 by Andreas_Rozek Here are the available hands Attachments: Posted at 2022-01-06 by Andreas_Rozek And these are the configuration screens Attachments: Posted at 2022-01-06 by @gfwilliams This looks great! It's impressive how well the rainbow version works Posted at 2022-01-06 by Andreas_Rozek Thank you! Posted at 2022-01-06 by Andreas_Rozek Hmm, have I already mentioned that my wife loves the rainbow version? She didn't wear wrist watches for many years - until now: now she wears a Bangle.js 2 because I can customize it for her personal needs! Thanks again for the second incarnation of Bangle.js! It was the right decision to speed graphics up - even at the cost of a decreased space and color resolution! Posted at 2022-01-06 by Numerist I'm impressed. You know what I think of the current bizarre way of keeping time, but this is a really creative set of displays for it. My only question is whether you can soften the sudden changes in the rainbow 7-8-9 area. The 8 appears to be the odd one out. Posted at 2022-01-06 by Andreas_Rozek Yes, the 8 turns out to be too dark for a black background - and the 2 too light for a white one. Let me see what I can do in both cases... Posted at 2022-01-06 by Serj The rainbow version really looks very nice. In general, the app is great! Customization is very good, in the future you can add new elements, clock hands if you want. Let's say you can add Roman numerals. Posted at 2022-01-06 by Andreas_Rozek For those interested: I have a small program for you which you may use to fine tune the colors for the colored clock face:
My idea is to tweak saturation values (in dark mode) or brightness values (in light mode) depending on the current Hue in order to optimize the visual appearance of the clock face. (it is always a trade-off between color and visibility) For the sake of relevance, you should try this on a real device only - and, perhaps, with backlight switched off. If your results differ from mine, let me know! In one or two days, I'll then publish an update of the clock with an optimized "colorful" face. Posted at 2022-01-06 by Andreas_Rozek I already thought of roman numerals - but did not yet introduce them because that would have required an additional configuration screen. It's on my list of possible extensions, though Posted at 2022-01-06 by johan_m_o Absolutely lovely clock! On the actual device I'm not seeing any issues with the 8 being too dark on the dark theme... The bottom 3 dots are cut off at the bottom though, so the watch face is slightly too big for the screen. And, it would be lovely for the battery to not have the seconds running when the screen is locked and the back light is off. And since I see some other wishes for clock faces/numerals, a square face like the Analog Dark clock would look beautiful. Posted at 2022-01-06 by HughB @Andreas_Rozek - love it ! You beat me to it. I have been working on a configurable analogue clock based on your code. I have a choice of 4 interesting font of fixed sizez, then you choose the Vector font and scale from 24 up to 48 (if I remember correctly). I can send you my code and you could choose, change butcher what you like as there is no point in my forking this wonderful clock. I will add a couple of bits of feedback once I have downloaded it and had a thorough config / twiddling fest ! I guess the lectures have not started yet :) Posted at 2022-01-06 by Andreas_Rozek The very first lecture will be tomorrow (friday) morning, but real work will start next week. Thus, I'll have a few days left for my work on Bangle.js until it will come to a hard stop.... Posted at 2022-01-06 by HughB @Andreas_Rozek - feedback / comments as requested.
In this case I think there is a lot to be gained by splitting out all of the settings / configuration code into a seperate apps.settings.js file. That file could then simply load your settings app which on return reloads the clock app. This would split the code into better partitions for maintainability.
Thanks for all your work on this - it looks like its 10s of hours of work ! Attachments: Posted at 2022-01-06 by Andreas_Rozek Yes, I'm currently working on the "radius too big" issue. Presumably, I won't find time to add too many extra features (I already had some "complications" in mind, e.g. for the date) but I only have very few days left until I'll have to concentrate myself on may "real" work again. Posted at 2022-01-06 by johan_m_o If I find the time (which I might have some of after Tuesday, when my current course unofficially finishes, and before my next course starts the Monday after that), I could make an attempt at adding the square clock face. My js skills are quite terrible though, so it'll take some work. Should be a nice learning experience though... Posted at 2022-01-06 by fanoushs-punching-bag Awesome work! I love the idea of having it very customizable. I have some examples that might be helpful to take for round and square designs. These are from design houses, so long established looks. EDIT: I looked at the config closer, and you do have selections for numbers. Square/Round to mimic the Braun would be super cool. Posted at 2022-01-07 by Andreas_Rozek Wow, thank you very much for your very detailed evaluation! I made notes and will work on them one by one this afternoon - this morning, I'll have to concentrate on my first lecture for this year (students are already waiting...) Posted at 2022-01-07 by Andreas_Rozek Thank you very much for the examples, they help a lot! Let's see what I can do this afternoon (as mentioned above, I have to give a lecture in the morning) Posted at 2022-01-07 by dirkhillbrecht Hi, many thanks for this great watch face! Some feedback
May I also suggest a name change? I mean, being "configurable" is not really an outstanding feature for a computer program, is it? What do you think about "Versatile analog watch". Because that's its unique selling point: An analog watch face which has a versatile look'n'feel. Best regards, Posted at 2022-01-07 by Serj My 2 cents: If there was a question about a prettier name, what about a Custom Analog Clock? By analogy with a Custom Car?
Posted at 2022-01-07 by Serj By the way, the settings menu is very clear and convenient. And I can easily imagine that there will be more settings without losing convenience. On the other hand, standardization is good. @hughb described this point well above. Posted at 2022-01-08 by HughB @Andreas_Rozek - as promised here's my configurable analogue clock based on your work. What I'm bringing into the party here is
Feel free to plunder if any of the code is any use to you. I wonder if you should produce an analogue toolkit module for the hands, faces ? this would have all the different functions inside and it would make reuse much easier. Here's the link to my loader if you want to try it out. Attachments: Posted at 2022-01-08 by HughB for some reason the screenshots did not all attach - I will try again. Attachments: Posted at 2022-01-08 by Andreas_Rozek I've looked into your code and made a special four-fold clock face for my new Analog Clock Construction Kit (see elsewhere in this forum) which should be compatible with your fonts. Documentation is still pending, but for the moment:
Posted at 2022-01-08 by HughB Brilliant - just a note on the fonts that I used. I am not sure how well they scale. I typically find to get a font to look nice it is better (wen using the font converter tool) to convert it to the size you want it to look like based on the a scale of 1. I'm not sure if you can pass in a % or decimal as the code looks like the generated code does shift operations on the scale value. Posted at 2022-01-08 by Andreas_Rozek Thank you very much for your comments! You may already have seen my new "Analog Clock Construction Kit" (elsewhere in this forum) where I try to summarize my findings of the last few days (as the time I may spend to Bangle.js development comes to an end). This kit allows to plug-in a custom "clockwork" which is also responsible for display updates. The default one shows seconds whenever LCD is "on" and hides them when LCD is off. This approach may also already solve any visibility problems of the seconds hand. Posted at 2022-01-10 by Andreas_Rozek If you like, you may try my new Analog Clock Construction Kit. Using that kit would reduce your implementation effort to just writing code for drawing the desired clock face. Posted at 2022-01-10 by Andreas_Rozek That problem should be solved by using the smart Clock Size Calculator as part of my Analog Clock Construction Kit Posted at 2022-01-10 by Andreas_Rozek The following screenshots should illustrate the benefit of not just using Attachments: Posted at 2022-01-12 by Andreas_Rozek Have you seen "Analog Dark" in the app loader? That watch already seems to mimic the square look of the Braun design - as best as it can be done with 176x176 pixels and just 8 colors... Posted at 2022-01-12 by Andreas_Rozek Indeed, I try to "overwrite" both widget areas in order to keep the analog clock as large as possible - this is done using a smart clock size calculation - what an impressive word for a little bit of geometry and equation solving... Posted at 2022-01-12 by Andreas_Rozek well, I just launched AC-AC (A Customizable Analog Clock) - a name which is hopefully interesting enough... Posted at 2022-01-12 by Serj In my opinion, both the name and the app are great! Theoretically, AC-AC can be expanded indefinitely. I expect to see Roman numerals someday, as well as support for the first version of Bangle.js, if possible :) Hope you keep experimenting with Bangle.js! And you will have enough time for this. Do you plan to somehow connect hacking Bangle.js with lectures? Posted at 2022-01-12 by Andreas_Rozek damn...I forgot: roman numerals are already supported - I forgot them in my customizer, sorry Posted at 2022-01-12 by Serj Wow, that was fast :) Posted at 2022-01-12 by Andreas_Rozek just good luck - but now I'll have to go to bed. Tomorrow will be a new day! Posted at 2022-01-12 by fanoushs-punching-bag Yes, I have; I wish though that the lines could be more slender and you could colour the hands. I might see if I can learn more and help out. Posted at 2022-01-13 by Andreas_Rozek Well, unfortunately I have to earn my living and, thus, to concentrate on other things now. I had hoped to create more within the time I had but ACCK and AC-AC do not look all too bad for the beginning. Concerning Bangle.js 2 and my CS lectures: well, definitely not during this semester (exam phase will start in three weeks). At the beginning of this semester, I gave a away a few "Maker UNO"s and now hope to see what my students did with them by tomorrow or next friday. For the next semester, I plan to concentrate on the RasPi Zero 2 as it covers everything - from "hardware computing" over development with Linux to Linux administration. Bangle.js programming is based on JavaScript - and (although I personally prefer JS over Java) this creates a problem: at "my" university, students will learn Java as their primary programming language - some of them will start as pure beginners in that area. And even if it makes my heart bleed, I strongly recommend NOT to learn JS and Java at the same time - otherwise you wouldn't be able to do either of them really well. Therefore, I will definitely introduce the Bangle.js 2 as an example of what individuals or small groups can achieve today - but I doubt that I will start any projects for my students with it. Perhaps, however, I'll call for a small competition (letting students develop and publish their own software and/or hardware projects or even found their own small start-ups) and offer my Bangle.js development clock as a prize...we'll see Posted at 2022-01-13 by Andreas_Rozek roman numerals may now be configured as well (now available in the official App Loader) Attachments: Posted at 2022-01-13 by Serj @Andreas_Rozek Yes, I understand. In any case - thanks for the projects :) I wonder why you prefer JS over Java? Posted at 2022-01-14 by Andreas_Rozek Well, I hate boiler plating - and Java often requires that (which is why I was heavily working with Groovy in a professional environment around a decade ago). On the other side, plain JavaScript is too unregulated, which is why I actually prefer "TypeScript" (very well done, Microsoft!) - hoping that I do not have to write too many nested asynchronous functions (as the handling of asynchrony is the biggest design flaw of JavaScript today - here is Java much(!) better) Another big argument for JS: it's the "lingua franca" of the web and well supported even in older browsers (in older tablets, smartphones, PCs etc.) in contrast to WASM - including debugging. Additionally, as far as I remember: JS is even supported by some microcontrollers - and, finally, by some smartwatches. I can hardly remember, but allegedly there was an environment called...Espruino? And I've heard of a smartwatch called "Bangle.js" (or similar) which is supposed to support JS. (Just for the records: there is an alternative called Kaluma available for the Raspberry Pico - sometimes, you actually need the performance of an RP Pico, and in that case, Kaluma seems to be a good choice) |
Beta Was this translation helpful? Give feedback.
-
Posted at 2022-01-06 by Andreas_Rozek
I just published a very first (preview) version of a "configurable analog clock" with various faces, hands and colors to choose from. You have the choice between
Additionally, you may use the currently configured global theme or configure your own colors for clock fore- and background and second hands.
Just swipe up or down to switch from clock display to the first configuration screen and continue from there.
Chosen settings will be written to the Bangle.js's flash memory and restored whenever the clock is started again.
Right now, you'll find in my personal app loader only - just look for "Configurable Analog Clock" - because I still have the problem that widgets may appear on a configuration screen (which is a bit annoying but should not affect operation in any way)
This clock also acts as an example for the building blocks found in my GitHub repository
Any feedback is welcome!
Attachments:
Beta Was this translation helpful? Give feedback.
All reactions