ENA-115: Overview: Redesign save alerts to provide more info when project can’t save (Phase I)

[kaaaaathy]

Links

Specs: Customized alerts

• An asset is too big (most common and most problematic)
• User gets signed out
• Connectivity, can be Scratch side, or user side

Specs: Changes to nav

• Nav: Save status
• Nav: Connectivity status

General spec

• Invision design file

---

Background

Currently...

This design I made is what is currently implemented.
Here is an overview of the issues and pain points that we are solving in Phase I.

(There is a 4th pain point not listed in this image, which is that you can't create or upload a different project because you get stuck on this error.)

Related filed issues

#4045
#4225
#3764

Overview of Proposed Changes

Goals

1. Customize alerts to each situation (more info below)
   — User can know how to debug or seek help
2. Show save status in nav
   — User can continue working offline if they want, without alert as distraction
3. Show connectivity more clearly
   — User knows they're offline, separate from save status

Goal 1: Customize alerts to each situation

• An asset is too big (most common and most problematic)

• User gets signed out

• Connectivity, can be Scratch side, or user side

• Generic alert for any other case

---

What about multiple alerts?

There will generally be no situations where there are more than 1 of EACH TYPE of alert.
This is the order of operations in which they should appear:

HOWEVER...

There is a case within Use Case 1 where the user may encounter multiple "Asset too big" issues. On average it's between 1-3, but we've seen cases of ~5 or more on occasion.

In this case, follow this defined behavior for multiple alerts. Max alerts we will show at once is 3.

Goal 2 & 3 (changes to nav)

• Goal 2: Show save status clearly in nav

• Goal 3: Show connectivity more clearly

---

What is in Phase II?

At this time, we have decided to readdress the issues below in Phase II. Not yet scheduled.

Resolve File menu action behaviors

• Right now, you can click "Save as Copy," "New," "Load Project" etc in the File menu, but it will not let you leave your project session if you have a save error
• We should design a way to let users perform these actions, or disable them in the menu, depending on what makes sense per context

Asset too big: Preventative alerts

• Should we tell the user at the time of upload if the asset is too big?
• Should we prevent an upload?

Revisit decision around sound editor buttons

• Right now you can't edit a sound if the edit will make it too big.
• Is this the behavior we want?
• If no, we should redesign.
• If yes, we should make sure we tell the user what is happening. Currently no feedback.

Revisit nav state when your account session changes

• Currently, when you get logged out in another tab, we still show you signed in
• We should communicate to people when
  • They get logged out (no feedback right now)
  • They get logged out and someone else is logged in (no feedback right now, but you do get this error if you are trying to save someone else's project, which is not ideal)

Revisit "Save now" in nav

• More details here
• The styling of the "Save now" action as a text component is inconsistent with other actionable buttons.
• We would like to remove, restyle, or rethink this button eventually
• For now, we will not change this behaviorally or visually, because Scratchers still rely on this UI to save. Thanks to @Za-Chary on Scratch for raising this

[apple502j]

Technical stuff from a person who tried to implement it ( #5768 )

It's important to know that one asset can have multiple names. If you just have Asset then you need to find the name of the asset by looping, which may be a performance concern.

Also, lib/alerts/index.jsx expects the message to be static. If it needs to contain asset name, messages need to be generated dynamically. I did it by accepting a function as an argument and having alert.jsx handle it.

Finally the big problem is: there are many ways this can fail. It can be a number from FetchTool (e.g. 403 (invalid session), 413 (too big), 500 (server error)), it can be Error subclass (JSON.parse or NetworkError), or maybe string (although I think it's just NetsTool)

These are tricky parts but I'm sure ST can do it.

[Explosion-Scratch]

Wow! This looks great! The mockups are really great and the new styles also look helpfull. I also like being able to exit the alert.

[towerofnix]

One design comment:

Max alerts we will show at once is 3.

Perhaps a small "..." ellipsis bubble could be shown beneath the third reminder, if there is more than three present at once?

[Explosion-Scratch]

Also this may be unrelated, but why is there "see community" instead of "see project page"?

[towerofnix]

@Explosion-Scratch It's a slightly different design from the actual implementation (out of date probably); you can spot more slight inconsistencies in places like the costume editor toolbox. But yeah, those don't have anything to do with the slide notes regarding the save alerts project.

[mxmou]

@Explosion-Scratch It's a slightly different design from the actual implementation (out of date probably); you can spot more slight inconsistencies in places like the costume editor toolbox. But yeah, those don't have anything to do with the slide notes regarding the save alerts project.

The bitmap/vector switch and big block category names actually seem better than what we currently have.

[Explosion-Scratch]

@mxmou, Probably lol.

[kaaaaathy]

@Explosion-Scratch It's a slightly different design from the actual implementation (out of date probably); you can spot more slight inconsistencies in places like the costume editor toolbox. But yeah, those don't have anything to do with the slide notes regarding the save alerts project.

Yeah good observation :) It is a bit inconsistent based on what files I was using. You can ignore anything that doesn't look like what's in production right now

[griffpatch]

Is it worth considering adding a confirmation on delete of sprite, and sharing of your project while you are looking into these?

…

On Fri, 7 Aug 2020 at 21:41, kathy wu ***@***.***> wrote: @Explosion-Scratch <https://github.com/Explosion-Scratch> It's a slightly different design from the actual implementation (out of date probably); you can spot more slight inconsistencies in places like the costume editor toolbox. But yeah, those don't have anything to do with the slide notes regarding the save alerts project. Yeah good observation :) It is a bit inconsistent based on what files I was using. You can ignore anything that doesn't look like what's in production right now — You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub <#6069 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ABTM3PTH64VVNORQEGDJN7TR7RRIJANCNFSM4PWEHO4A> .

[Explosion-Scratch]

@griffpatch Probably but those might be for another issue, however, I would love those features as well.

[mxmou]

Any progress on this?

[mxmou]

@chrisgarrity ^^

[the2000isawesome]

Has any progress been made towards fixing this problem since the last posts?

[the2000isawesome]

Any updates?

[leahcimto]

Any progress on this?

[hiPeeps124816]

this shouldn't be too hard to implement, any more progress yet?

[apple502j]

Due to how saving works (and how it is done on three different components - WWW, GUI and Storage) this is actually more complicated than you imagine.

But, this is not impossible; should definitely be implemented.