Clearer OS X installation dialogues
I think the screenshots would go great right under the download button on https://www.torproject.org/download/download-easy.html.en. I am thinking of a dialogue similar to the picture attached.
think it would also be good to show how to override Gatekeeper the safe way (Ctrl-click then Open). There are issues with people not being able to open the dmg when they first download Tor Browser since the default is a warning message which does not give the user an option to open the files.
Trac:
Username: cypherpunks-duplicate
Activity
Replying to duncank:
Here is a set of screenshots from the install process. Number 3 could do with some accompanying text to explain the Ctrl-click.
Great! We can add accompanying text in the HTML.
I really like the /Applications one that shows the icon in alphabetical context.
Could you do the screenshots again without the background? Here is how to do it. Press ⌘-Shift-4, then press spacebar, then click in the window when you have a camera icon. Maybe it won't work for the one that shows the context menu. If not, then we can make it work with the backgrounds.
Screenshot using 0001-Add-screenshots-that-show-how-to-run-Tor-Browser-on-.patch.
Here's a patch and a look at what the screenshots look like on the download page.
- 0001-Add-screenshots-that-show-how-to-run-Tor-Browser-on-.patch
- tbb-macosx-step-1.png
- tbb-macosx-step-2.png
- tbb-macosx-step-3.png
I scaled the screenshots down by 50% for two reasons: to make three of them fit in a row, and to reduce confusion with the real windows the user has on their screen. I think 50% is too small, though. What do we think of this look, can we improve it?
Dear tbb-team, what do you think about adding screenshots like this to the download-easy page? What would you change about the presentation?
Trac:
Keywords: gatekeeper tbb-usability-stoppoint-app uxsprint2015 sebastian-0115-triaged deleted, gatekeeper tbb-usability-stoppoint-app uxsprint2015 sebastian-0115-triaged TorBrowserTeam201502R added
This is likely a helpful improvement. But I have some comments:
- We need to make this more clear that these steps are ordered left-to-right. The Mendeley example clearly ordered the steps with numbered text above the graphics. We should probably do that too.
- If we do make this left-to-right, will it confuse Arabic and other RTL users? Can those localizations of the website reverse this order? (Do we even have any localizations of the website in RTL? the language dropdown doesn't seem to work for me)
- I think we should vertically center the images, if possible. The screenshot looks janky and disorienting with lots of unaligned buttons, links, graphics, and widgets all strewn about.
- The text "This package requires no installation. Just extract it and run" is no longer correct. Perhaps this text is why we saw some users trying to run the App directly from the DMG? We should remove this text.
- We should probably also remove "Read the release announcements!" string.
Here is a new patch that adds numbered steps and centers the graphics.
- 0001-Add-screenshots-that-show-how-to-run-Tor-Browser-on-.2.patch
- tbb-macosx-step-1.2.png
- tbb-macosx-step-2.2.png
- tbb-macosx-step-3.2.png
Replying to mikeperry:
This is likely a helpful improvement. But I have some comments:
- We need to make this more clear that these steps are ordered left-to-right. The Mendeley example clearly ordered the steps with numbered text above the graphics. We should probably do that too.
- If we do make this left-to-right, will it confuse Arabic and other RTL users? Can those localizations of the website reverse this order? (Do we even have any localizations of the website in RTL? the language dropdown doesn't seem to work for me)
The web site is not localized at all, as far as I understand. For that reason I didn't worry about RTL. The language dropdown is not for the page language, it's for the bundle language.
- I think we should vertically center the images, if possible. The screenshot looks janky and disorienting with lots of unaligned buttons, links, graphics, and widgets all strewn about.
- The text "This package requires no installation. Just extract it and run" is no longer correct. Perhaps this text is why we saw some users trying to run the App directly from the DMG? We should remove this text.
I agree we should remove that text if it's misleading. I'll bet few people even notice it, though. One of the UX sprint participants even said something like, "Here's a big obvious button, there's a whole bunch of small text that I'm not going to pay attention to."
- We should probably also remove "Read the release announcements!" string.
I think that's outside the scope of this ticket. That string was added in a recent commit (3 days ago). https://gitweb.torproject.org/project/web/webwml.git/commit/?id=706bc301671ea8288d205ee50b928d0d451ac982
I note that there is a similar mini-howto already at https://www.torproject.org/projects/torbrowser.html.en#macosx.
