degen-vc / scarcity

d20srd reference implementation codified in solidity
4 stars 3 forks source link

UI design for Scarcity Gameverse Launch Party page. Figma #27

Open fraserbrownirl opened 2 years ago

fraserbrownirl commented 2 years ago

Note: This is NOT a UI code task. It is a UI DESIGN task and the deliverable should be a figma project or file.

Network: Polygon Test instance staged here: https://analytics.scarcity.game/town/bank

The above deployment of Scarcity is not using the current live game smart contracts and is only for testing/development purposes. So obviously, when you mint an Adventurer from this instance, although it is on Polygon mainnet, it will only be on this test version, and the wrapped gold you use to buy Costumes is also not the live game gold used on https://scarcity.game. Also, the $SGV farmed is NOT the games actual governance token.

NOTE: we will send you some wrapped gold so you can see of the current UI works once approved. SEND YOUR ADDRESS TO RECEIVE IT.

About Degen.vc. Degen.vc was a Gitcoin top 3 ranked org during is hackathon last year and regularly funds and pays out bounties. We enjoy continued collaborations from my devs that were started on Gitcoin and we look forward to working on web3 with you!

Task

On this page you will see a character with some text to his right. Task specifics:

  1. The task is to provide a design for everything BELOW this. This is NOT a UI code task. It is a UI design task.
  2. Do NOT redesign the whole page or change the site look and feel.
  3. This task is for one element on this page in order words. It is the Launch Party UX.

User journey

Users are told that they need to have a special costume to attend the launch party. The reason why the will want to attend is to receive $SGV tokens. These governance tokens are farmed autonomously by Adventurers as soon as they have a costume assign/attached. The costumes are randomly minted as one of the 11 Adventurer classes. So, for example, if you own a Paladin and mint one costume you might not receive a Paladin costume. We want users to mint x number of costumes first. If they have the matching Adventurer they can immediately connect the costume to it. If they do not, they have two choices 1. they could put that costume up for sale on opensea or 2. they could mint an Adventurer to dress with that costume.

User information

The users need to know three things. This information needs to be effectively displayed (currently the page only refers to one thing "YOU NEED A COSTUME TO GO TO THE LAUNCH PARTY!":

  1. To attend the launch party must wear a costume!
  2. As soon as you don a costume you are in and start farming $SGV
  3. Rogues earn 20% of all farmed $SGV in a deal struck with the tavern keeper so that they keep the peace!

There should be a Learn more button which we will point to a help article or doc. As well as a Mint button we need an Approve WSGOLD button

Farming consol

We have coded typical farming information: TOTAL TOKENS AVAILABLE 99999456.11 $SGV
MY TOKENS 0 $SGV
YIELD PER DAY 0 $SGV
ROUGES YIELD PER DAY 0 $SGV
PENDING 0 $SGV CLAIM

We guess this is best presented in a separate box or place on the page so that users understand what it is. It is separate functionality per se to the process of minting costumes and attaching them to Adventurers although this is what is needed in order to start the farming process.

Communicating with our team

There are three ways you can connect with us. And we welcome you reaching out at any time with any question: Telegram - join our channel and ask to DM one of the admins Twitter DM Discord Gitcoin channel. Preferred

Note we will send you some gold so that you can see how Mint works for new costumes. This is important so that you can see the costumes layout as it exists now. It will be impossible for you do do the job unless you mint some costumes and understand this.

Deliverable

Figma project or file. Bounty 500 USD

gitcoinbot commented 2 years ago

Issue Status: 1. Open 2. Started 3. Submitted 4. Done


This issue now has a funding of 0.15 ETH (561.97 USD @ $3746.47/ETH) attached to it.

gitcoinbot commented 2 years ago

Issue Status: 1. Open 2. Started 3. Submitted 4. Done


Work has been started.

These users each claimed they can complete the work by 264 years, 4 months from now. Please review their action plans below:

1) yadav-aman has been approved to start work.

I'd like to create a Figma design for this feature. After receiving funds, I'll do the following: 1 - Mint some costumes 2 - Using Figma, create various iterations of the game's user interface and gather feedback from the team to improve it. I'll make sure that the vital information included in the proposal is incorporated in the UI so that players can easily understand this gacha-style system. 2) developerfred has applied to start work _(Funders only: approve worker | reject worker)_.

I would love to create the figma design for this project, I have experience in UI construction and development

Greetings. I would love to create this design and work with you. Well, as I think, my plan is: discover, research, drawing and develop your interfaces, using my experience and knowledge about amazing things on Figma! 4) ayush-0801 has been approved to start work.

The steps I would take to complete this task would entail:

