Hello Clockology fans! Optimizing your image assets is key to ensuring your designs load quickly, run smoothly, and look fantastic!
Note the RED warning border when your design is over the recommend file size limits and may not run efficiently.
Tips are provided in-app to guide in reducing file sizes.
Here are some friendly tips to help you get the best performance when creating your designs:
1. Choose the Right File Format
Selecting the appropriate file format is essential:
PNG: Best for images with transparency, such as imported watch hands.
JPEG: Ideal for detailed images without transparency.
2. Resize Your Images
Make sure your images are resized to the exact dimensions needed for your design. This helps reduce file size and improve load times. Tools like Adobe Photoshop, GIMP, or Canva can assist with resizing.
3. Compress Images
Compressing large or high resolution images reduces their file size without compromising quality. Consider using:
TinyPNG: Compresses PNG and JPEG images effectively.
ImageOptim: A Mac app that compresses images while preserving quality.
4. Use Proper Naming Conventions
Name your image files descriptively and use relevant keywords. This helps in organizing your assets and improves searchability within your designs.
5. Regularly Audit and Clean Up
Regularly review your image assets to remove any that are not required or no longer in use. This helps in keeping your design lightweight and efficient.
6. Tips for Reducing Asset Layer File Sizes
Reduce file resolution:
Why: Higher resolution images have larger file sizes, which can slow down your designs.
How: For example, instead of using an image that is 2000px wide, resize it to 800px wide if that’s sufficient for your needs. This can be done using image editing tools like Photoshop, GIMP, or online tools like Canva.
Example: If your design requires your image to be displayed an image at 400px wide, there’s no need to upload a 2000px wide image. Resizing it to 800px wide will still provide good quality while reducing the file size.
Use JPEG when transparency isn’t needed:
Why: JPEG files are generally smaller than PNG files because they don’t support transparency and use lossy compression.
How: Convert PNG images to JPEG if they don’t require transparency. Most image editing tools allow you to save or export images in different formats.
Example: If you have a background image without any transparent areas, save it as a JPEG to reduce the file size.
Note the difference in file size when Preserve Transparency is switched to ON when using a solid JPEG image.
Do not enable preserve transparency unless it’s needed:
Why: Preserving transparency can increase file size, especially if the transparency isn’t necessary for the image’s purpose.
How: When importing your image, check the settings to ensure preserve transparency is only on when needed.
Example: If an image needs to be displayed with a transparent background (e.g., hour, minute, second hands), make sure to enable the preserve transparency option. For images with a solid background, disable preserve transparency to save space.
Combine multiple layers into one when possible:
Why: Multiple layers can increase the overall file size of a design.
How: Merge layers in your image editing software before saving the final image. This reduces the complexity and size of the file.
Example: If you have a watch face design with separate layers for the background, shadows, and numbers, consider merging them into a single layer if they don’t need to be separate and are not moving images.
Resize videos to fit the screen:
Why: Videos that are larger than necessary can take up a lot of storage space and slow down your designs loading time and operation.
How: Resize your videos to the maximum recommended size of 360p. Use video editing software, Photos app, or iMovie to adjust the resolution.
Example: If you have a video that’s 1080p but it’s displayed in a small window within your design, resize it to 360p to save space and improve performance.
EN 
ES 
IT 
FR 
DE 
JA 
ZH 
KO 
PT