this post was submitted on 03 Aug 2023
170 points (95.2% liked)

Interesting

555 readers
1 users here now

founded 1 year ago
MODERATORS
170
Clockwise or counterclockwise? (psychologie-news.stangl.eu)
submitted 1 year ago* (last edited 1 year ago) by [email protected] to c/[email protected]
 
you are viewing a single comment's thread
view the rest of the comments
[–] [email protected] 12 points 1 year ago* (last edited 1 year ago) (2 children)

This is a very unoptimized GIF. Did you know GIFs are limited to at most 256 colors (or 255+transparency) but the palette can be redefined (good export software automatically optimizes it at least according to the first frame)? As such, GIFs that are largely grayscale or sepia can do without dithering and still have smooth colors. (In this one, I would assign 248 colors for the black to white gradient plus 4 shades of red and blue. Or almost halve the file size by limiting the palette to the roughly 16 actually used colors.)

Color palette export0: #000000 1: #999999 2: #666666 3: #cccccc 4: #669999 5: #996666 6: #336666 7: #99cccc 8: #cc9999 9: #663333 10: #996699 11: #999966 12: #663366 13: #cc99cc 14: #cccc99 15: #666633 16: #9999cc 17: #99cc99 18: #333333 19: #666699 20: #669966 21: #ffcccc 22: #003333 23: #3300cc 24: #ffffff 25: #ff0000 26: #ccffff 27: #330000 28: #333366 29: #336633 30: #333300 31: #330033 32: #ccccff 33: #ccffcc 34: #000099 35: #990000 36: #000033 37: #0033ff 38: #ff3333 39: #0033cc 40: #660000 41: #cc0000 42: #003300 43: #3333cc 44: #3333ff 45: #000066 46: #330099 47: #003399 48: #ff0033 49: #330066 50: #ff3300 51: #0000cc 52: #003366 53: #3366cc 54: #6699cc 55: #9966cc 56: #cc6666 57: #6666cc 58: #336699 59: #6633cc 60: #cc3333 61: #663399 62: #333399 63: #cc6633 64: #993333 65: #ff9999 66: #9999ff 67: #ff9966 68: #cc3366 69: #9966ff 70: #6699ff 71: #3366ff 72: #ff6666 73: #6633ff 74: #6666ff 75: #99ccff 76: #996633 77: #cc99ff 78: #660033 79: #cc0033 80: #ffcc99 81: #ffffcc 82: #ff3366 83: #ff99cc 84: #663300 85: #993300 86: #ffccff 87: transparent 88: #000000 89: #000000 90: #000000 91: #000000 92: #000000 93: #000000 94: #000000 95: #000000 96: #000000 97: #000000 98: #000000 99: #000000 100: #000000 101: #000000 102: #000000 103: #000000 104: #000000 105: #000000 106: #000000 107: #000000 108: #000000 109: #000000 110: #000000 111: #000000 112: #000000 113: #000000 114: #000000 115: #000000 116: #000000 117: #000000 118: #000000 119: #000000 120: #000000 121: #000000 122: #000000 123: #000000 124: #000000 125: #000000 126: #000000 127: #000000

At least the frame delta data is limited to the actually changing rectangle, as it should be.

I would advocate for APNG, WebP or even MP4 but not all browsers play them on a loop by default.

[–] Aiastarei 3 points 1 year ago (1 children)

This is the nerdiest comment I've ever read, I love it

[–] [email protected] 3 points 1 year ago

I have been nerdier on Reddit before, and I’m happy to bring that over here. (You won’t see my Reddit nerdposts though, they have been overwritten by PowerDeleteSuite.)

[–] [email protected] -2 points 1 year ago (1 children)

I agree with you. I changed it with a higher quality one.

[–] [email protected] 1 points 1 year ago* (last edited 1 year ago) (1 children)

This one has higher resolution and no unhelpful dithering. Also the color palette, while reducible to 64 or fewer colors instead of 256, is actually somewhat optimized (there is no green or yellow).

