Use better icon for downloading HTML scene

[caseyyee]

Something more like:

Or just a button with "Export" text would be better even.

[cvan]

The icon is supposed to represent "Download (the exported files)."

Download icons are always downward:

And upload icons are always upward:

---

I mentioned in issue #166 that we ought to have a clear toolbar with text labels (à la Sketch's):

Vizor actually has a very similar toolbar to what I'm proposing (although I'll admit some of the terms such as New, Duplicate, and Patches aren't clear that they are referring to a new scene, a duplicated scene, and a "changeset" to the scene.

Look at Vizor's Save Patch icon below. We should use a very similar icon with complementary text (though that's been covered exhaustively in #166 and #37).

I would suggest just changing the title of this issue to be "Export icon is ambiguous" (IMO).

[cvan]

I just did a ton of searches for export, download, picture, html, zip, package, presentation, browser, etc. My favourites are probably the ones here: https://thenounproject.com/search/?q=download+browser

I did a few treatments for people to see how they might look like:

[cvan]

Now, there's the act of "publishing" a scene (to "the cloud"). That's something else. I don't see any issue for that - is there one?

[fernandojsg]

I like the latest icon with HTML on it or the one called "export scene", I feel it's easy to spot. In the case of vizor it looks nice as you have a text below it, but without the text I believe you wouldn't know that this is the export button just for its icon.

We were talking about having an "export" button and when you'll click it it should appears a dropdown with the different options: "save HTML to clipboard", "save to HTML file", "save in the cloud" or whatever.

Regarding "publishing" we had this one: https://github.com/aframevr/aframe-inspector/issues/27

[cvan]

Are we going to assume that any "export" or "download" of the modified scene will include only the resulting modified HTML? If I include a new asset, I assume we'll be uploading those to Uploadcare/Filerpicker.io/AWS/etc., and just referencing everything by URLs.

And, what about the case of multiple scenes in one HTML document? Things definitely get confusing from a mental model then.

If I'm a user, and I found some cool scene I like online, personally, I'd want to be able to inspect it, tweak some values, remove some entities, add my own models, and press a button that syncs (publishes) all the files to a GitHub repo of my choosing (and if it doesn't exist already, make it on behalf of me via a GitHub "integration" [after I give the A-Frame Inspector the permission, of course]) - or give me a .zip I can download (or share with someone) to work on the scene locally.

This question probably deserves to be asked in a different issue/thread, but where does the Inspector stop and the Editor begin? Which workflows are going to be satisfied in the short term? Also, let's keep in mind we are making huge assumptions on how people develop A-Frame/WebVR scenes, let alone web sites. We're a small sample size, and no matter how many GA events we get, we'll never really know - unless we ask, watch, or people tell us - whether the Inspector/Editor is successfully (and pleasantly) improving the loop for developers. That being aside, congrats on the launch. It's really shaping up nicely. Great hustle, Fernando, et. al.! 😄

[fernandojsg]

Yes, you're completely right, probably we should keep conservative and follow the path that devtools were doing in the beginning: be just a useful tool for inspect and help you while debugging and editing your scene in the editor, then we could keep improving with new features. As we could get lost on the many options that we could offer to the users.

I believe the ideal workflow for a newbie user would be to see some example enter the editor, modify things click share and get an URL to share or edit later.

Multiple scenes definitely will be something that will need many changes in the editor, the same as in AFRAME as we need to define some kind of scope for the components loaded on the page instead of load them globally.

We hope to get some feedback from the community on how they use or how they would like to use the inspector, although right now I believe they use just codepen or similar tool for testing and/or plain text editor and refresh the page to see the changes, so I believe we're helping in the current workflow that most of users should be doing.

Let's keep the discussion about sharing on https://github.com/aframevr/aframe-inspector/issues/27 so we could leave this one just for the icon. Thanks for the feedback!! :)

[cvan]

thanks, agree to all comments 👍

[ngokevin]

funny to look back on 15 paragraphs over an icon lol

nuked the feature https://github.com/aframevr/aframe-inspector/issues/517#issuecomment-445454902