New Bounties.Network Website

[mbeylin]

Description

We need to build a new version of the Bounties Network landing page!

Here is a picture of the design itself:
Desktop:

Mobile:

Here is a zip folder of the various SVG files found in the design:

website bounty.zip

This new site should follow the attached design as closely as possible, and should include a number of unique elements:

• should use a carousel component for the logos and media pictured at the bottom
• should use this https://codepen.io/corwinharrell/pen/MBqjpm as a guide for styling the buttons present in the 'building blocks' section
• should use the same Google Analytics + MailChimp tags which are present in the current bounties.network site
• use the typeface “Poppins” from Google Fonts for headings
• Use the typeface “Inter UI” for body copy.
• Font-sizes can be approximate, but should be consistent throughout. We will make adjustments to typography after the bounty is completed.
• the embedded video should be a youtube video (feel free to choose any video you'd like for the preliminary version since our final video isn't on youtube yet)
• for the header background image (the hexagons), just use the same picture as before, and position it as best as you can

Requirements

A correct submission for this bounty will:

• BE RESPONSIVE : it should either follow the above design to the letter, or should adjust the visual components to react to changes in screen sizes (i.e. mobile responsive)
• Use flexbox grid (fleboxgrid.com) to organize the visual components in a way that appropriately responds to changes in content or screen resolution

Revisions

We will require at most 4 revisions for submitted work, and expect whoever completes this bounty to come to us with intermediate questions (especially regarding mobile responsiveness) rather than making assumptions on one's own.

[gitcoinbot]

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

---

This issue now has a funding of 0.82 ETH (299.8 USD @ $365.62/ETH) attached to it.

• If you would like to work on this issue you can 'start work' on the Gitcoin Issue Details page.
• Want to chip in? Add your own contribution here.
• Questions? Checkout Gitcoin Help or the Gitcoin Slack
• $23,701.25 more funded OSS Work available on the Gitcoin Issue Explorer

[tosho]

Is http://flexboxgrid.com/ mandatory? Can we use another CSS framework (like Bulma) or plain CSS Grid?

[octavioamu]

Hi!
I have some questions

• There is the original file? It was made in sketch? In the zip is only a png
• How the menu behaves? Is an sticky menu on scroll? And in responsive view?
• Current site use mailchimp for the subscription, Are you planning to continue using it?
  Thanks

[tcrowe]

Hey guys good luck to whoever is awarded the bounty. You can use this to get started fast using gulp, flexboxgrid, and a test server. It works! https://github.com/tcrowe/bounties.network

[iamonuwa]

@mbeylin please what's the criteria for rejecting hunters? Or is this task not ready to be worked on?

[mbeylin]

Apologies to those who were applying to do this: my intention was to accept @tcrowe for this bounty, but some issues on Gitcoin were prohibiting me from doing that. When the site is working I will accept Tony but in the meantime, @tcrowe please feel free to begin working on this.

Regarding the questions:

• menu bar should be fixed at the top (and continue to be shown as we scroll down)
• I can get you the original file (more than a PNG)
• yes, please use the same mail chimp code(s) from the current site

[mbeylin]

@tcrowe the file was made on Figma, so we can share the design with you on that site if you're interested in seeing any of the details of its implementation.

[tcrowe]

Np @mbeylin

Static sites are the most fun! I'm a contributor on https://hexo.io static site generator but as this was only one page I used a simpler tool set.

[mbeylin]

Here's a link to see the design: https://www.figma.com/file/a6x2BkAyST5KJzmvQzSqRcem/Bounties.network-Landing-Page?node-id=0%3A1

[tcrowe]

@corwinharrell Hey that was me checking out the design 👋 😆

[heycorwin]

@tcrowe haha oh I thought it was Mark! Let me know if you have any questions about Figma. You should be able to inspect element properties to some degree (It's been a while since I've been inside a Figma file as a viewer and not the owner.)

[tcrowe]

I thought what you guys provided in the initial write-up was great but the Figma project is icing on the cake. Thanks @mbeylin @corwinharrell 👍🏼