Scope

• We display the asset's past rank beside the current rank
  
• But for users it's unclear how this score is calculated and what time difference is taken

Scope

• Old design by Scott

• Right now, rugpullindex doesn't have a profile page for an asset as e.g. coingecko or coinmarketcap has them e.g. https://www.coingecko.com/en/coins/ocean-protocol
• But we often get requests that our assets should have a page with more detailed information, and I also think that the mental model to understand our product offering would be better did we have a detailed view.
• • Given our latest understanding of the product, how should an data asset profile page look like. What is the information that our users are craving for?

Deliverable

• This task is primarily for a dev + a designer; We want to have a visual design
• and then additionally, we want to implement this design here as a CSS mockup that can later be hydrated using the RPI backend data

time estimate

• beyond 4h

Scope

• Currently, OCEAN data sets get a pink link and BDP data sets get a green one
• Many users have complained already that this type of mapping isn't understandable without lots of context

Scope

• in #22 we added a pseudo-element for all links that have target="_blank" set.
• Upon further consideration, they look cool e.g. in the page's footer.
• But they look confusing in e.g. the main page's table

• @florianmodel thoughts?

Deliverables

• Remove pseudoelement for main page table

Time estimate

• 1h

Scope

• Screenshot
  
• On the website: rugpullindex.com, we want to funnel users to our Discord. But if the link on mobile devices doesn't work we may funnel fewer projects as a significant number of users visit our site on mobile

Deliverables

Adjust CSS/HTML copy such that the Discord logo is shown then toggling open the navigation bar

Time estimate

1h or if it's something really tricky 2h

getting paid

https://github.com/rugpullindex/documents/blob/master/handbook.md#how-to-get-an-offer-approved-to-start-working-on-rpi

Currently, there is no index.html in the repo. It makes difficult proposing changes to the html structure. Before, there was index.html but it was so huge that editing it was a little difficult. I propose that we add the template file (.ejs) to the repo. We can provide the template file with mock data stored in json files.

Deliverables

• Add all index.ejs and all its required templates such as head, nav, footer etc.
• Add mock data in json files
• Use express to render the template

Time Estimate

2 hrs

Scope

The tooltip is not visible if the page is wider than about 1000px (Firefox/Chrome on Win):

Deliverable

• Understand why this is happening
• Submit fix as PR

Time estimate

• 1h

Context

• we use the "Garamond" font face
• on Mac OS where Garamond is included as a font by default, the website looks like this:

where as on Windows 10/11, the Garamond font face doesn't seem to be embedded by default

Deliverables

• Find websafe font that can be used instead of Garamond when its not available
• Implement backup font in design.css

Time estimate

• 1-2h

Scope

• For our users, we want to indicate which links lead to external pages and which links lead to internal pages
• For that, many sites add this symbol "↗" as an indicator to a link
• Using CSS, we can target all <a> tags that have the attribute target="_blank" and add a pseudoelement ::after

Deliverables

• Add the ::after pseudoelement for any type of link leading to external sites and send a PR

Time estimate

• 1h

Scope

• A goal of RPI is to start a newsletter. We're gonna use https://buttondown.email/
• For that, we'll have to have some UI component that matches the rugpullindex.com design language
• It's the second time that I've built a newsletter component. The first one can still be seen over at: https://doctoverse.com/
• I think we want to go for a similar arrangement of visual components

Deliverables

• Using classless.de definition and potentially custom CSS, come up with a newsletter UI element that we can embed on e.g. our front page
• Integrating with buttondown.email isn't a requirement. I can do that later
• Component should work well on mobile, tablets and desktop. The input element should be designed such that there's enough space for a user to hit the clicks
• A "success" animation isn't required as we'll redirect to a sub-page of buttondown.email

time estimate

• 2-4h

Scope

