Watchface Ideas

Sounds like a neat idea... Not for everyone but I can see the attraction

A widget that covers the screen would be a good idea but may end up being a bit hard to implement right now (since you want to keep track of what's going on 'under' it when the screen is locked).

Assuming you have some code like you'd get at the end of https://www.espruino.com/Bangle.js+Clock+Font then what you want to do is:

• when locked, clear the drawTimeout timeout and draw your splash screen
  
• when unlocked, call draw again
  
  

So you just copy the final code from that tutorial, then add this code right to the end:

// delete the call to 'draw()' in the previous code

function drawSplash() {
  var R = Bangle.appRect;
  g.reset().clearRect(R);
  g.setFont("Vector:40").setFontAlign(0,0).drawString("Boo!", R.x + R.w/2, R.y + R.h/2);
  // or draw an image?
}

Bangle.on('lock', locked => {
  if (locked) {
    if (drawTimeout) clearTimeout(drawTimeout);
    drawTimeout = undefined;
    drawSplash();
  } else { // unlocked
    draw();
  }
});
// draw the correct start screen
if (Bangle.isLocked()) {
  if (drawTimeout) clearTimeout(drawTimeout);
  drawTimeout = undefined;
  drawSplash();
} else draw();

In a way, for the splash screen I'd suggest it's better to make a 176x152 image and then use https://www.espruino.com/Image+Converter to convert it to the watch (then g.drawImage(img,R.x,R.y) instead of drawString("Boo!"....