Skip to main content

The CrowdloanFET Project

  • Team Name: Mutai Solutions
  • Payment Address: 0xE27F2E8321Fb4c32525a4ED86d2902dbA63491E4 Ethereum (USDT)
  • Level: 1
  • Status: Terminated

Project Overview 📄​

This application is response to the Crowdloan Front End Template RFP

The CrowdloanFET project is a free and opensource white-label solution for Polkadot projects to showcase the Crowdloan to prospective and current project supporters and community members.

Built using Nextjs, Tailwind and Polkadotjs, projects can easily configure/modify and deploy a frontend for their crowdloan campaign, either on their own infrastructure that supports node or on affordable/free platforms like Vercel.

The template will come with an unopinionated style and will provide the appropriate information architecture for different projects to add on top of and apply their own brand assets.

Project Details​

Technology stack overview:​

  • Framework: Next.js, built using Typescript
  • Styling and branding config: Tailwind
  • Wallet/on-chain data & network interactions: Polkadotjs

Configuration:​

To make the template generic & simple to configure, we shall use 3 main points of modifation:

  • Markdown Files - To populate the project copy thorough various sections of the template
  • .ENV configuration file - To configure various settings that may be required for querying data on-chain and various other uses around the template. A few config variables to include would be: PARA_ID, HOMEPAGE_LINK, DISCORD_INVITE_LINK, TWITTER_ACCOUNT_USERNAME, BLOG_LINK, etc
  • Tailwind.config.js - To configure key branding aspects. e.g Colours, Font, etc

These as well as further configuration steps shall be outlined the accompanying documentation and tutorial article.

Mockups:​

Project Overview/Description Section​

Wireframe

image.png

Example Mockup

image.png

Crowdloan details & timeline Section​

Wireframe

image.png

Example Mockup

image.png

Crowdloan Rewards Section:​

Wireframe

image.png

Example Mockup

image.png

Crowdloan Contributions Section:​

Wireframe

image.png

Example Mockup

image.png

Competing crowdloans Section:​

Example Mockup

image.png

FAQ Section:​

Example Mockup

image.png

Ecosystem Fit​

As outlined above in the Project Overview, this project is targeted toward project maintainers and their respective communities/contributors that are undertaking a crowdloan campaign. This ideally would help with eliviating some of the workload on the project maintainers while also providing conclusive visibility of a crowdloan to the wider Polkadot ecosystem at large and an easy approach to contributing to it.

Similar implementations/projects:

Team 👥​

Team members​

  • Bryan Mutai : Full-Stack developer and web designer

Contact​

  • Registered Address: 90 JGO, James Gichuru Road, Lavington, Nairobi, Kenya - P.O.Box 1669-00100 Nairobi GPO
  • Registered Legal Entity: Mutai Solutions

Team's experience​

I studied software engineering at the University of Glasgow, I currently have 5 years experience in web design & development and have been working as a freelance web developer, working in various programming languages (Typescript/Python) and in various frameworks and libraries (React/Angularjs/Django). Over the past 2 years I have also been contributing towards various blockchain related opensource projects. Recently in particular:

Team LinkedIn Profiles​

Development Roadmap 🔩​

Overview​

  • Total Estimated Duration: 1 Month
  • Full-Time Equivalent (FTE): 1
  • Total Costs: 5,600 USD

Milestone 1​

  • Estimated duration: 1 month
  • FTE: 1
  • Costs: 5,600 USD
NumberDeliverableSpecification
0a.LicenseApache 2.0
0b.DocumentationWe will provide both inline documentation of the code and a basic tutorial that explains how a user can deploy an instance of the template for their project
0c.Testing and Testing GuideCore functions will be fully covered by comprehensive unit tests to ensure functionality and robustness. In the guide, we will describe how to run these tests.
0d.DockerWe will provide a Dockerfile(s) that can be used to test all the functionality delivered with this milestone.
0e.ArticleWe will publish an article that explains the core functionality of the template and intended use as well as a step by step tutorial targeted towards developers on how to configure, modify & deploy the template on a popular hosting platform like Vercel
1.Template User interface implementationI will design and implement the template UI using Tailwind in the Nextjs framework. The user interface will include: Project information, rewards schema, current contributions, time left in the crowdloan and information on the contribtions made after the crowdloan ends as shown simulated in the mockups above
2.Contribution form & interactionA simple interface for users to contribute directly through the deployed template through the entire cycle contribution, handling both a finalised contribution as well as any encountered errors
3.Example User interfaceUsing the output from 1 & 2 I will create a sample crowdloan deployment that would be the result of implementing the Front End template following the steps outlined in the output from 0d.

Future Plans​

  • Core maintainance of project, such as critical bugs and security updates
  • Implementing/merging community suggestions/Pull Requests on features that could help improve the experience of both deploying and using the template.
  • Collecting feedback from projects that consider/use this template.

Additional Information ➕​

How did you hear about the Grants Program? Web3 Foundation Website