New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

R&D: Desktop Installers #63

Closed
hermwong opened this Issue Apr 2, 2014 · 7 comments

Comments

Projects
None yet
4 participants
@hermwong
Member

hermwong commented Apr 2, 2014

The PhoneGap-GUI should be packaged into a desktop installer such as .img on Mac and setup.exe on Windows.

@mwbrooks

This comment has been minimized.

Show comment
Hide comment
@mwbrooks

mwbrooks Apr 2, 2014

Member

Edit:_ .dmg on Mac.

Member

mwbrooks commented Apr 2, 2014

Edit:_ .dmg on Mac.

@hermwong hermwong self-assigned this Apr 3, 2014

@hermwong hermwong changed the title from Desktop Installers to R&D: Desktop Installers Apr 22, 2014

@hermwong hermwong modified the milestones: 7. Desktop Installer & more, 6. Bug Squashing & UI refinement Jun 4, 2014

@hermwong hermwong modified the milestone: 7. Desktop Installer & more Jun 17, 2014

@hermwong hermwong modified the milestones: Backlog, Post 1.0 Release enhancements Oct 30, 2014

@hermwong hermwong modified the milestones: Post 1.0 Release enhancements, 0.1.2 Beta Dec 12, 2014

@hermwong

This comment has been minimized.

Show comment
Hide comment
@hermwong

hermwong Dec 12, 2014

Member

@purplecabbage has suggested using Inno for creating a Windows installer.

Member

hermwong commented Dec 12, 2014

@purplecabbage has suggested using Inno for creating a Windows installer.

@hermwong

This comment has been minimized.

Show comment
Hide comment
@mwbrooks

This comment has been minimized.

Show comment
Hide comment
@mwbrooks

mwbrooks Jan 16, 2015

Member

Yesterday, I had the opportunity to chat with @jahoni about the installer experience on OS X. From our chat, she had a few questions that I've looked into and I'll summarize here:

Show me two good examples

Evernote
screen shot 2015-01-16 at 2 22 00 pm

Dropbox
screen shot 2015-01-16 at 2 22 08 pm

What is the standard window size of a mounted image (.dmg)?

As far as I've found, Apple does not encourage a standard size. Both Dropbox and Evernote use custom sizes.

I created a default DMG using the Apple Disk Utility. When I found the image, the window size is 1540x810 (retina) or 770x405 (non-retina). Here is what it looks like:
screen shot 2015-01-16 at 2 09 05 pm

Can the window resize be disabled?

No, the mounted image opens a Finder window that cannot be locked down in any way.

As you can see, the user can resize the window however they wish:
screen shot 2015-01-16 at 2 24 08 pm
screen shot 2015-01-16 at 2 23 56 pm

Tell me about the background image.

The mounted image is simply a customized Finder window. You can mount any DMG (Evernote or Dropbox for example), open the window, and click View -> Show View Options to see the customizable properties.

The background image is very limited. You can define an image, but you cannot define how it is displayed (tiled, stretched, etc) or the image resolution. The image resolution is particularly important. I've recently noticed that all DMG installers have non-retina background images - I believe this is because the image dimensions cannot be specified and a non-retina image must be used to look proper on non-retina displays.

It's safer to use a flat color.

Tell me about the icons

You can position and size the icons, but the user can always change that. Each mounted image has a slider in the top-right corner. This allows the user to scale the icons. This can also result is strange rendering issues when you are creative with the background - for example, checkout what happens with Evernote icon glow:

screen shot 2015-01-16 at 2 24 55 pm

Can we show a EULA?

Yes, it looks as though we can define the text to shown. The EULA will be shown before the image is mounted and the user must agree to it:
screen shot 2015-01-16 at 2 21 55 pm

Member

mwbrooks commented Jan 16, 2015

Yesterday, I had the opportunity to chat with @jahoni about the installer experience on OS X. From our chat, she had a few questions that I've looked into and I'll summarize here:

Show me two good examples

Evernote
screen shot 2015-01-16 at 2 22 00 pm

Dropbox
screen shot 2015-01-16 at 2 22 08 pm

What is the standard window size of a mounted image (.dmg)?

As far as I've found, Apple does not encourage a standard size. Both Dropbox and Evernote use custom sizes.

I created a default DMG using the Apple Disk Utility. When I found the image, the window size is 1540x810 (retina) or 770x405 (non-retina). Here is what it looks like:
screen shot 2015-01-16 at 2 09 05 pm

Can the window resize be disabled?

No, the mounted image opens a Finder window that cannot be locked down in any way.

As you can see, the user can resize the window however they wish:
screen shot 2015-01-16 at 2 24 08 pm
screen shot 2015-01-16 at 2 23 56 pm

Tell me about the background image.

