Build Redesigned Landing Page

[lpatmo]

Revamp current landing page to

For specs, the page is split into halves - the first six columns for a wide display are for the main content, and the second six columns are for the carousel displaying a series of MatchCards components. The carousel would have to be built. For an idea of how the carousel should work, see this comment.

Other details:

• The main primary colors use #277FE3 (primary buttons, h1 elements, a tags; not shown in this design sketch, but navigation links should also follow the same pattern: #277FE3 for link color and #386496 for hover color).
• The h2 tag and other body text color uses #386496.
• Lean in on React-Bootstrap components before making your own.

For additional reference, this is the Bootstrap theme were currently using - https://bootswatch.com/cosmo/

[lpatmo]

One thought: Maybe we can still put the testimonials somewhere on the landing page, if a user scrolls down? Or on its own page.

[sebbel]

it is unclear to me how more than 2 items look on the frontpage :(

[angelocordon]

Great point @sebbel - I think the purpose of that was buried in the discord convos.

The idea here is that it's a carousel of sample MatchCards (or it could potentially live cards), and that it's a timed function where each card is visible for x amount of seconds, then scrolls to the left. This idea was lifted from Uber's rebranding case study - https://www.uber.design/case-studies/rebrand-2018#section-8

If you scroll down to the Art Direction section, check out how they do their carousel.

[angelocordon]

Re: testimonials -- I'm not sure where it's valuable to have them yet; we should save them and collect them, but I'm not 100% positive it's adding anything to the landing page. Although, it might also make sense to have FAQ, and How it Works as sections in the landing page instead of a separate page on their own, and have testimonials at the bottom; there's definitely room for iterative progress here.

[angelocordon]

Thanks @Dan-Y-Ko !