Add Mullvad branding to DMG

We need:

• Volume icon // not required for January, but nice to have
  • Source file: tor-browser#41332 (closed)
  • Convert it to the native macOS format (there are also Linux tools to do it)
• Finder background image // place holder is fine for January
• .DS_Store to glue things together, which hardcodes:
  • The name of the bundle (Tor Browser.app for Tor Browser) and its position
  • The name of the DMG volume
  • The background name (possibly as an absolute path!)
• Set the real branding once we can use the Mullvad name
  • Change all the various references in tor-browser-build.git, so that Mullvad Browser.app is generated (#75 (closed))
  • Run the script to create the .DS_Store again, but with the proper name
  • Add the real Finder background (#67 (closed))

added Feature label

added MacOS Next Q1 labels

added Sponsor 131 label

marked this issue as related to #7 (closed)

marked this issue as related to #3 (closed)

marked this issue as related to tor-browser#41332 (closed)

changed the description

marked this issue as related to #4 (closed)

changed the description

We've had an IRC conversation about this earlier.

TL;DR: the easiest approach is creating a first DMG on a mac (@dan suggested to use this fancy script), then harvest the files it creates and add them to the git repo.

We have a few tor-browser-build issues to solve before being able to use these files (including the creation of a first DMG with the Tor Browser resources but the correct names, such as Mullvad Browser.app or whatever it will be).

changed the description

marked this issue as related to tor-browser-build#40732 (closed)

marked this issue as related to tor-browser-build#28124 (closed)

In the patch I've created for tor-browser-build#40732 (closed) (no MR, yet), I've setup the mechanism to copy the dmg resources from $ProjectName.dmg.

However, we still need to create the files (this issue), and everything is blocked by #9 (closed).

marked the checklist item Convert it to the native macOS format (there are also Linux tools to do it) as completed

marked the checklist item Volume icon // not required for January, but nice to have as completed

I've uploaded the converted image in tor-browser-build!631 (merged). But I kept Tor Browser's background and .DS_Store as placeholders for now.

Now I've also created the right .DS_Store, but for Privacy Browser.app, rather than Mullvad Browser.app.

And I've created a background placeholder with the M logo instead of Tor Browser, but we should change it, when we can go public with the Mullvad name. The background image must be a 2x PNG, even though we can customize sizes.

For posterity, the command I've used to create the mock .dmg is

create-dmg --volname 'Privacy Browser' --volicon VolumeIcon.icns --background background.png --hide-extension 'Privacy Browser.app' --window-size 415 317 --icon-size 100 --text-size 14 --icon "Privacy Browser.app" 100 180 --app-drop-link 310 180 PB.dmg source

where source is a directory with an empty Privacy Browser.app directory in it.

It's enough to create PB.dmg, and actually the only file we need from it is the .DS_Store.

For future reference:

• the window size does not include borders: if you want a 512px wide dmg, you need to pass 510 to the script
• the coordinates are relative to the center of the icons, and you need to subtract the border size
• if you do pixel refinement (i.e., take a screenshot, and the measurement tool, to compare what you get with what you expected), keep in mind that Apple at a certain point changed the size of the title bar
• when using the create-dmg script, the background is 1x for some reason... but IIRC, the final result needs to be 2x. So, I've used the 1x to create the .DS_Store, but I will actually inject the 2x the background image can/should be a 2x... but in case it must also be exported as a 2x from Figma (tell so Nicob/Donuts, they should know what to do), or you need to adjust the DPI/print size on GIMP
• the height of the window should include title bar size: it's 28px in modern macOS, 22px in older macOS. So, older macOS will show a few more pixels vertically on the background. This is something to keep in mind (i.e., avoid borders, or extend backgrounds, etc etc)

assigned to @pierov

removed Next label