Building Fancy DMG Images on Mac OS X

On Mac OS X, applications are usually distributed using disk images (DMG’s). These images are mounted as a separate volume, and it often suffices to drag the application out of the image into your Applications folder. A nice extra feature of these disk images is that their look can be customized, just as every other folder under Mac OS X.

This document explains how such DMG files with a customized look can be built. Moreover, a Makefile is provided such that, once a template look is created for a DMG, the process of building a DMG file from a set of files can be fully automated.

If you have comments or suggestions for this page, please drop me a note.

Creating the template
First, we’ll start by specifying how our disk image should look when it is mounted (and opened). If you don’t need a fancy look, you can skip this section; the Makefile provided at the end of the page will automatically create a default template if you don’t create one yourself.

Using Disk Utility (which comes with Mac OS X), create a new disk image, and call it template.dmg. Select a size which is more than enough to store the contents you plan to put in the final DMG. The Encryption and Format settings (None and r/w respectively) should be left untouched. Then, create your image by clicking Create.
Open the newly created image.
From the View menu of Finder, choose Show View Options You can now customize the way your folder will look. Be careful, don’t forget to select This window only, such that your changes will only apply to the current folder. Using the View menu, you can change the looks of the window even further. Also note that, if you choose a background picture, the picture file must reside in the image itself. It is common to create a (hidden) directory .background in the root dir of the image, dropping the background picture there, and then selecting it as a background. Use Cmd-Shift-G in combination with the full path (e.g. /Volumes/MyDisk/.background) to open the hidden directory in Finder and copy your picture there (or, alternatively, use Terminal). The Select button in the View menu seems to open the .background dir by default if it exists. If not, also use Cmd-Shift-G.
Drag all the files you want in your image into the volume, and place them exactly where you want to. Assign icons to the files by control- clicking on the icons, and using the Show Info dialog. Note that the actual contents of the files in the template does not matter if you are planning to use the automatic build way; they will be overwritten anyway. Hence, you will get the most compact template if all your files are empty.
Customize the icon of the disk image in the same way as the other icons, only this time by control-clicking on the disk image icon on the desktop.
Eject the disk image.
Since the template.dmg file will be quite big, you probably want to compress it using bzip2. This is not strictly necessary, but if you created an initial disk size of 40M, using bzip2 you can reduce this to only 1M.
If all went well, you should now have a template.dmg(.bz2) which, when you open it, has a custom icon on the desktop, and looks exactly how you would like the final disk image to be. Now all we need to do is fill it up with the right files.

Manually building the final DMG
The easiest (but least efficient) way to create a final DMG is by doing it by hand. If you want to do this manually, I assume that you dragged the exact files you want the image to contain in the previous section. All you have to do then is:

Open Disk Utility
Select the image you created in the previous step
Select Convert… from the Images menu
Enter the name you want your final image to get
Select Compressed as your Image Format
Click Save
That’s it, your final DMG should be ready for distribution.

Automatically building the final DMG
Using the template we just created, we can now automatically build a DMG with the actual files. All you need to do is download this Makefile, modify the values on the top of the file, and run make. Alternatively, you can include the Makefile from within another Makefile after setting the proper values, as is illustrated in the example of the fancy-dmg package (also available from the Git repository)

The values that can be modified are:

NAME: The name of your application. This name will appear as the volume name of your disk image.
VERSION: The version number of your package. This is used in the filename of the final disk image.
SOURCE_DIR: The directory where the files you want in your disk image reside.
SOURCE_FILES: The names of the files (without the directory prefix) you want in your source image.
TEMPLATE_DMG: The name of the template DMG file (without the .bz2 extension if it was compressed)
Note that you don’t really need a template.dmg. If the Makefile can’t find one, it will create its own, default disk image.

7 Responses to “Building Fancy DMG Images on Mac OS X”
Michael Henderson » Blog Archive » Creating a Mac OS X Application and Installer says:
May 8, 2006 at 2:47
[...] El Tramo >> Building Fancy DMG Images on Mac OS X Bringing your Java Application to Mac OS X Adobe – Director TechNote: Considerations for creating a Macintosh projector bundle [...]

