design critiques

Design

Without knowing the context of this screen, it’s hard to give fully accurate feedback but:

> sequential process but you can go back any # of steps to refresh or adjust

> lack of visual hierarchy

> inconsistent typography (weight, colour, and letter spacing)

> inconsistent distribution of steps (spacing)

/1

Thanks @heavygweit, I agree that the original post is taken off the context.

Appreciate if you could share your thoughts on the actual screen at https://aerodrome.finance/swap

❤️

personality hire 🌈🤙 fullstack & ux, building /uno

Thanks @erica, I agree that the original post is taken off the context.

Appreciate if you could share your thoughts on the actual screen at https://aerodrome.finance/swap

❤️

Seeing it in context, my feedback would still apply! It does have potential to create confusion or misunderstandings 

Most important feedback to consider is: highlighting warning states & visual hierarchy of values vs labels

Also reconsider the layout, that info isn’t a sequential process but it looks like one

What does suggest the process isn't sequential?

Well these are hypothetical calculations, right? They haven't actually happened yet as I haven't initiated a tx

Super important info is being grouped in with status messages and given the same visual weight

 Price impact is not a step, it's a measure

/1

This layout doesn't make sense for the data/flow you're presenting here. Usually these are 1-step-forward 1-step-backward type of components, but in this one I can go all the way back to "step 1" and refresh my exchange rate which effects everything underneath it. Same with the "adjust slippage" in step 2

The way we get the data we present is sequential actually.

1. amount -> quote
2. slippage -> quote minimum amount
3. price impact -> block or show the allowance
4. allowance -> require or show the swap button
5. swap -> shows the transaction link

Base God

Even if you’re getting the data sequentially, that might not be the best way to present the information to a user. 

The component you’re using here is not the correct one for this data imo (for reasons mentioned earlier)

Check out the interface in this cast:

Even if you’re getting the data sequentially, that might not be the best way to present the information to a user. 

The component you’re using here is not the correct one for this data imo (for reasons mentioned earlier)

Check out the interface in this cast:

https://warpcast.com/qd/0x2f165c47

And also thank you for this discourse! All of my critique is coming from a place of wanting to make all crypto products as safe and intuitive as possible to combat all the bs FUD we have to deal with 😅

1000 $DEGEN

I’m aware they’re different features :) 

Definitely agree to disagree on this, doesn’t make sense to me to have this layout for a process where you’re able to go back and change step 2 when you’re at step 6 

Glad you’ll change some formatting since there’s ripe opportunity for mistakes as it is rn!

@erica I think you're comparing apples to oranges (information to make a swap is not the same as to a position).

Arguments aside, I think there's some good feedback re fonts/icons/colors... but I choose to disagree on the data presentation. Ty ty