Image size

Hi,

What image size and resolution is used for watch faces in Watch faces Studio?
I work with Photoshop and it’s for the watch 4
Thank you very much

Hi, the bigger GW4 version has resolution of 450x450 pixels and the WFS default project size when making new one is the same.

Hi Peter,
I mean the settings with Photoshop.
All my designs have the image size of 360x360 and resolution of 72 pixels at 8 bits in Photoshop.
Would you advise me an image size of 396x396?
What resolution and better at 16 bits?
any better settings in Photoshop?

Hi Sergio,
I do not work with Photoshop, but I guess the more bits for colour depth the more memory the image takes, but the smoother the colour definition can get. The dpi does matter for printing the images, but for display it does not.
I do not know how are the images internally handled, since in shop the watch class is described as 396x396, but the bigger variant of galaxy watch 4 has display with resolution 450x450, and I think it is better to have images with pixels for each pixel of the screen, rather than let the device interpolate or extrapolate for different resolutions.
Maybe somebody who has the actual watch can comment on the image sharpness with different resolutions.

First of all, saving them as 8 bit graphics is a good idea. You don’t really need to do 16 bit graphics unless you are editing photographic images, and then you would probably want to save them as 8 bit when you are finished. 8 bit graphics provides you 256 levels (shades of color) per channel for red, green, blue and alpha (alpha being transparency) where 16 bit graphics use 65,536 levels per channel. If your image is fully opaque, then there is no need to save it with transparency and you will save 8 bits of memory for each pixel. So if you are exporting a png file, be aware when to check or not check the transparency checkbox. You could still save a fully opaque image with transparency, but that would be a waste.

As far as the file size, it is best to work from a higher resolution image and then export the image resized to the desired size using Photoshop. So let’s say for example I build my watch face at 1350x1350 for the Galaxy Watch4 Classic that displays 450x450.

The following image is a close up of a section of a 1350x1350 image:

original

The next two images (screenshots from the watch) demonstrate what would happen if I were to add the image in it’s original size of 1350x1350 scaled down to a 450x450 (left) vs using Photoshop to resize the image at 450x450 (right):

actual_size

It may not be as obvious at the smaller size, so here is the same example zoomed in at 300% to point out the differences:

300_percent

Notice on the left, the higher resolution image that was scaled down to fit. If you look closely you will see visual artifacts (the darker areas) that were not smoothly interpolated, where the image on the right is much smoother. When I exported my higher resolution image from the original 1350x1350 down to 450x450, I chose to resample the image using the Bicubic interpolation which looks at the 16 surrounding pixels and finds an average, but giving more weight to the 8 closest pixels for each resulting pixel evaluated. Bicubic Sharper is also a good option for reducing an image yet keeping the edges sharper. Sometimes that is not the desired effect so Bicubic helps smooth the gradients.

It is a good practice to work from a higher resolution image, but realize some of the detail may be lost when scaled down. Let Photoshop use it’s more complex math algorithms to interpolate the pixels.

If I was going to use the same image for more than one size (i.e, 396x396 and 450x450), I would size them at an actual size to fit within a 450x450 display. Resizing a 450x450 down to a 396x396 display will minimize the visual artifacts if you would even be able to tell at all. Taking a smaller image and resizing to a larger image could appear pixelated.

Note: If I were to include all my images at 1350x1350 instead of 450x450, I would be using 9 times more pixels per image. Each time you have an image that needs to be displayed that is not the actual size, it has to compute the resizing of the image.

-Viz

1 Like

Hi,
Thank you very much for your responses.

I can confirm that it is better to resize your pictures to fit the resolution of the watch (with photoshop, gimp, whatever), the downscaling is handled quite poorly by the studio and it’ll look all pixellated and wrong on the watch, countrary to the preview.