David Golding Design | | Web and Print Solutions says:
September 21, 2006 at 4:12
[...] Fortunately, Remko Troncon’s blog gives detailed instructions on how to not only add a background image to your disk, but also customize the view. I found it incredibly helpful for creating flashy disks and disk images for the Mac. [...]

Paketering av program - 99mac says:
September 21, 2006 at 11:47
[...] Alternativ 1: Creating a Package Alternativ 2: Building Fancy DMG Images on Mac OS X Detta �r ocks� en bra l�nk: Files & Software Installation [...]

AsUnit XUL UI for OS X at Aral Balkan says:
December 14, 2006 at 23:53
[...] Finally, package it into a DMG. I found these instructions for creating a DMG by Remko Tronçon to be very useful and owe a debt of gratitude to Adium, from which I ripped the background graphic and symlink for the Applications folder. AsUnit-X doesn’t have its own icon yet but that may change in the near future (OS X-style icon donations are welcome!) [...]

Ordner-Erscheinungsbild fixieren - Apfeltalk says:
February 14, 2007 at 18:42
[...] mal stellvertretend… Fuer solche huebschen DMGs gibt’s viele Anleitungen im Internet, und diese hier z.B. find’ ich klar strukturiert und gut verstaendlich. __________________ The Original [...]

The End of the Long Tail » Come and Get It! Interactive Renamer 1.0 says:
August 11, 2007 at 19:47
[...] developing some mad Photoshop skillz! A kind thanks to Remko and this entry on his El Tramo blog for the walk through on creating a nice looking DMG. Posted under Snooty [...]

Links: El Tramo » Building Fancy DMG Images on Mac OS X says:
September 20, 2008 at 0:58
[...] El Tramo » Building Fancy DMG Images on Mac OS X – How to build fancy disk images (with background images ,etc.) on Mac OS X, plus some ways to automate the process from the command line (tags: macosx dmg image howto reference ) Tags: dmg · howto · image · Linky · macosx · reference [...]

1.准备软件：
                DropDMG 英文原版 下载地址 http://c-command.com/dropdmg/
                破解：Name: Le Good Life
                             SN: drpdmg2-R1FJ-9F92-0M55-0203-RX48
2.制作方法：
                将你要打包的文件放到一个文件夹里，然后拖动这个文件夹到DropDMG的窗口（如图1），然后就会在同一目录下生成DMG。如果你的文件夹中有app文件（可执行文件），则生成的DMG文件在装载成虚拟磁盘后，会将这个app文件的图标贴在普通的白色图标上面，并且是立体效果（图2）。注意：请把DropDMG设置选项（Preferences...）里面use custom icon for mounted image勾选上。如果你想自己另外设置图标，就要在DropDMG菜单栏点击 Convert graphic to "Volumeicon.icns" ，然后选择你要转换的图片或者已经有的图标文件，最后将生成volumeicon,icons的路径设置到你要转换成dmg文件的文件夹中（根目录）。
                接下来说一下让dmg文件装载之后，在虚拟磁盘文件夹中显示背景图片，这个就要稍微麻烦一些了。首先将你想设置为背景的图片放到准备转换为dmg的文件夹里，可以放在这个文件夹的其他目录下，然后在DropDMG设置里面，选择转换模式为.dmg Read and write模式，之后转换成dmg,这个dmg并不是最终完成品，请装载它，打开这个虚拟磁盘的根目录，在这里点击右键，选择“查看显示选项”，注意选择“仅这个文件夹”以及最下面的“背景”（选择那张图片），现在你的文件夹显示有背景了吧，好，弹出这个可读可写的虚拟磁盘，设置DropDMG，吧模式改回.dmg read only ,再把这个dmg文件拖到DropDMG里面转换，最后生成的就是你要的东西了。