I am a proficient UI/UX designer and have worked for several startups. Currently, involved in a Web3 & Metaverse gaming startup as well, and responsible for its UI/UX. Would love to work on this project as well. 5) vickersds has been approved to start work.

Sr. UI/UX Designer interested in helping out with this project. Will need to see a little bit more of how the wrapped gold and the current UI functions to get a better idea of a suitable user workflow. I can provide an initial concept iteration mockup showing a path through the screens, once approved we can move to full UI design iteration. 6) osedma has been approved to start work.

Hi, I'm a Lead Product Designer in Australia for a software development ASX listed company, so...i know a few things about design ;)

My Plan:

  1. I assume the "Launch Party" is a one time event, right?
    • therefore acquiring a costume should be located in a easy to reach or do not miss place in the page.
  2. The user journey is pretty good, I'd first mock up a wireframe based on the user journey you have, I'd share a clickable prototype with the team for feedback, and iterate
  3. The 'farming consol' I'd keep it separate in a different box as you said, basically because this is not the main task for the user, rather supporting information for the user. It's like: Okay, this is great to know, but i want to get a costume. Also, I'd add tooltips to all of these terms to make sure the user knows what "rougues yield per day" actually means. These terms are highly complex for newbies or users just getting started. I'll try to keep it human readable :)

I'm used to work on Agile environments, and I usually work with dev team based on Ukraine, UK and my local dev teams in AU. My mantra is fail fast, so I'd keep designs light to start with, share with the team, get feedback, iterate, share....rinse and repeat, until we have an easy-to-use product.

Cheers! 7) kelvinpraises has been approved to start work.

Hi, I do love UI works, here are some Figma UI works I've done in the past, hope it's generally loved and I get to work with you guys thanks!!!

A UI work for Lamden blockchain mobile wallet app https://www.figma.com/file/9AjeDTxrLZzIXEoBgT8Jaf/Lamden-Wallet?node-id=0%3A1

A UI smaccounts https://www.figma.com/file/Zh0jwPsBwFRATTdELywI85/MySMAccounts?node-id=0%3A1

UI for a Reef payment API I built for a Gitcoin hackathon I won https://www.reefpay.io https://www.figma.com/file/UsVTs6TZdG6aEUWzoRK1Xu/Reef-Pay?node-id=0%3A1

UI for a anime community (joint work) https://www.figma.com/file/OgVK1fAndjRbpkrE2EYja0/AnimeTeez-Web?node-id=0%3A1

UI concept for a streaming app https://www.figma.com/file/ofzlupKQ4yK4jap2tKxIh7/Happening-now?node-id=1%3A2

you might notice that some of them aren't finished works, thats because I'm a full-stack dev and use Figma to do an outline the what they should kind of look like and finish the rest in code so most of the time I don't waste much energy perfecting the designs, I'm super pumped for this! 8) chiragbadhe has been approved to start work.

we are a team of four talented developers and designers as we have much prior experience in designing. We can provide the best designs for your product. 9) vijaykv123 has applied to start work _(Funders only: approve worker | reject worker)_.

I would Like to create designs on Figma . Its Cool and Interest . I can Help You out 10) puddles91 has applied to start work _(Funders only: approve worker | reject worker)_.

Hey, I'm a Snr. Product Designer based in South Africa working for an international SaaS giant.

My plan is to familiarise myself with the existing UI and flows, then produce wireframes using the provided information. After getting to my preferred UX I'll proceed to skin the wires and potentially create a prototype if necessary. My intentions are to make the design as user friendly and as easy to understand as possible. 11) cosmopolitanka has applied to start work _(Funders only: approve worker | reject worker)_.

Hi,

I am a UI designer with an interactive design master's degree. I have a question for clarification, would you like a prototype for a first-time user of the game (doesn't yet have an Adventurer) or an existing user (has Adventurer/s)? I can create Figma prototype versions for both scenarios.

To preserve the aesthetic of your current design (icons, font, style) I suggest making the process similar to a retro RPG game. The process of getting ready for the party will be divided into steps and present itself as a conversation between the user and the character. Before designing I will experience the process myself to have a better understanding.

With the "Rogues earn 20% of all farmed $SGV" - I suggest this info can be placed as a permanent stamp on the Rogue Adventurers card in the Tavern and any other pages.

Learn more on the Gitcoin Issue Details page.

gitcoinbot commented 2 years ago

Issue Status: 1. Open 2. Started 3. Submitted 4. Done


Work for 0.15 ETH (467.02 USD @ $3113.48/ETH) has been submitted by:

  1. @giorgiothegood
  2. @yadav-aman

@fraserbrownirl please take a look at the submitted work: