search

Joystream / atlas

Whitelabel consumer and publisher experience for Joystream
https://www.joystream.org
GNU General Public License v3.0
101 stars 45 forks source link

Surface CRT activity #6344

Open dmtrjsg opened 1 month ago

dmtrjsg commented 1 month ago

Inspiration: dextools.io

  1. Thinking of like a trades ribbon without timestamps: Only Token + Trade + Member handle who purchased (last 30)

Like this

Screenshot 2024-05-29 at 11 20 01
  1. Hot tokens (based on page hits) Screenshot 2024-05-29 at 11 21 17
msmadeline commented 2 weeks ago

@dmtrjsg Hey, Just finished designing the trades ribbon and hot tokens section. I did desktop and mobile view. Also I modyfied the top selling channels section on the mobile so that it's a better UX.

➡ figma page: https://www.figma.com/design/zQYsZXJo6jmbqcj1kRRmDG/Marketplace?node-id=1385-69557&t=hRUZWI5c7pkd300r-4

dmtrjsg commented 2 weeks ago

Nice work! Here's what I think we would want from the second iteration in terms of page and widgets structure.

1 Ribbon with trades on top: Token name; tokens purchased / sold; member handle who purchased 2 Hot pairs: #rank, icon, token name, price, % increase in price last 24 hrs. Can be up or down. Maximum vertical is 5 tokens, Scrollable horisontaly to total of 10. 3 Weekly Gainers / Weekly Loosers

rank, icon, token name, price, % increase in price last 7 days. Maximum vertical is 5 tokens, Scrollable horisontaly to total of 10.

4 Featured tokens 5 Top selling channels 6 All tokens

msmadeline commented 2 weeks ago

@dmtrjsg Hey! I implemented the feedback and did the desktop view. Let me know what you think.

📱Mobile design: https://www.figma.com/design/zQYsZXJo6jmbqcj1kRRmDG/Marketplace?node-id=1396-154157&t=Hsn11CMPLzQFAxRe-4

💻Desktop design: https://www.figma.com/design/zQYsZXJo6jmbqcj1kRRmDG/Marketplace?node-id=1391-138536&t=Hsn11CMPLzQFAxRe-4

CC. @bedeho

bedeho commented 2 weeks ago

@dmtrjsg Some opinions

  1. I think price is useless, it has no information, just a unit bias. Price makes sense if you are tracking the same asset over time, like if you already know where it has been, but for a discovery scneario, where you are meeting new tokens, it holds 0 information.
  2. Why is liquidity no included, or liquidity dynamics, like up x% in liquidty, that is a real metric which people care about.
  3. Similar with volume, more susceptible to being gamed, but still.
  4. "Top earning" are basically not useful imho, its just a static cast that never ever changes, I have tuned it out on the current other pages long ago, that's my experience.
dmtrjsg commented 2 weeks ago

@bedeho thank you for your feedback, super valuable!

  1. On liquidity:
    • I believe we want to display the metric which is more volatile based on the humble sales / tx volume. Imo this will be the price, hence the rationale.
    • Liquidity will be added to the All tokens table and users can sort/ filter based on that parameter
  2. On Volume and Top Earning channels
    • Agreed, @msmadeline let's replace Top Selling Channels widget with Top Traded Tokens by Volume
bedeho commented 2 weeks ago

I believe we want to display the metric which is more volatile

dmtrjsg commented 2 weeks ago

@msmadeline let's prepare the version without explicit price levels, only price change in % and liquidity change in % for daily gainers and losers.

dmtrjsg commented 2 weeks ago

@bedeho spoke with Ignazio, we concluded that Price is better optics compared to JOY liquidity change for the small volume of transactions we are having now.

msmadeline commented 1 week ago

@dmtrjsg I did RWD for the new tokens page. let me know wdyt

➡ https://www.figma.com/design/zQYsZXJo6jmbqcj1kRRmDG/Marketplace?node-id=1498-239456&t=zwSFeJq4U0SqYqpp-4

msmadeline commented 1 week ago

@dmtrjsg I updated the user stories foe the new layout of the tokens page

➡https://www.figma.com/design/zQYsZXJo6jmbqcj1kRRmDG/Marketplace?node-id=1518-281941&t=zwSFeJq4U0SqYqpp-4 ➡https://www.figma.com/design/zQYsZXJo6jmbqcj1kRRmDG/Marketplace?node-id=1519-286848&t=zwSFeJq4U0SqYqpp-4 ➡https://www.figma.com/design/zQYsZXJo6jmbqcj1kRRmDG/Marketplace?node-id=1519-292117&t=zwSFeJq4U0SqYqpp-4 ➡https://www.figma.com/design/zQYsZXJo6jmbqcj1kRRmDG/Marketplace?node-id=1519-297045&t=zwSFeJq4U0SqYqpp-4