зеркало из https://github.com/mozilla/gecko-dev.git
Bug 1791899: updating mac icon documentation r=nalexander
Two things that we discovered after the initial update: 1) Fix the list of resolutions/DPIs needed 2) Update to the reflect the fact that each size must be manually crafted Differential Revision: https://phabricator.services.mozilla.com/D158422
This commit is contained in:
Родитель
86cc5257f0
Коммит
e31a67da43
|
@ -6,21 +6,26 @@ Updating macOS Icons
|
|||
|
||||
macOS icons are stored as ``icns`` files that contain the same logo in multiple different sizes and DPIs. Apple's `Human Interface Guidelines <https://developer.apple.com/design/human-interface-guidelines/foundations/app-icons>`_ should be consulted for the specifics.
|
||||
|
||||
These icons can be updated by starting with a PNG of the highest resolution and DPI version, and using these steps to create the others, and the ``icns`` itself:
|
||||
Although it may seem like we can simply be handed the highest resolution/DPI version and downscale for the remainder -- this is not the case, some finer details in the icons (most notably shadows) need to be tweaked for each size. The UX team should hand off PNGs for every size and DPI needed.
|
||||
|
||||
Once those are in hand, the ``icns`` file can be created with something like the following:
|
||||
|
||||
::
|
||||
|
||||
mkdir firefox.iconset
|
||||
sips -z 16 16 firefox.png --out firefox.iconset/icon_16x16.png
|
||||
sips -z 32 32 firefox.png --out firefox.iconset/icon_16x16@2x.png
|
||||
sips -z 32 32 firefox.png --out firefox.iconset/icon_32x32.png
|
||||
sips -z 64 64 firefox.png --out firefox.iconset/icon_32x32@2x.png
|
||||
sips -z 128 128 firefox.png --out firefox.iconset/icon_128x128.png
|
||||
sips -z 256 256 firefox.png --out firefox.iconset/icon_128x128@2x.png
|
||||
sips -z 256 256 firefox.png --out firefox.iconset/icon_256x256.png
|
||||
sips -z 512 512 firefox.png --out firefox.iconset/icon_256x256@2x.png
|
||||
sips -z 512 512 firefox.png --out firefox.iconset/icon_512x512.png
|
||||
cp firefox.png firefox.iconset/icon_512x512@2x.png
|
||||
mv icon_16x16.png firefox.iconset
|
||||
mv icon_32x32.png firefox.iconset
|
||||
mv icon_32x32@2x.png firefox.iconset
|
||||
mv icon_64x64@2x.png firefox.iconset
|
||||
mv icon_128x128.png firefox.iconset
|
||||
mv icon_256x256 firefox.iconset
|
||||
mv icon_256x256@2x.png firefox.iconset
|
||||
mv icon_512x512.png firefox.iconset
|
||||
mv icon_512x512@2x.png firefox.iconset
|
||||
mv icon_1024x1024@2x.png firefox.iconset
|
||||
iconutil -c icns firefox.iconset
|
||||
|
||||
...which will create a ``firefox.icns`` file. You can verify that it includes all of the necessary resolutions and DPIs by inspecting it with ``Preview.app``.
|
||||
|
||||
(The ``NxN`` part is obviously the resolution, and the ``@2x`` string is used in the high DPI versions.)
|
||||
|
||||
This will create a ``firefox.icns`` file. You can verify that it includes all of the necessary resolutions and DPIs by inspecting it with ``Preview.app``. You will likely need to do this for all brandings (``official``, ``aurora``, ``nightly``, and ``unofficial`` at the time of writing).
|
||||
|
|
Загрузка…
Ссылка в новой задаче