Hey all, would love to get some feedback on some design and branding work that’s been ongoing.
Website
A group of community members has informally grouped up in a leaderless way and have been working on branding, design, and the website. This is the result of many people’s work, including: @FutureFund, @iTo, @WrongNebula, @nomad, @Definn, @x48, @Danger, @learnyearn, @lehnberg, @franklin, milkyklim, banteg and many others I apologize for forgetting atm.
This is an ongoing and open process so if you want to be involved please jump in.
Our current plan is to update yearn.finance with a new site map that collects the various ecosystem domains under one improved frontend that isn’t a complete design overhaul but more of a refresh to the original which has become iconic and we all quite like. @FutureFund and their team are doing all the design work pro bono.
Rollover: Track your portfolio’s growth and view stats across all of our products
This would include the current Dashboard features
Products
Rollover: Use our yield-aggregating Vaults, purchase Cover, and mint yUSD at the source
All protocols ready for enduser interaction via a UI would live here
Labs
Rollover: See our research and development work, backend protocols, and new stuff
This space is for more b2b style legos like yBorrow and stuff still in development or early testing
Governance
Rollover: Take part in deciding Yearn’s future by participating in our thriving DAO
Aggregates all the governance sites in one place with the option to redesign each one in the future as our gov process evolves
Community
Rollover: Check out the best projects from our active community
Redirects to learnyearn.finance which will be transferred to yearn control and evolves into a critical onboarding site and community portal
Gallery of yearn partner sites so we can have one place with alternative frontends and 3rd party stats sites to both feature them and also help validate what’s legit from the spam and scams out there
Visual How-To guides and aggregate explainer docs, images, and videos from the community
Docs
Rollover: Learn the details about how Yearn works and find answers to common questions
The official docs which is most of what’s there now plus many more dev resources which we are launching now.
How-Tos will move to learnyearn and we’ll need to figure out the balance there a bit over time
I like this idea a lot. I like Yearns simplicity on the site because it seems that would be pretty low overhead, but having to remember where something is or go to another site to get something done is a pain!
I like the proposed Site Map, but just took a stab at reimagining it myself:
Yearn (Home Page)
The Yearn home page, in my eyes, should be modeled after something like Uniswap.org, that is, not swamped with info, images, and buttons, but rather simple and clean.
It should consist only of a top horizontal menu bar and one sentence about what Yearn represents, such as “Yearn is a suite of decentralized protocols focused on value generation through high risk-adjusted returns on tokenized assets.” The It should serve as a web2 portal to both web2 and web3 interfaces. As such, it should feature a “Launch Apps” button that allows the user to launch any of the 3 “Products” listed, in addition to launching directly from horizontal menu bar, described below.
Products Unclickable item in horizontal menu bar with dropdown menu containing the following:
Invest Clickable link to Balances & Holdings (what is currently called the Dashboard)
Rollover: “Passively manage your funds through automated investment strategies that put your money to work, while keeping costs low”
Transactions Redirects to a page with a similar interface to that of zapper.fi/transactions, which allows the user to see there previous transactions into and out of Yearn’s Vaults.
Explore Investment Options Redirects to a page similar to yearn.finance/stats
Mint Clickable link to interface for minting yUSD
Rollover: “Mint yUSD, an interest-accruing token backed by stablecoins pegged to the US Dollar”
Insure Clickable link to interface similar to yinsure.finance
Rollover: “Purchase decentralized insurance coverage to protect against losses due to smart contract failure”
Labs Unclickable item in horizontal menu bar with dropdown menu containing the following:
Developer Tools Unclickable item with dropdown menu containing the following:
Jobs Redirects to a Jobs portal maintained by Yearn Governance
Rollover: “Search and apply for salaried positions funded by Yearn Governance”
Logo & Brand Redirects to page in which you can download the official logos of the Yearn ecosystem (YFI, yUSD, yETH, etc.) and other official Image Assets
As you can see there is certainly plenty of overlap with what was already proposed, but figured some of these proposed differences/additions may be worth considering. Ultimately, what I’m proposing is to implement a UI that feels a bit more like Uniswap’s, as I find it’s UI to be very clean and logical. Thoughts?
Thanks for this! Really helps to have another POV on this stuff. And I agree about uniswap in part—though I’m not a fan of the web2 vs web3 UX distinction and get confused by their organization. I’m not sure why a “launch app” button is needed?
Thanks for the feedback. Platforms like Uniswap and Aave have a homepage that feels like a standard trad-fi website, but instead of having a “Sign Up” button to prompt creation of an account, you hit a “Launch App” button (Uniswap) or “Enter” button (Aave). While many on CT may not think that this is an important feature to a homepage (since “accounts” are not even a thing in DeFi) and may even find it to be a nuisance at this point, I believe that it is a crucial onboarding feature.
I’m trying to put myself in the shoes of a nontechnical user who has just heard about Ethereum and does not yet understand the concept of having a Metamask wallet (it goes without saying that the vast majority of people in the world have never heard of Ethereum, DeFi, or virtual wallets). Imagine this user visits our site upon learning from a friend about this thing called Ethereum and hearing that there’s an application called Yearn that is like Vanguard or Wealthfront but way better (for reasons that we all understand, but that person does not yet). That user visits our site to learn why it’s better and to hopefully set up an account. He does not know that there is no such thing as having an “account” in this platform. In my opinion (and in my own personal experience in showing this stuff to family and friends on their own personal computers), that user does not want to immediately see an interface that look as if he has already signed into an account yet cannot see half the content because the site needs him to “Connect Wallet”–something that he doesn’t even know is a thing. He wants to see an interface that feels familiar to him. He has interacted with trad-fi applications for the past decade and has online accounts with banks and investment platforms–all of which required that he set up a username and password to use. That person is expecting to learn about our services and then hit a “Sign Up” button.
The “Launch App” button is the equivalent of the “Sign Up” button, and upon clicking it should immediately prompt the user to “Connect Wallet” and provide links to Metamask’s site, etc., as we should assume that many people visiting our site for the first time do not have a wallet, nor understand what it is.
In time, I think this can and should go away, but not until the vast majority of internet users know what DeFi and virtual wallets are and have already used both in the past.
Any updates and/or need for more community input regarding new UI design and/or branding? I’d love to get more intimately involved in this, but I also don’t want to reinvent the wheel, as it’s been implied that there has been a decent amount of headway made already. It’s difficult to help out when there’s such little communication (this thread and others related to UI and UX have been fairly dormant), and there doesn’t seem to be much substance on this subject in Discord, Telegram, or elsewhere. I know that @tracheopteryx and @FutureFund, among others, have been leading the way with this. Can we get some updates on progress on here so that we can get back to collaborating?
Most of the work I am aware of is happening in a telegram group, I’ll dm you.
The info from this thread and others is super valuable and gets integrated into the work. The info exchange and comms are not as good as they could be. It’s a lot easier to work in smaller groups, but then they feel private, and it’s hard to sync info, and I wish I knew a better way to do it.
Currently @FutureFund is finishing up the design and @x48 is doing the dev. Hope is to have a site up this month.