Color palette export0: #a0a0a0 1: #606060 2: #c0c0c0 3: #000000 4: #909090 5: #808080 6: #707070 7: #b0b0b0 8: #505050 9: #d0d0d0 10: #404040 11: #303030 12: #e0e0e0 13: #202020 14: #2020e0 15: #ffffff 16: #ff1010 17: #101010 18: #700000 19: #101070 20: #1010b0 21: #bf0c0c 22: #000030 23: #300000 24: #1010c0 25: #2020d0 26: #ef0f0f 27: #500000 28: #101090 29: #000020 30: #200000 31: #0d0d58 32: #cf0d0d 33: #900000 34: #000010 35: #100000 36: #d00000 37: #0f0f67 38: #1010a0 39: #101080 40: #400000 41: #000040 42: #a00000 43: #600000 44: #800000 45: #707090 46: #4040d0 47: #9090ff 48: #ff4c4c 49: #ff8888 50: #906060 51: #3030e0 52: #ffc3c3 53: #808090 54: #e01010 55: #101020 56: #acacff 57: #a0a0d0 58: #4040c0 59: #101050 60: #2020a0 61: #c8c8ff 62: #505080 63: #ffe1e1 64: #7070a0 65: #ff2020 66: #303060 67: #101060 68: #3030d0 69: #202090 70: #101040 71: #2020c0 72: #ffb4b4 73: #8080a0 74: #5a5aff 75: #7070e0 76: #39302e 77: #4040b0 78: #404050 79: #202030 80: #707080 81: #6060b0 82: #303040 83: #7576ff 84: #9090c0 85: #d02020 86: #ffa5a5 87: #201010 88: #6060c0 89: #e02020 90: #401010 91: #404070 92: #505060 93: #ff3d3d 94: #303070 95: #d5d5ff 96: #d04040 97: #404090 98: #e3e3ff 99: #3030c0 100: #101030 101: #4040a0 102: #403030 103: #202080 104: #c01010 105: #5050c0 106: #2020b0 107: #6060a0 108: #704040 109: #202050 110: #8080b0 111: #9090a0 112: #303090 113: #501010 114: #4c4dff 115: #202070 116: #ffd2d2 117: #302020 118: #d01010 119: #ff6a6a 120: #ff7979 121: #ff9696 122: #404080 123: #606070 124: #a05050 125: #a04040 126: #a01010 127: #3030b0 128: #9090b0 129: #908080 130: #505070 131: #c03030 132: #8080d0 133: #c06060 134: #5050e0 135: #602020 136: #806060 137: #606090 138: #d03030 139: #a07070 140: #c0c0d0 141: #d05050 142: #7070b0 143: #7070c0 144: #7070d0 145: #605050 146: #5050d0 147: #5050b0 148: #902020 149: #505090 150: #504040 151: #402020 152: #3030a0 153: #303080 154: #303050 155: #ff5b5b 156: #b01010 157: #b08080 158: #b05050 159: #703030 160: #202040 161: #801010 162: #b02020 163: #b09090 164: #503030 165: #202060 166: #301010 167: #4040e0 168: #c05050 169: #8383ff 170: #901010 171: #b0b0c0 172: #904040 173: #a03030 174: #efb3b3 175: #babaff 176: #3f408b 177: #5050a0 178: #c02020 179: #907070 180: #e03030 181: #b0b0d0 182: #c04040 183: #a06060 184: #b0a0a0 185: #8080e0 186: #a08080 187: #8080c0 188: #807070 189: #c07070 190: #404060 191: #a09090 192: #4f50e7 193: #a0a0e0 194: #b03030 195: #b0b0e0 196: #c08080 197: #c09090 198: #601010 199: #706060 200: #705050 201: #b07070 202: #702020 203: #606080 204: #6768ff 205: #6060e0 206: #1f20d0 207: #cfb1b1 208: #701010 209: #a0a0c0 210: #d06060 211: #603030 212: #d07070 213: #2f30e0 214: #804040 215: #502020 216: #d09090 217: #d0a0a0 218: #d0c0c0 219: #d0b0b0 220: #6060d0 221: #d5d5e1 222: #8f2727 223: #d78d8d 224: #8b3232 225: #4f50c1 226: #5f60c4 227: #8f5353 228: #955959 229: #9c9ce8 230: #ef7878 231: #ef8686 232: #e29898 233: #a42d2d 234: #a3a3b0 235: #cfa2a2 236: #2f30df 237: #2f30c6 238: #c5c6eb 239: #b14949 240: #efd1d1 241: #1f20aa 242: transparent 243: #000000 244: #000000 245: #000000 246: #000000 247: #000000 248: #000000 249: #000000 250: #000000 251: #000000 252: #000000 253: #000000 254: #000000 255: #000000

Don’t worry about optimizing your GIFs, that is a rant about a problem that needs to be solved by someone else. Just accept the higher compatibility but worse quality/bitrate ratio and move on.

[–] 9point6 1 points 1 year ago* (last edited 1 year ago) (1 children)

Just accept the higher compatibility but worse quality/bitrate ratio and move on.

Glad you said this, because honestly there're diminishing reasons to use gif in 2023, compatibility with the long tail is pretty much it

[–] [email protected] 1 points 1 year ago

I tried posting a short looping soundless animation on Reddit over two years ago and GIF was the only format (I also tried WebP, APNG and mp4) that played automatically on loop. I made sure to optimize the palette, though. Also, my preferred animated bitmap editor (LogoMotion, 2002 abandonware) only exports GIF.