agree. it also needs style. it needs a lot actually!
Works done by @uhmpeps is pretty good. I would like to see the light mode and I would have a light layout architecture but itâs just my thought.
Thank you malandraj, working on it! Light mode soon,
so this is the end view of the app im focused on and not the landing page
also, by focusing on dark mode which requires more precision to ensure its right structurally
working backwards from this endpoint, there will be multiple views that explain each product and also provide a simplified way to select desired products
anyway, iâll continue with this and weâll see where we land
Left menu:
- Each item can have an âiâ or hoverover for info. (ie Hover over Zap to learn what it does)
- Vote should be one of the menu items. Itâs one of the key âverbsâ and products.
- Colors: It could be an interesting nod to Andreâs original DNA design to have Vault be salmon, Earn be pink, Zap be blue icons etc. But then some repeat colors like Vote donât work. Just thinking outloud hereâŚ
- âDashboard by Zapperâ should maybe have itâs own purple line â section â to separate it. It is not a Yearn âProductsâ section product.
What about mobile?
Great notes ty, mobile in progress
honestly I have only 1 or two vaults. Having the vaults take up a whole side column seem like too much. Why not put them small up top or make it hideable at least
We can add a âhide zero balancesâ toggle
ok - below are a bunch of screens for different steps, all in dark mode, - other color modes will be provided at live page. requesting feedback
new user lands here
then user continues onboarding for a few screens (optional) (images will be added in blank spaces)
user has now logged in with wallet. top left shows example of activated dropdown menu so user can relabel address, copy address or copy address etherscan link
user selected vault, blank inactive with instruction, graphic is coming soon, text will be bigger etc
user selected Earn, you can see instructions (text will be bigger) and graphic below it. Graphic is copied and upgraded from @definn I canât see if he is on this forum.
Some scattered feedback based on my own preferences:
- I think âHow it worksâ is probably better phrased as âHow does it work?â
- There is a lot of blank space on the onboarding slides. I think it may be nice to increase the font size of both the headers and the text to make them more of a visual focus, as well as removing some of the padding.
- Some unDraw style illustrations could perhaps also help the more visually inclined people during the onboarding slides, if only to add some more flourish.
- The contrast of the Resources tab is a little low. Iâd personally prefer a brighter color to make it a little more prominent.
- Iâd personally like to see clearer delineation between the three panels (side, vaults, and main), e.g. via brighter borders, but I know that lower contrast and minimalism is more popular these days.
- Iâm used to seeing the dark/light mode toggle on the upper right hand corner of the screen. Do you think itâd also fit there? I didnât notice it at first at the bottom right corner.
Awesome as always! A few comments here.
For the âWhat would you like to do?â page, Iâd like to propose something a little more structured and conversational to the user. Suggesting that we may be able to break up each section , as per my mock below -
- This gives first time user a clear indication of which button does what, which is obvious to us here but most definitely needed for first timers.
- Clearer organization of info & call to action.
- For Vault/Earn tabs, removing the sub-text (cleaner look I think) & adding APY to make it clear what kind of product it is.
Another suggestion would also be to more prominently display the section a user is on, I know the left side bar shows it, but from UI perspective I think it takes âeffortâ to know which page I am now on as I have to look left to remind myself.
Adding a small indicator to the top of the page (eg. vault selected) may solve it. Also incorporated a bit of @boatonagoatâs suggestions to make better use of space.
Nothing to add here, but Iâd like for people to stop bitching and shitting on @uhmpeps and his website mockups. Speaking to the people that think âa professional should be hiredâ. Nothing says he is not a professional. Heâs dedicating time and efforts producing something 99% of people here wonât or canât.
To @uhmpeps, I love the style, keep it coming. At the end of the day, if Yearn as a whole does not adopt your proposal âofficiallyâ and the âofficialâ revamp comes at a much later date, you could just as easily deploy this in prod on your own domain and advertise the website. Let people choose with their clicks which website they prefer for interacting with the protocols.
I see this no different than what Zappier did by creating a shell over the existing yearn protocols.
(working on gfx)
@tracheopteryx
@Jin
@boatonagoat
@gargantua
@dripdrop
@midnightcheese
@digitaloil
@SheckyGreen
@point
@DavidHay
(can only @ up to 10 people in a post)
@GeorgeMoroz
@timbit
@YieldBouncer
@kazuya
@yLearn.finance
@ETH_Maximalist
@Juanma
@n00b
@freezer
@Definn
Yes, much better. Simpler and flow driven. I really like the Invest, Protect, Govern, Manage shot. Great starting point.
@uhmpeps Should you add a DAO(under Invest) section to that screen? I donât think it fits under âVaultsâ. Andre announced this today: https://twitter.com/iearnfinance/status/1299668170668740608?s=20
Awesome. Iâm still a sucker for larger font sizes (and wish it were a little larger), but the additional graphics + updated layout on the What would you like to do? portion looks awesome.
Thanks for being so open to feedback!
Yes itâll be flexible enough to allow the addition of any products
Looking good! I like how you held peopleâs hands through the process.
Azeem, you killing it man. Top notch work.