doc: replace getting started guide image

[KajbaM]

Summary

Replaces blinky animation in getting started guide with nicer image.

I was bothered by image animation in getting started guide documentation page.
My issue was that there is still protective film applied to eInk screen in animation.

I recreated the animation with protective film removed.

[github-actions]

Hello @KajbaM, and thank you very much for your first pull request to the Zephyr project!
Our Continuous Integration pipeline will execute a series of checks on your Pull Request commit messages and code, and you are expected to address any failures by updating the PR. Please take a look at our commit message guidelines to find out how to format your commit messages, and at our contribution workflow to understand how to update your Pull Request. If you haven't already, please make sure to review the project's Contributor Expectations and update (by amending and force-pushing the commits) your pull request if necessary.
If you are stuck or need help please join us on Discord and ask your question there. Additionally, you can escalate the review when applicable. 😊

[kartben]

This is nice, thanks for this, but tbh it's hard to justify adding over 500KB to the GitHub repo just for this :) I am guessing you can get to a much smaller file size using animated webp in which case we can maybe consider this for inclusion.

[KajbaM]

This is nice, thanks for this, but tbh it's hard to justify adding over 500KB to the GitHub repo just for this :) I am guessing you can get to a much smaller file size using animated webp in which case we can maybe consider this for inclusion.

Yes! Absolutely agree, didn't initially notice change in size until CI started complaining about it :)
Original PNG seems much more compressed and original tool I used had problems with generating small output.
I played around a bit and managed to reduce size to match original file, still looking if that is possible any further.

[sonarqubecloud]

Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud

[KajbaM]

@kartben I regenerated the image with some compression added which reduced the size significantly.
Is this acceptable size or should I deal with this further?

[kartben]

@kartben I regenerated the image with some compression added which reduced the size significantly. Is this acceptable size or should I deal with this further?

Yeah it's still quite large though

ffmpeg -i input.png  -vf "scale=400:-1" -loop 0 -lossless 0 -quality 90 -compression_level 6 output.webp

44 KB seems much more reasonable :) also leveraging the fact that it's 400px wide in the documentation page anyway so might as well resize the image accordingly.