Closed Bug 912887 Opened 11 years ago Closed 11 years ago

[app manager] first run experience

Categories

(DevTools Graveyard :: WebIDE, defect)

x86
All
defect
Not set
normal

Tracking

(Not tracked)

RESOLVED FIXED
Firefox 26

People

(Reporter: paul, Assigned: paul)

References

Details

Attachments

(4 files, 6 obsolete files)

When it's the first time the user starts the app manager, we should help him connect his device or install the simulator. We might also want to improve the placeholder in the list of projects when its empty.
Maybe we should have a wizard/setup assistant.
Blocks: appmgr_v1
Any more thoughts on what we want here? Something that takes up the main panel with buttons pointing to the Simulator and ADB? Though it looks like you might have something for the simulator already in bug 912892.
I have a WIP patch. Basically, it's a wizard that helps the user to setup his device or install the simulator.
My initial thought was to build an assistant. Because we won't have time to do so, we will implement a basic first run screen. For the assistant, see bug 916074.
Attached image screenshot (obsolete) (deleted) —
Attached patch Patch v1 (obsolete) (deleted) — Splinter Review
Ryan, can you look at the locales and tell me if the english text is correct? Thank you.
Attachment #804400 - Flags: review?(poirot.alex)
Attachment #804400 - Flags: feedback?(jryans)
Attached image screenshot (obsolete) (deleted) —
Attachment #804399 - Attachment is obsolete: true
Comment on attachment 804400 [details] [diff] [review] Patch v1 Review of attachment 804400 [details] [diff] [review]: ----------------------------------------------------------------- I've got comments from the l10n side, and spellchecker caught Add-on. Didn't review the rest of the text. ::: browser/locales/en-US/chrome/browser/devtools/app-manager.dtd @@ +75,5 @@ > + > +<!ENTITY help.title "App Manager"> > +<!ENTITY help.close "Close"> > +<!ENTITY help.intro "This tool will help you build and install web apps to compatible devices (like Firefox OS). The <strong>Apps</strong> tab will assist you in the validation and installation process of your app. The <strong>Device</strong> tab will give you information about the connected device. Use the bar below to connect a device or start a simulator."> > +<!ENTITY help.links "Useful links:<ul><li>Documentation &amp; troubleshooting: <a target='mdn' href='https://developer.mozilla.org/docs/Mozilla/Firefox_OS/Using_the_App_Manager'>Using the App Manager</a></li><li>Addon: <a target='amo' href='https://addons.mozilla.org/en-US/firefox/addon/firefox-os-simulator/'>Firefox OS Simulator</a></li></ul>"> I'd break the help.links out into an entry for each <li>, and I'd remove the mdn and amo link attributes. I think you can get away with just <!ENTITY help.amo "Addon: <a>Firefox OS Simulator</a>"> and then use js to add the href and target attributes. Tools have issues with html attributes, sadly. You should link to https://addons.mozilla.org/firefox/addon/firefox-os-simulator/, like you do on mdn. Also, it's "Add-on".
Attached patch patch v1.1 (obsolete) (deleted) — Splinter Review
Now with icon.
Assignee: nobody → paul
Attachment #804400 - Attachment is obsolete: true
Status: NEW → ASSIGNED
Attachment #804400 - Flags: review?(poirot.alex)
Attachment #804400 - Flags: feedback?(jryans)
Attachment #804459 - Flags: review?(poirot.alex)
Attachment #804459 - Flags: feedback?(jryans)
Attached image new screenshot with icon (deleted) —
Attachment #804402 - Attachment is obsolete: true
Robcee said: 16:18 < robcee> I would change "install web apps to compatible devices" to "install web apps on compatible devices". 16:18 < robcee> and maybe the last sentence to "Use the bottom toolbar to connect a device or start the simulator"
And Darrin says: 16:19 < darrin> should "like Firefox OS" be either "i.e. Firefox OS" or "i.e. FirefoxOS devices?"
And Darrin adds: 16:20 < darrin> and last sentence should be 'connect TO a device'... no?
After hearing robcee's reasoning, i think 'like Firefox OS' is fine. No need for 'e.g.'.
Thanks Pike.
Comment on attachment 804459 [details] [diff] [review] patch v1.1 Review of attachment 804459 [details] [diff] [review]: ----------------------------------------------------------------- Nothing to add beyond what's already been mentioned. Looks good!
Attachment #804459 - Flags: feedback?(jryans) → feedback+
Comment on attachment 804459 [details] [diff] [review] patch v1.1 Review of attachment 804459 [details] [diff] [review]: ----------------------------------------------------------------- ::: browser/locales/en-US/chrome/browser/devtools/app-manager.dtd @@ +74,5 @@ > <!ENTITY projects.noProjects "No projects. Add a new packaged app below (local directory) or a hosted app (link to a manifest file)."> > + > +<!ENTITY help.title "App Manager"> > +<!ENTITY help.close "Close"> > +<!ENTITY help.intro "This tool will help you build and install web apps to compatible devices (like Firefox OS). The <strong>Apps</strong> tab will assist you in the validation and installation process of your app. The <strong>Device</strong> tab will give you information about the connected device. Use the bar below to connect a device or start a simulator."> Being an xhtml file I don't think it has practical effects, but the nitpicker in me screams at that double space ("…your app. The…") @@ +75,5 @@ > + > +<!ENTITY help.title "App Manager"> > +<!ENTITY help.close "Close"> > +<!ENTITY help.intro "This tool will help you build and install web apps to compatible devices (like Firefox OS). The <strong>Apps</strong> tab will assist you in the validation and installation process of your app. The <strong>Device</strong> tab will give you information about the connected device. Use the bar below to connect a device or start a simulator."> > +<!ENTITY help.links "Useful links:<ul><li>Documentation &amp; troubleshooting: <a target='mdn' href='https://developer.mozilla.org/docs/Mozilla/Firefox_OS/Using_the_App_Manager'>Using the App Manager</a></li><li>Addon: <a target='amo' href='https://addons.mozilla.org/en-US/firefox/addon/firefox-os-simulator/'>Firefox OS Simulator</a></li></ul>"> I'd second Pike's suggestion from comment 8 to break this string in 3 pieces: "Useful links:", and then one string for each list item. Also remove "en-US" from AMO's link.
Attachment #804459 - Flags: review?(poirot.alex)
Attached patch patch v1.2 (obsolete) (deleted) — Splinter Review
Attachment #804459 - Attachment is obsolete: true
Attachment #804604 - Flags: review?(poirot.alex)
Comment on attachment 804604 [details] [diff] [review] patch v1.2 I need to add a troubleshooting section
Attachment #804604 - Flags: review?(poirot.alex)
Attached patch Patch v1.3 (deleted) — Splinter Review
Attachment #804604 - Attachment is obsolete: true
Attachment #804611 - Flags: review?(poirot.alex)
Comment on attachment 804611 [details] [diff] [review] Patch v1.3 Review of attachment 804611 [details] [diff] [review]: ----------------------------------------------------------------- ::: browser/devtools/app-manager/content/index.js @@ +63,5 @@ > + selectTab("help"); > +} else { > + selectTab("projects"); > +} > +prefs.set("devtools.appmanager.firstrun", false); What about setting the pref to false only when we select a tab and `firstRun` is true? So that we keep it displayed until the user actually do something. ::: browser/locales/en-US/chrome/browser/devtools/app-manager.properties @@ +36,5 @@ > + > +# Links to MDN: > +link.usingAppMgr=https://developer.mozilla.org/docs/Mozilla/Firefox_OS/Using_the_App_Manager > +link.troubleShooting=https://developer.mozilla.org/docs/Mozilla/Firefox_OS/Using_the_App_Manager#Troubleshooting > +link.installSimulator=https://developer.mozilla.org/docs/Tools/Firefox_OS_Simulator#Installing_the_Simulator I do not have simulator builds yet, it's a bit more complex than adb as we need to build one xpi per platform and we need to host them on AMO to handle that easily. But this link is misleading. What do you think about adding an entry on "Using the app manager" page that will say, today, that we do not have the addon ready yet and we would update this entry as soon as we manage to host it.
Attachment #804611 - Flags: review?(poirot.alex) → review+
(In reply to Alexandre Poirot (:ochameau) from comment #22) > Comment on attachment 804611 [details] [diff] [review] > Patch v1.3 > > Review of attachment 804611 [details] [diff] [review]: > ----------------------------------------------------------------- > > ::: browser/devtools/app-manager/content/index.js > @@ +63,5 @@ > > + selectTab("help"); > > +} else { > > + selectTab("projects"); > > +} > > +prefs.set("devtools.appmanager.firstrun", false); > > What about setting the pref to false only when we select a tab and > `firstRun` is true? > So that we keep it displayed until the user actually do something. Ok. > ::: browser/locales/en-US/chrome/browser/devtools/app-manager.properties > @@ +36,5 @@ > > + > > +# Links to MDN: > > +link.usingAppMgr=https://developer.mozilla.org/docs/Mozilla/Firefox_OS/Using_the_App_Manager > > +link.troubleShooting=https://developer.mozilla.org/docs/Mozilla/Firefox_OS/Using_the_App_Manager#Troubleshooting > > +link.installSimulator=https://developer.mozilla.org/docs/Tools/Firefox_OS_Simulator#Installing_the_Simulator > > I do not have simulator builds yet, it's a bit more complex than adb as we > need to build one xpi per platform and we need to host them on AMO to handle > that easily. > But this link is misleading. What do you think about adding an entry on > "Using the app manager" page that will say, today, that we do not have the > addon ready yet and we would update this entry as soon as we manage to host > it. We don't need to have a valid page right now. We can always update this wiki page later. But what I need to be sure of though is the URL. Are you ok with it?
Attached patch Patch v1.4 (deleted) — Splinter Review
Pike, are you happy with these changes?
Attachment #804632 - Flags: feedback?(community)
Comment on attachment 804632 [details] [diff] [review] Patch v1.4 Review of attachment 804632 [details] [diff] [review]: ----------------------------------------------------------------- The links should be just hard-coded in the js, there's no point to expose them to l10n. I'm wondering if the whole line of text really should be a link each. I would have expected to see fragments of text still? ::: browser/locales/en-US/chrome/browser/devtools/app-manager.properties @@ +37,5 @@ > +# Links to MDN: > +link.usingAppMgr=https://developer.mozilla.org/docs/Mozilla/Firefox_OS/Using_the_App_Manager > +link.troubleShooting=https://developer.mozilla.org/docs/Mozilla/Firefox_OS/Using_the_App_Manager#Troubleshooting > +link.installSimulator=https://developer.mozilla.org/docs/Tools/Firefox_OS_Simulator#Installing_the_Simulator > +link.installAdbHelper=https://developer.mozilla.org/docs/Mozilla/Firefox_OS/Using_the_App_Manager#Adb_Helper_Add-on These links should just be hard-coded, there's no point to expose them to l10n. They're functionality, not UI.
Attachment #804632 - Flags: feedback?(community) → feedback-
(In reply to Paul Rouget [:paul] from comment #23) > > ::: browser/locales/en-US/chrome/browser/devtools/app-manager.properties > > @@ +36,5 @@ > > > + > > > +# Links to MDN: > > > +link.usingAppMgr=https://developer.mozilla.org/docs/Mozilla/Firefox_OS/Using_the_App_Manager > > > +link.troubleShooting=https://developer.mozilla.org/docs/Mozilla/Firefox_OS/Using_the_App_Manager#Troubleshooting > > > +link.installSimulator=https://developer.mozilla.org/docs/Tools/Firefox_OS_Simulator#Installing_the_Simulator > > > > I do not have simulator builds yet, it's a bit more complex than adb as we > > need to build one xpi per platform and we need to host them on AMO to handle > > that easily. > > But this link is misleading. What do you think about adding an entry on > > "Using the app manager" page that will say, today, that we do not have the > > addon ready yet and we would update this entry as soon as we manage to host > > it. > > We don't need to have a valid page right now. We can always update this wiki > page later. But what I need to be sure of though is the URL. Are you ok with > it? The page you choosed for the simulator will require significant amount of work before being updated correctly: https://developer.mozilla.org/docs/Tools/Firefox_OS_Simulator#Installing_the_Simulator As it mainly explains the dashboard, most of its content should move to a archive for the old simulator addon. So yes, it should end up being the right place to redirect, but in the meantime, it would be easier to refer to a short entry in the "Using the app manager" page.
Attached patch Patch v1.5 (obsolete) (deleted) — Splinter Review
Addressed Pike's and Alex' comments. > I'm wondering if the whole line of text really should be a link each. I would have expected to see fragments of text still? We did that in a previous patch. I think it feels better to have the whole line as a link.
Keywords: checkin-needed
Whiteboard: [land-in-fx-team]
Blocks: 915736
(we also need to update the "install simulator" link in the connection screen)
Keywords: checkin-needed
Whiteboard: [land-in-fx-team]
Attachment #804879 - Attachment is obsolete: true
Status: ASSIGNED → RESOLVED
Closed: 11 years ago
Resolution: --- → FIXED
Whiteboard: [fixed-in-fx-team]
Target Milestone: --- → Firefox 26
Comment on attachment 804883 [details] [diff] [review] 912887 - rebased - updated the string of the simulator install button >--- a/browser/locales/en-US/chrome/browser/devtools/app-manager.dtd >+++ b/browser/locales/en-US/chrome/browser/devtools/app-manager.dtd >@@ -1,23 +1,24 @@ >+<!ENTITY help.usefullLinks "Useful links:"> >+<!ENTITY help.linkToAppMgrDoc "<a>Documentation: Using the App Manager</a>"> >+<!ENTITY help.linkToConfiguringDevice "<a>How to setup your Firefox OS device</a>"> >+<!ENTITY help.linkToTroubleShooting "<a>Troubleshooting</a>"> >+<!ENTITY help.linkToSimulatorAddon "<a>Install Simulator Add-on</a>"> >+<!ENTITY help.linkToAdbHelperAddon "<a>Install Adb Helper Add-on</a>"> Can someone please explain why are we doing this? Unless absolutely needed, you should never expose the <a> tags to localizers. You are risking breaking the UI.
(In reply to Vlado Valastiak [:wladow] @ Mozilla.sk from comment #32) > Comment on attachment 804883 [details] [diff] [review] > 912887 - rebased - updated the string of the simulator install button > > >--- a/browser/locales/en-US/chrome/browser/devtools/app-manager.dtd > >+++ b/browser/locales/en-US/chrome/browser/devtools/app-manager.dtd > >@@ -1,23 +1,24 @@ > >+<!ENTITY help.usefullLinks "Useful links:"> > >+<!ENTITY help.linkToAppMgrDoc "<a>Documentation: Using the App Manager</a>"> > >+<!ENTITY help.linkToConfiguringDevice "<a>How to setup your Firefox OS device</a>"> > >+<!ENTITY help.linkToTroubleShooting "<a>Troubleshooting</a>"> > >+<!ENTITY help.linkToSimulatorAddon "<a>Install Simulator Add-on</a>"> > >+<!ENTITY help.linkToAdbHelperAddon "<a>Install Adb Helper Add-on</a>"> > > Can someone please explain why are we doing this? Unless absolutely needed, > you should never expose the <a> tags to localizers. You are risking breaking > the UI. Meh. Sorry, that was totally stupid. Code changed a lot and ended up like that. My fault. I'll fix that asap.
Thank you, Paul. That's much better now.
Product: Firefox → DevTools
Product: DevTools → DevTools Graveyard
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Created:
Updated:
Size: