<html><head><meta http-equiv="content-type" content="text/html; charset=utf-8"></head><body style="overflow-wrap: break-word; -webkit-nbsp-mode: space; line-break: after-white-space;"><div><br></div><div>With reference to my previous message on the unified OVMS App, I am asking for volunteers - people familiar with photoshop - to help out now.</div><div><br></div><div>The current iOS and Android apps simply include all colour variants of every car as three images (map, top down, and 3/4 side view for the main screen). That becomes massive and unworkable. T<font color="#000000"><span style="caret-color: rgb(0, 0, 0);">he Android App currently has about 19MB of vehicle images, and iOS is 32MB. It has gotten so bad that a while ago we stopped accepting any new images (for the iOS app at least).</span></font></div><div><font color="#000000"><span style="caret-color: rgb(0, 0, 0);"><br></span></font></div><div><font color="#000000">I recognize that the car image matching your actual vehicle is important to users. Having the wrong image, while seemingly trivial,  can be frustrating. People are proud of their vehicles and customization (colors, wraps, accessories, etc) is common.</font></div><div><font color="#000000"><span style="caret-color: rgb(0, 0, 0);"><br></span></font></div><div><font color="#000000"><span style="caret-color: rgb(0, 0, 0);">To solve this </span></font>in the unified app we have a base vehicle image as well as a transparent background grayscale mask of the painted areas. We can then overlay the mask over the base, and <span style="caret-color: rgb(0, 0, 0); color: rgb(0, 0, 0);">programmatically </span>colorize the mask to match standard / custom colors. These are for each of the three images of the vehicle (main 3/4 view, map, and top down), and <span style="caret-color: rgb(0, 0, 0); color: rgb(0, 0, 0);">for each car type</span>. <span style="caret-color: rgb(0, 0, 0); color: rgb(0, 0, 0);">I’ve attached some samples for the Tesla Roadster. [ note that w</span>e’ll also offer the option for the user to simply upload their own images from camera roll, but that is another topic, as 99% of users have standard cars ]</div><div><br></div><div>You can see a working example of this in action here:</div><div><br></div><blockquote style="margin: 0 0 0 40px; border: none; padding: 0px;"><div><a href="https://snack.expo.dev/@ovmsmark/masked-colorizer">https://snack.expo.dev/@ovmsmark/masked-colorizer</a><br></div></blockquote><div></div><div><span style="caret-color: rgb(0, 0, 0); color: rgb(0, 0, 0);"><br></span></div><div><font color="#000000"><span style="caret-color: rgb(0, 0, 0);">This approach should be able to bring the size down to perhaps 1/6th of what we have today.</span></font></div><div><br></div><div>What we are looking for is volunteers familiar with photoshop to help organize and create these vehicle images. The task would be to take whatever graphics we have now, organize and standardize them, then use photoshop to convert to layers (one for the base vehicle, and another for the paint) for each of the three views. It has also been discussed to perhaps create another layer for headlights and taillights (so we could easily switch these on/off to match the car state itself). Doing this work on the white variant color of each vehicle type seems to produce the best results.</div><div><span style="caret-color: rgb(0, 0, 0); color: rgb(0, 0, 0);"><br></span></div><div><span style="caret-color: rgb(0, 0, 0); color: rgb(0, 0, 0);">So, any volunteers?</span></div><div><span style="caret-color: rgb(0, 0, 0); color: rgb(0, 0, 0);"><br></span></div><div><span style="caret-color: rgb(0, 0, 0); color: rgb(0, 0, 0);">Regards, Mark</span></div><div><br></div><div></div></body></html>