• Similar as outlined in #12, the "Equality" factor in the rugpullindex table is really just a value ranging between 0 and 1
• Meaning, it too, could be displayed as a color-coded binary spectrum to make users understand its definition space
• We even had a user give us input into how it should look, see below

Deliverables

• Create a CSS class that, based on the value as a data-... attribute shows a certain color coded range (see example above)
• Make this work within the current <table> setup

time estimate

• 1-2h

Scope

• Today, on rugpullindex.com the "Rating" is communicated as a number e.g. "6.78%".
• But implicitly, in the algorithm, that number can never go higher than 100% and never lower than 0%. So there's a chance that we can make this information apparent to a random user too by e.g. showing the number as a range instead of just a number
• We could even color code the range by saying that e.g. "higher = better"
• You can see a similar concept on CoinMarketCap where e.g. the 24h price is shown on a binary spectrum

Deliverables

• Using CSS, design a range element. It should take the rating value and generate a color coded range element.
• Make sure that this approach works both on mobile and desktop and that it works without changing any of the table set up

Time estimate

• 2-4h

Scope

• Rating agencies like Moody's don't evaluate assets by e.g. percentages or real numbers
• They give our ratings like "AAA", etc.

Deliverable

• Understand if we can benefit from giving our a higher level ranking too
• If e.g. users would further understand the concept behind our website, that'd be beneficiary to our project
• But what are the downsides of this approach? Could e.g. giving a rating like "AAA" also simplify things too much?

Note

For now this issue is a bit open-ended and I'm not sure if it's directly actionable.

Scope

• Right now, when a contributor wants to change the RPI design, they have to download this repo and then launch the python server as is outlined in the readme
• However, the real index.html file used to render rugpullindex.com resides in the closed source RPI backend repository
• Until the RPI backend is still closed source, we'd like to make it easier to debug the design system as efficiently as possible
• But having two distinct index.html files that have a risk of diverging, isn't good

Deliverables

• Create a process that requests rugpullindex.com's index side, but then replaces the rugpullindex.com design.css file with the design-system repo's latest and local .css file
• Then, serve this content to a developer e.g. running npm run dev

Time estimate

• It should be relatively straightforward: Create an fastify/express server that downloads rugpullindex.com source code (and maybe caches it)
• Replace DOM node <style> with the local design file
• Server content to the developer via localhost:5000
  -2-3h

Scope

• The RPI backend includes the design-system repository directly as a public folder through a git submodule
• If we were to pull the latest change from design-system into the RPI backend, then we'd also be hosting code that is not intended to be exposed to a public hosted folder

Deliverables

• For all files that are used to simulate the developer environment, somehow isolate them into their own directory and then also separate all files that shall be publicly exposed.
• Ideally, in the end we have two folders:
  • scripts that contains the files to simulate the dev env
  • public that is a set of files to be exposed on rugpullindex.com

Time estimate

• 1h

Scope

• index.js currently uses the .js extension, but to future proof it we want to use .mjs and convert all imports to esm-based ones
• Additionally, control-flow logic, e.g. "async/await", "promises" and "callbacks" are currently mixed in index.js. But we want to consistently use "async/await"

Deliverables

• Use "fs/promises" and don't use callbacks or ...Sync methods of fs
• Use "async/await" everywhere

Note

For anything express related, using their standard callback logic is fine e.g. app.get(...,...)

Scope

• See that e.g. OCEAN data sets, we color pink
• Big data protocol data sets, we color green.

• From our UX designer, we got the following feedback:

Deliverable

• Make information on where the data set was published available in a different way but color-coding the data asset in the table
• Options can be:
  • show the marketplace's icon next to the link
  • show text "ocean protocol" somewhere
  • Add a tag label

Time estimate

• Discussion here on GitHub is included in the total working time
• A simple proposal can take up to 4 hours of time.

Scope

• test.html isn't useful anymore, we now use the script in index.js for retrieving the HTML part

deliverables

• remove test.html

time estimate

this task is too small for any payment.