APR seems useless, and Zap will be replaced by a custom function from Zapper
1 Like
Definitely need to make the āLearn moreā part of it as a bigger part of call to action. I think this because most of us here are nerds in our own bubbleā¦ we should design the website for say the person who understands what bitcoin is, ether, yes, to some extent, and perhaps knows what a Makervault is or has at most deposited or loaned from aave or compound. Letās work with the assumption that 80-90% of users who interact with our website are at that level of knowledge or below and design accordingly if we can Those users, a complex ui/ux that is overwhelming, we will lose those people in the funnel.
I would say find a ui/ux that is somehow less buttons/words and more simple. Find like 10-20 people who their tip of knowledge in this space is at most compound/aave of sorts, and ask them if this makes sense and see where there is stickiness in understanding + how to navigate. That is a good heuristic in my mind
4 Likes
I was critical of the last one but this is amazing. Canāt wait.
1 Like
Dig the strategy diagram. Itās almost there. Have you tried to play with other fonts? Font can make/break the design 
1 Like
If anyone has some time, some help is requested. Here is the latest rough mockup:
notice the following text
By placing your yCRV tokens in this Grow Vault, you can maximize profits with the best automated strategies for your asset at any time.
To receive yCRV, first bookmark this page. Next, deposit accepted assets to Curve.fi where you will receive yCRV upon deposit. Then return to this page to deposit your tokens.
You can also use the Swapper by Zapper button on the left panel to convert any ETH or Stablecoins directly into a deposit in this vault.
we need a small text description like this for every single product found in https://yearn.finance/ so that a user can figure out on first use, how to get or deposit or just generally do the thing and get their assets rolling on yearn
for an easily accessible list of products, see the GROW and SAVE product views here Yearn.Finance all accepted assets are shown in the tables below the main form
you can fill in the info here
Can we test this yet ?
1 Like
From what I can tell from the pics, its much better layout than V1, but ill reserve judgement until I can test it myself. Good work @uhmpeps
1 Like
I like it a lot! You are a very PROACTIVE valuable member of Yearn community.
Thank you for your effort!
3 Likes
I donāt really like the wording of āGrowā and āSaveā. When I save Iām trying to grow my money so I see how people would find the two confusing and potentially synonymous.
Have a link to explainer videos and step-by-step instructions with screenshots of each step for depositing.
Panel-2 needs to have a minimize button. I like that panel-2 shows all of the coins, the APY, and the userās total balance for each coin. I think when people are in multiple vaults at once they will like to see it there when considering depositing into another vault. But I think panel-2 can be condensed slightly (not as much space between Annualized ROI and Total Balance) and there should be a minimize option that when minimized only shows the coin/icon and Annualized ROI. That will give users the option to create more space on the page if they need it, without sacrificing any of the major buttonsā accessibility.
I think the body of the page should be WAY simpler than that. My opinion: Put the selected coin name/icon in big size at the top, put the APY stats in big size spread horizontally (daily/weekly/monthly/yearly) right below that, then include a link below that with something like, āClick here for detailed instructions on how to depositā that takes you to a new page with a video explanation and step by step instructions with screenshots (so they have both options). This will clean up the page immensely.
While the sliding percentage bar looks nice, I think it is unnecessary. All you really need is to make the number after āWallet Balanceā clickable so they can click it and it fills in the max number automatically. A lot of exchanges do this. Getting rid of the percentage bar will free up space.
You can remove the text directly below the deposit/withdrawal buttons. Instead of that notification under deposit, you can have the page display that information after they deposit. For example, after a user deposits yCRV, something displays on the page saying the deposit was successful and shows the name/icon of the token they received with an explanation saying, āThis token is now in your wallet and can be redeemed for your tokens + yield at any time.ā This allows you to keep the deposit/withdrawal page clean before they deposit, and only show that information after.
The text directly underneath the withdraw button can be removed and you can include a one word link that says, āFeesā in the footer of the page, like the way exchanges do it. This would direct them to another page that would detail the fees for each product. But the link to this should definitely be in the footer IMO. This removes unnecessary clutter and makes the page look much cleaner.
If you put the daily/weekly/monthly/yearly APY at the top you can remove the āAsset Value Growth Rateā chart, which is confusing wording to begin with.
And for the yCurve LP Vault Strategy it probably serves better to have the strategy written out and explained in words, as thatās a lot easier to understand than seeing several icons that users may or may not be familiar with. Especially when theyāre repeating and have icons on top of icons.
I think what youāve done is really solid but would certainly like to touch these things up. Please let me know what you agree/disagree with and what requires further clarification. Solid work though and a much needed upgrade for the project.
P.S. For panel-2, I like the top style WAY better than the bottom one. Larger, simpler, and cleaner.
3 Likes
The advantage of Zap is that I can instantly transform stablecoins into depositable funds. Without that piece on the site we should consider postponing this IMO. Sending people off-site to Curve or Zapper is not good ux.
When people land on Yearn.Finance they should be able to do all the basic stuff right on the website. Iām find with having external links that go elsewhere, but not for core functionality (like ZAP) thatās already built into the v1 website. It feels like a major downgrade.
4 Likes
Summary
- A nice improvement from your last one, with some cool stuff (like the vault strat maps). But lacking in the kind of distinctive style and experience innovation that I want to see.
Feedback Framing
- This feedback assumes your latest mock to be very close to final look and feel. Iām not certain thatās the case though (since this post is titled UX). Lemme know if thatās off and thereās a lot more graphic design work planned.
Concept
- It would be great when you present your mocks to speak a bit to the underlying conceptual thesis you are working from. What audience is this targeting? What is the vision for this design? What inspiration are you working from? What is the core concept driving this work?
- To me this concept here seems to be a mix of high-info-density, low-concept design, basic-exchange-trader-style, dashboard thatās heavily influence by Zapper.fi
- Thatās an ok concept, but not inspiring to me personally. It foregrounds and consolidates the essentials in a cleaner way, which is good, but doesnāt really innovate or push the boundaries of whatās possible conceptually or aesthetically. We have the opportunity here to set the tone for the future user experience of ALL GLOBAL FINANCE. I want to see bolder conceptual advances.
- That kinda thing is hard to speak to in a feedback post like this, but Iāll take a stab anyway! Very soon a whole demographic of new users are going to flood the DeFi space. How do we want to speak to them? What opportunities are there to educate them, help them make safe choices, communicate our vision and product to them, communicate what DeFi is to them? How do we show them the extraordinary gleaming future weāre all drunk on? Thatās what our protocols do in their milieu, and thatās what a frontend concept to match yearnās innovation needs to punch into your nervous system. Not seeing that here.
Structure
- The top level nav needs work. We need Zap functionality there. This needs to be re-thought in a holistic product evaluation to remap our offerings and structure them better for new users. I see you pushing in this direction but we need to go farther.
- I love Zapper.fi and use it daily, but no reason to have it in the main nav.
- From my past-life in interface design, the way Iād do this is to start with an affinity map. Take all the things in the yearn ecosystem (all the things, go granular) and make post it notes for them and stick them on a wall. Think about how they relate to each other. Put up all the related legos too, curve, aave, etc. Find the gestalt. Find the top level organizational structure. Start there.
UX
- Itās too high-density for me. Itās like a pro dashboard feel, but Iād like something simpler. Though I think this style does appeal to many and could be a good alt or pro view.
- As a pro view I like the column design.
- I like the slider widgets.
- I love the strategy map! Would love to see more tightly integrated learning resources throughout.
Style
- It lacks style.
- Look at recent projects like YAM, based, and curve. They are dripping in style. They are unique and distinctive. They have a voice. This does not have a voice.
8 Likes
Pasting this in from Discord:
I gotta be honest, the design of the current site is closer to my ideals than the new one
I know youāre putting a ton of work into this @az but my opinion is we just need a few minor tweaks to the current site rather than a whole redesign
Iām not sure where the big push to redesign the site is coming from
This whole redesign process feels like amateur hour to me. Iāve been involved in building web apps for nearly 20 years and this is not how itās done 
we need to start with some mockups, several designs, before thereās any coding done, and pick a layout that makes sense that everyone can agree on
preserving all of the existing siteās functionality
but with an optimized presentation
@az instead of a redesign, can you just quickly fix some of the pain points on the current design? No-oneās having trouble navigating the site, there are just a few nagging bugs and missing information here and there.
6 Likes
I really like the way the strategy flowchart explains the strategy. 
5 Likes
Also, @uhmpeps, my opinion is you should delay any vote on making this live. There are other design processes going too and there isnāt a rush. I want to give others reasonable time to deliver and for the community to be able to look at options.
Ideally, all the designs will inform each other and weāll end up with the best of all worlds. So please donāt rush this to a vote.
You could always launch it under your own URL and make it clear itās an independent project ā test it that way and let people use it.
2 Likes
I disagree. The current website isnāt anywhere near ready for primetime, IMO. When you arrive on the site, there is no intro, branding, or explanation of what it is. Just 4 buttons. The Earn interface is confusing to new users (with v1, y.curve.fi, and busd.curve.fi). They could confuse Earn with Vaults. There is no way to know what Zap is off first glance. Some aspects of it are clean but when I think of optimal I think of an extremely modern, sleek, trustworthy, and user-friendly site that even the most basic crypto user can use. You have to put yourself in the shoes of a beginner. As the site is currently, it is intimidating to that demographic.
1 Like
Really, fantastic notes especially on panel 3, while I must insist on keeping information in the same panel and not on other pages, your other improvements for body structure / content are incredibly insightful and helpful, will be implemented
Good point, will see what I can do about this.
A few minor tweaks.
-New users are intimidated by too much information
-Move text heavy objects to a help icon buttons. Put more detailed explanations in pop ups when pressed
-Try to minimize the amount of text on screen
-Consider a basic/advance mode.
This is a quick mockup to show concepts. I didnāt match fonts, colors or spacing. If I spent a few hours on it I could dial it in.
3 Likes
Love it David thank you!