The mounted image is simply a customized Finder window. You can mount any DMG (Evernote or Dropbox for example), open the window, and click View -> Show View Options to see the customizable properties.

The background image is very limited. You can define an image, but you cannot define how it is displayed (tiled, stretched, etc) or the image resolution. The image resolution is particularly important. I've recently noticed that all DMG installers have non-retina background images - I believe this is because the image dimensions cannot be specified and a non-retina image must be used to look proper on non-retina displays.

It's safer to use a flat color.

Tell me about the icons

You can position and size the icons, but the user can always change that. Each mounted image has a slider in the top-right corner. This allows the user to scale the icons. This can also result is strange rendering issues when you are creative with the background - for example, checkout what happens with Evernote icon glow:

screen shot 2015-01-16 at 2 24 55 pm

Can we show a EULA?

Yes, it looks as though we can define the text to shown. The EULA will be shown before the image is mounted and the user must agree to it:
screen shot 2015-01-16 at 2 21 55 pm

@purplecabbage

This comment has been minimized.

Show comment
Hide comment
@purplecabbage
Member

purplecabbage commented Jan 19, 2015

screen shot 2015-01-17 at 1 00 01 am

screen shot 2015-01-17 at 1 00 24 am

@hermwong

This comment has been minimized.

Show comment
Hide comment
@hermwong

hermwong Jan 20, 2015

Member

Inno Setup sample code to disable Windows firewall prompt.

Member

hermwong commented Jan 20, 2015

Inno Setup sample code to disable Windows firewall prompt.

@jahoni

This comment has been minimized.

Show comment
Hide comment
@jahoni

jahoni Jan 20, 2015

Member

@mwbrooks - thanks for looking into all those specifics. I'm partial to the visual design and content of the Evernote example.

Let I need to step in to create the visual assets, or if @GarthDB will be taking the reins.

Member

jahoni commented Jan 20, 2015

@mwbrooks - thanks for looking into all those specifics. I'm partial to the visual design and content of the Evernote example.

Let I need to step in to create the visual assets, or if @GarthDB will be taking the reins.

hermwong added a commit that referenced this issue Oct 26, 2016

Merge pull request #285 from phonegap/installer-bg
[#63] added os x install bg image for the dmg

hermwong added a commit that referenced this issue Oct 26, 2016

[#63] updated icon size, position & window size of the Mac DMG so tha…
…t they would be properly positioned with the new background image

hermwong added a commit to hermwong/phonegap-app-desktop that referenced this issue Oct 27, 2016

hermwong added a commit to hermwong/phonegap-app-desktop that referenced this issue Oct 27, 2016

hermwong added a commit to hermwong/phonegap-app-desktop that referenced this issue Oct 27, 2016

hermwong added a commit to hermwong/phonegap-app-desktop that referenced this issue Oct 27, 2016

hermwong added a commit to hermwong/phonegap-app-desktop that referenced this issue Oct 27, 2016

Merge pull request #285 from phonegap/installer-bg
[#63] added os x install bg image for the dmg

Former-commit-id: 7215c7f

hermwong added a commit to hermwong/phonegap-app-desktop that referenced this issue Oct 27, 2016

[#63] updated icon size, position & window size of the Mac DMG so tha…
…t they would be properly positioned with the new background image

Former-commit-id: fa62aa8

hermwong added a commit to hermwong/phonegap-app-desktop that referenced this issue Oct 27, 2016

hermwong added a commit to hermwong/phonegap-app-desktop that referenced this issue Oct 27, 2016

hermwong added a commit to hermwong/phonegap-app-desktop that referenced this issue Oct 27, 2016

hermwong added a commit to hermwong/phonegap-app-desktop that referenced this issue Oct 27, 2016

hermwong added a commit to hermwong/phonegap-app-desktop that referenced this issue Oct 27, 2016

hermwong added a commit to hermwong/phonegap-app-desktop that referenced this issue Oct 27, 2016

hermwong added a commit to hermwong/phonegap-app-desktop that referenced this issue Oct 27, 2016

Merge pull request #285 from phonegap/installer-bg
[#63] added os x install bg image for the dmg

hermwong added a commit to hermwong/phonegap-app-desktop that referenced this issue Oct 27, 2016

Merge pull request #285 from phonegap/installer-bg
[#63] added os x install bg image for the dmg

Former-commit-id: 7215c7f

hermwong added a commit to hermwong/phonegap-app-desktop that referenced this issue Oct 27, 2016

[#63] updated icon size, position & window size of the Mac DMG so tha…
…t they would be properly positioned with the new background image

hermwong added a commit to hermwong/phonegap-app-desktop that referenced this issue Oct 27, 2016

[#63] updated icon size, position & window size of the Mac DMG so tha…
…t they would be properly positioned with the new background image

Former-commit-id: fa62aa8
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment