406448 - Improve Mac installer (.dmg)

Status: RESOLVED FIXED

(SeaMonkey :: Installer, defect)

Description

[Karsten Düsterloh]

Currently, our .dmg files just contain the bare Seamonkey.app, which you need to drag into /Applications (or whereever you want). 
Other applications usually provide fancy ;-) background images with supportive texts (eg. Firefox, Thunderbird) or even links to /Applications (eg. Komodo), etc. 
Would be nice to have that, too...

Comment 1

[Stefan [:stefanh]]

I actually got the Camino artwork in a photoshop file from the contributor, thought I could re-use some of the stuff. Anyway, that was probably a year ago... So, after bug 320155 we're just going to need an arrow? 

Comment 2

[Karsten Düsterloh]

Basically, yes.

Comment 3

[Karsten Düsterloh]

Attachment: Makefile changes for improved .dmg installer

Apart from this patch, you need to save the other (three) attachments to /suite/app/macbuild. Make sure you have the current pkg-dmg patch from bug 320155 applied as well.

Comment 4

[Karsten Düsterloh]

Attachment: placeholder background image; save to /suite/app/macbuild/background.png

Comment 5

[Karsten Düsterloh]

Attachment: placeholder disk icon; save to /suite/app/macbuild/disk.icns

Comment 6

[Karsten Düsterloh]

Attachment: placeholder .DS_Store; save to /suite/app/macbuild/dsstore

Just a quick note on how to create a matching dsstore:
- Hack your $objdir/suite/installer/Makefile and add the parameter
     --format UDRW
  to the MOZ_PKG_MAC_EXTRA line. This will make the resulting .dmg be writable.
- Run make in $objdir/suite/installer to create the .dmg.
- Open the .dmg and drag SeaMonkey.app and the Applications icon to the right
  place. Resize the window as needed.
- Eject the .dmg.
- Open the .dmg.
- Open a Terminal, go to /Volumes/SeaMonkey and copy the file .DS_Store 
  found there to $source/suite/app/macbuild/dsstore - done!

Comment 7

[Stefan [:stefanh]]

Attachment: New placeholder disk icon

Karsten, check this one out.

Comment 8

[Stefan [:stefanh]]

Comment on attachment 291483 [details] [diff] [review]
Makefile changes for improved .dmg installer

I'll look at this when the dependent bug is resolved. There might also be a new background.png on it's way that'll replace the placeholder.

One comment, though: I have a feeling that all the "branded" artwork should go in suite/branding somewhere. What Firefox/Thunderbird/Sunbird have in app/macbuild is non-branded artwork (a blank background.jpg, the "Minefield" icon etc).

Comment 9

[Mark Mentovai]

I suggest taking care when you generate your .DS_Store files.  I've found in the past that .DS_Store files generated on some later releases of the OS aren't readable on earlier releases.  If your minimum is 10.4, you should either generate the .DS_Store on 10.4 or make sure that it works properly on 10.4.

Also note that different releases have different interpretations for things like window size when it comes to status bars and toolbars and things.  It's always a good idea to make sure that your sizing and window background display properly without excessive clipping on all of your target OS releases.

If you want precise sizing and positioning of your windows and icons, you can use AppleScript to automate Karsten's resize-and-drag step from comment 6.

Finally, be careful with the .DS_Store files, sometimes they wind up containing random Finder junk from unrelated folders.  This may present a privacy issue.  You might want to inspect the file and make sure it doesn't contain any strings you're not comfortable making public.

Comment 10

[Mark Mentovai]

Comment on attachment 291483 [details] [diff] [review]
Makefile changes for improved .dmg installer

>Index: suite/installer/Makefile.in

>+ifneq (,$(filter mac cocoa,$(MOZ_WIDGET_TOOLKIT)))
>+MOZ_PKG_MAC_DSSTORE=branding/dsstore
>+MOZ_PKG_MAC_BACKGROUND=branding/background.png
>+MOZ_PKG_MAC_ICON=branding/disk.icns
>+MOZ_PKG_MAC_EXTRA=--symlink "/Applications: "
>+endif

Do you maybe want the new --format UDBZ here too?  You're trunk-only and are therefore targeting 10.4 as a minimum, right?

>Index: suite/locales/Makefile.in

>+ifneq (,$(filter mac cocoa,$(MOZ_WIDGET_TOOLKIT)))
>+MOZ_PKG_MAC_DSSTORE=$(_ABS_DIST)/branding/dsstore
>+MOZ_PKG_MAC_BACKGROUND=$(_ABS_DIST)/branding/background.png
>+MOZ_PKG_MAC_ICON=$(_ABS_DIST)/branding/disk.icns
>+endif

Don't you want MOZ_PKG_MAC_EXTRA here too?

Comment 11

[Mark Mentovai]

