Replace loading indicator

[adamgall]

Use the following animation in place of the current 3-bar loading animation:

https://codepen.io/ruigewaard/pen/dyKZYQ

[mudrila]

@adamgall @decentdao/design @decentdao/product Don't we wanna animate our logo instead or something? Just wanna make sure we're all aligned on the animation to use

[DarksightKellar]

I uh ... I think this is a bit much:

I agree with instead using the logo is some form.

Or just ... not changing what already looks totally fine?

[adamgall]

@nicolaus-sherrill please run a design cycle on this and make sure it's integrated into Figmas before engineering spends time on it.

[xanaramoss]

We don't have an animated logomark. We tried some options but nothing passed.

I agree with @DarksightKellar the one above looks a bit too much. I can look at some options, but I prefer the current one than this one.

[xanaramoss]

@xraystyle1980 @nicolaus-sherrill I created a customized one. Let me know what you think. Lottie V1 Lottie V2

json here ⬇️ Loading_app_v2.json Loading_app_v1.json

[tomstuart123]

Nice , @xanaramoss . Excited to get your take rest of @decentdao/design

This also has potential to be picked up now we have more progress on hats

[adamgall]

when @decentdao/design has agreed on one of the options, we can move this to Ready

[nicolaus-sherrill]

@decentdao/engineering @xanaramoss The point of this issue was to get a quick change to the element preloader per Parker's request with something else already created before doing anything more custom.

Suggest implementation of the original suggestion would be using a white alpha 4% color so that it would be very subtle over the cards. If others have suggestions of alternatives to swap in, I'm open to them, but Parker wants a change here.

The ask was something more appropriate to the brand identity and much more subtle than the current three growing/shrinking bar design.

If we are going to produce something custom, my preferred solution would be to display an empty state of loading elements with a glare moving across the element (check youtube on a poor connection mobile for reference of this type of pattern), but that is going to take more work than swapping something stock.

[xanaramoss]

@decentdao/engineering @xanaramoss The point of this issue was to get a quick change to the element preloader per Parker's request with something else already created before doing anything more custom.

Suggest implementation of the original suggestion would be using a white alpha 4% color so that it would be very subtle over the cards. If others have suggestions of alternatives to swap in, I'm open to them, but Parker wants a change here.

The ask was something more appropriate to the brand identity and much more subtle than the current three growing/shrinking bar design.

If we are going to produce something custom, my preferred solution would be to display an empty state of loading elements with a glare moving across the element (check youtube on a poor connection mobile for reference of this type of pattern), but that is going to take more work than swapping something stock.

@nicolaus-sherrill thanks for the context! With the alpha I think that one might work hell. What about the one I did but with Alpha? Is it too much? It is because it's a repetitive element it might be too distracting with the circular movement?

For sure I can create one with your suggestion, but I need more visual cues/references before animating. Something like this?

[nicolaus-sherrill]

For sure I can create one with your suggestion, but I need more visual cues/references before animating. Something like this?

@xanaramoss Yes, exactly, something like that! Per standups last week, engineering believes implementing it won't be too big of a lift. I think we also have additional design responsibility to create empty-state designs of components that are loaded in this way to handoff to ENG as part of this work.

Tom and I are going to discuss design backlog tomorrow and prioritize items, with this top-of-mind.