FireClip gets a new logo
Today worked on the logo, polished it a bit. I think it came out nicely.
It’s supposed to look like a ninja and a fire :D
the image is white with a transparent background, so you might want to enable dark mode by clicking on the moon in the website header
generating the electron assets
to build an electron app, you need to provide an installer/app image.
For Windows, it has the .ico
and for Mac, it has the .icns
.
Linux build can use the windows one as well.
I did the logo editing in Inkscape and initially exported it to a PNG, then went to a couple of convertor websites to get the ‘.ico’ and ‘.icns’ files. But that was a bit annoying as I can’t really tolerate toil :D
So went to npmjs.com
and literally searched for "png to icns"
, sorted by popularity, and this nice tool was first in the list.
It’s called electron icon maker and granted, it looks fishy at the first glance. I mean, version no. 0.0.5
and ‘last published: 4 years ago’ aren’t necessarily the best indicators of a good NPM package.
But almost 1400 of weekly downloads looked promising.
With high hopes, I used the suggested command and installed it to the project, and, to my surprise, it’s working perfectly and generating the required .ico
and .icns
files, as well as a bunch of resized PNGs (which came in handy for the tray bar icon)
I then made the generation a package script and added it as part of the build step by changing the ‘build’ script in the package.json
json
package.json
"generate_images": "yarn electron-icon-maker -i src/frontend/www/logo_1024.png -o src/frontend/www/",
"build": "yarn generate_images && rollup -c && tsc"
And after some small updates, the building now works properly and points to the newly created assets inside src/frontend/www
.
what’s next ?
- updating the search to pull all items if wanted (maybe a search window ?)
- beta releases would be nice, configurable in the app.