Comment on attachment 291486 [details]
placeholder background image; save to /suite/app/macbuild/background.png

English text in an image that isn't currently localized?

Comment 12

[Samuel Sidler (old account; do not CC)]

Comment on attachment 291510 [details]
New placeholder disk icon

I'd recommend creating 256 and 512 versions of this icon, for 10.5. If you don't have access to 10.5 but can provide the images, I'll create the icns file for you.

Comment 13

[Smokey Ardisson (offline for a while; not following bugs - do not email)]

Comment on attachment 291510 [details]
New placeholder disk icon

It also looks like the 128x128 version of the icon has jaggies on the disk's edges, were some various shades of grey ended up converted to white and black pixels (compare say mozilla/camino/resources/package/disk.icns to yours using Iconographer, or Icon Composer on 10.5, and cycle through the background colors).

Comment 14

[Stefan [:stefanh]]

(In reply to comment #10)
> Do you maybe want the new --format UDBZ here too?  You're trunk-only and are
> therefore targeting 10.4 as a minimum, right?

Yeah, we talked about this on irc - Karsten is going to do a new patch.

(In reply to comment #11)
> (From update of attachment 291486 [details])
> English text in an image that isn't currently localized?

There's a new background.png on it's way that won't have any text in it.



(In reply to comment #12)
> (From update of attachment 291510 [details])
> I'd recommend creating 256 and 512 versions of this icon, for 10.5. If you
> don't have access to 10.5 but can provide the images, I'll create the icns file
> for you.

Thanks :-) There's a chance that I'll done my upgrade soon, though. I'll see if I can get hold of some larger sized icons and if I need help I ping you.

(In reply to comment #13)
> (From update of attachment 291510 [details])
> It also looks like the 128x128 version of the icon has jaggies on the disk's
> edges, were some various shades of grey ended up converted to white and black
> pixels (compare say mozilla/camino/resources/package/disk.icns to yours using
> Iconographer, or Icon Composer on 10.5, and cycle through the background
> colors).

Oops - I guess I should redo the icons. I just gonna get hold of that iMac with CS2...

Comment 15

[Smokey Ardisson (offline for a while; not following bugs - do not email)]

(In reply to comment #14)
>> (In reply to comment #13)
> > (From update of attachment 291510 [details] [details])
> > It also looks like the 128x128 version of the icon has jaggies on the disk's
> 
> Oops - I guess I should redo the icons. I just gonna get hold of that iMac with
> CS2...

In a pinch, you can probably fix the current icon itself just by copy/pasting blocks of pixels for those areas from the current Camino disk icon to yours in Iconographer or another pixel-based icon editor.  But if you're going to regenerate all the source images for the larger icon sizes anyway, it matters less.

Comment 16

[Stefan [:stefanh]]

Comment on attachment 291483 [details] [diff] [review]
Makefile changes for improved .dmg installer

Removing request since we'll see a new patch once we've settled icons/backgrounds. Speaking of stuff that should be included in the dmg, I think we also should include the readme.

Comment 17

[Stefan [:stefanh]]

Attachment: New background

Here's a new background. The readme file should be placed below the white drag-zone, centered between the drag-zone and the bottom edge of the image. Illustrator didn't like the svg file, so I had to scale up a 200x200 icon to get the large icon at the left. It would probably be better with a 380x380 icon made from the svg file. I could probably also need a better, 180px wide header image (this one is ripped from the website and scaled down). Comments are welcome - I haven't yet checked whether the background fits with the Leopard-styled Application folder.

Comment 18

[Stefan [:stefanh]]

Attachment: background image in action (WIP, not fine-tuned)

OK, just attaching what it might look like - the readme.txt should be under the arrow, in the middle between the drag-zone and the bottom. Some work left to do (fine-tuning, might need a larger drag-zone etc). Comments are welcome

Comment 19

[Stefan [:stefanh]]

Attachment: background image to use

OK, here's the final version. Will attach a "template" on how I thought things should be positioned.

Comment 20

[Stefan [:stefanh]]

Attachment: background with .app, Applications folder and readme file

Icons in the disk image should be 64x64. Icon sizes can be adjusted if you hit Cmd+J when you have the dmg window open.

Comment 21

[Stefan [:stefanh]]

I just talked to karsten, and I asked him to hold on a bit until I've attached a new disk icon. I might also do some minor adjustments of the background.

Note btw, that the resizer on Tiger is not transparent, so the resizer will appear like a white square in the bottom right corner. That is, the only way to go if you care about the resizer is using a white background - unless mento knows some advanced magic :-). Since I'm on Leopard (where the resizer is transparent), I haven't really been able to judge whether this is an issue or not.

Comment 22

[Stefan [:stefanh]]

Comment on attachment 291483 [details] [diff] [review]
Makefile changes for improved .dmg installer

So, I get a new disk icon and a tweaked background.png up here as soon as time permits - that will most likely mean first/second week of January.

Comment 23

[Stefan [:stefanh]]

Attachment: Slightly improved background (final version)

Here's a new version of the background. A "template" is coming up as well ;)

Comment 24

[Stefan [:stefanh]]

Attachment: background with .app, symlink and README.txt

Here's how it's supposed to look (Photoshop mockup)

Comment 25

[Stefan [:stefanh]]

It's a little bit confusing what icon sizes we *really* need for the disk.icns file. Camino has 128x128, 48x48, 32x32 and 16x16 (ss is going to add 512 and 256). Firefox has only one icon; 128x128.

I'm absolutely convinced that the most important sizes are 512, 256 and 128. I'm going to try and make some decent looking 32x32 and 16x16, but I doubt they will be better than the scaling done by the OS.

Comment 26

[Stefan [:stefanh]]

KaiRo: Speaking of a place for the background, disk.icns and .dsstore file... How does suite/branding/package sounds? Or maybe suite/branding/mac/package? Everything except the dsstore file is branded - the dsstore controls appearance/positioning/size etc (one could say it's a part of the branding). Another option would be to put the files in suite/app/macbuild/package if we don't care that it's branded.

One thing to note is that those files are only used when the .dmg is made by the script in build/package/mac_osx/pkg-dmg 

Firefox have the files in other-licenses/branding/firefox/ (together with other icons etc), Camino have the files in camino/resources/package/ while other images seems to be in camino/resources/images/

(I kind of like the dir name "package")

Comment 27

[Stefan [:stefanh]]

Attachment: New .dmg icon (checked in)

Here's a new disk.icns file. I'm not 100% satisfied with the quality at smaller sizes, but it's the best I can do atm.

Comment 28

[Smokey Ardisson (offline for a while; not following bugs - do not email)]

Comment on attachment 301131 [details]
New .dmg icon (checked in)

This looks good to me, especially at the larger sizes.  

I zoomed in a bit on the smaller two and can see what probably makes you unhappy about those sizes, but after a bit of playing around, I wasn't able to make the tiny imperfections go away.  The tiny imperfections are very similar to the tiny imperfections in Camino's dmg icon, so I think you're safe with the smaller sizes as they are.

Also, fwiw, I think your small sizes look better than the results of the OS's scaling when there are no small icons in the .icns file.

Comment 29

[Smokey Ardisson (offline for a while; not following bugs - do not email)]

Comment on attachment 299464 [details]
Slightly improved background (final version)

Stefan asked me if I had any comments on this, too.  My only comment on this would be that the ® looks more like a little blue blob or a "mistake" than the ® symbol.  

I suppose the smaller the pixels on your screen, the more blob-like it looks, so on screens that have lower dpi than mine, it might look better.

Comment 30

[Robert Kaiser]

We don't need an ® on the icons, IMHO... can anyone show me some screen shot of how the icon sizes look in a format that a poor non-Mac-person can read? Or is there a .icns viewer for Linux?

Comment 31

[Samuel Sidler (old account; do not CC)]

Attachment: Screenshot of new DMG icon

Comment 32

[Stefan [:stefanh]]

I'll attach an updated background image as soon as time permits. Btw, KaiRo - any suggestions re comment #26?

Comment 33

[Robert Kaiser]

The icon looks fine, I think the best directory for it would be branding/package/mac/

Comment 34

[Stefan [:stefanh]]

Attachment: New background without "®" (checked in)

New background without "®". Really final :-)

Comment 35

[Stefan [:stefanh]]

Comment on attachment 301131 [details]
New .dmg icon (checked in)

Requesting sr as well.

Comment 36

[Stefan [:stefanh]]

Landed disk icon and background image in suite/branding/package/mac:

RCS file: /cvsroot/mozilla/suite/branding/package/mac/background.png,v
done
Checking in background.png;
/cvsroot/mozilla/suite/branding/package/mac/background.png,v  <--  background.png
initial revision: 1.1
done
RCS file: /cvsroot/mozilla/suite/branding/package/mac/disk.icns,v
done
Checking in disk.icns;
/cvsroot/mozilla/suite/branding/package/mac/disk.icns,v  <--  disk.icns
initial revision: 1.1
done

Comment 37

[Karsten Düsterloh]

Attachment: updated dsstore (.DS_Store) file; needs to go into /suite/branding/package/mac/

This is the updated dsstore file, which will copied into the .dmg as .DS_Store. It positions correctly both SeaMonkey.app and SeaMonkeyDebug.app, plus the /Application target, plus the README.txt.

Comment 38

[Karsten Düsterloh]

Attachment: Makefile changes for improved .dmg installer, v2

This updated Makefile.in patch
- expects files in /suite/branding/package/mac
- uses UDBZ
- adds README.txt to the .dmg main level

Comment 39

[[e-mail]]

Comment on attachment 305890 [details] [diff] [review]
Makefile changes for improved .dmg installer, v2

>+ifndef MOZ_BRANDING_DIRECTORY
>+	$(NSINSTALL) -D $(DIST)/branding
>+endif
>+	cp $(topsrcdir)/suite/branding/package/mac/dsstore $(DIST)/branding/dsstore
>+	cp $(topsrcdir)/suite/branding/package/mac/background.png $(DIST)/branding/background.png
>+	cp $(topsrcdir)/suite/branding/package/mac/disk.icns $(DIST)/branding/disk.icns
This endif is in the wrong place. You only want to copy the files if you don't already have a branding directory. sr=me with that fixed.

Comment 40

[[e-mail]]

Comment on attachment 305889 [details]
updated dsstore (.DS_Store) file; needs to go into /suite/branding/package/mac/

Not sure how I can meaningfully sr this ;-)

Comment 41

[Stefan [:stefanh]]

Attachment: 10.5 problems

There are a few issues with the dsstore file on 10.5. I wonder if there's a way to control whether you have the status/navbar or not since it seems that the navbar (bottom bar) is the cause of the scrollbar. Note also the positioning of the window.

Comment 42

[Stefan [:stefanh]]

Comment on attachment 305889 [details]
updated dsstore (.DS_Store) file; needs to go into /suite/branding/package/mac/

Minusing due to comment #41

Comment 43

[Smokey Ardisson (offline for a while; not following bugs - do not email)]

(In reply to comment #41)
> There are a few issues with the dsstore file on 10.5. I wonder if there's a way
> to control whether you have the status/navbar or not since it seems that the
> navbar (bottom bar) is the cause of the scrollbar. 

If the path bar is anything like the status bar, probably not; last time mento looked at the status bar, there wasn't any way to control that, and we just increased the size of the bg image and window to compensate (see bug 305369 and bug 305717).

Comment 44

[Stefan [:stefanh]]

(In reply to comment #43)
> (In reply to comment #41)
> > There are a few issues with the dsstore file on 10.5. I wonder if there's a way
> > to control whether you have the status/navbar or not since it seems that the
> > navbar (bottom bar) is the cause of the scrollbar. 
> 
> If the path bar is anything like the status bar, probably not; last time mento
> looked at the status bar, there wasn't any way to control that, and we just
> increased the size of the bg image and window to compensate (see bug 305369 and
> bug 305717).
> 

Thanks for the info. OK, so the path bar is at the bottom - that was what I originally ment with "navbar". I guess I have to do a new background that's slightly larger. Sorry, Karsten - except for the position of the window, I'm the one to blame here :-/

Comment 45

[Karsten Düsterloh]

I must confess I have no idea what you are talking about.
My usecase when sizing was this:
- doubleclick the dmg
- resize the resulting window so that its edges align with the edges
  of your background

Do you mean showing the dmg contents when shown in a "normal" Finder window?

Comment 46

[Stefan [:stefanh]]

Comment on attachment 305890 [details] [diff] [review]
Makefile changes for improved .dmg installer, v2

This works/looks fine provided Neils comment is addressed.


+ifneq (,$(filter mac cocoa,$(MOZ_WIDGET_TOOLKIT)))

You don't need the "mac" part here.

Comment 47

[Stefan [:stefanh]]

Regarding the dsstore file: Karsten and I talked about it on irc and the solution will be to move the readme file upwards a bit (in order to avoid the scrollbar).

Comment 48

[Karsten Düsterloh]

Attachment: dsstore v3; needs to go into /suite/branding/package/mac/

Updated .DS_Store file, which should not cause Leopard to show scrollbars.
Also, the window should pop up centered on screen (depending upon your screen size, I suppose).
Stefan, does this work for you now?

Comment 49

[Karsten Düsterloh]

Attachment: dsstore v4; needs to go into /suite/branding/package/mac/ [checked in]

v3 was broken, I just positioned the SeaMonkeyDebug.app icon. :-/
This version is not centered for 12" screens anymore, for pleasing large screen users. ;-)?

Comment 50

[jag (Peter Annema)]

(In reply to comment #46)
> (From update of attachment 305890 [details] [diff] [review])
> +ifneq (,$(filter mac cocoa,$(MOZ_WIDGET_TOOLKIT)))
> 
> You don't need the "mac" part here.

So this can simply become:

ifeq ($(MOZ_WIDGET_TOOLKIT),cocoa)

Comment 51

[Karsten Düsterloh]

Attachment: Makefile changes for improved .dmg installer, v3 [checked in]

Landed attachment #308007 [details] (dsstore) along with this on trunk.