Update the website

[rw1nkler]

This commit updates the current SymbiFlow website. It provides the following changes:

• Main webpage:
  • An updated bitstream documentation status table (with information about the QuickLogic).
  • Updated information about the supported boards.
  • A new layout of the supported boards section.
  • The "Project aims" section renamed to "Why SymbiFlow?". The new section informs about the advantages of the FOSS FPGA flow.
  • New icons in "Why SymbiFlow?" section.
  • An updated section about the SymbiFlow ecosystem (with information about the QuickLogic).
  • A new section with supported chips, which replaced a detailed description of the bitstream documentation projects.
  • New talks added to the talks section.
  • A carousel displaying the talks.
  • A lightbox script for displaying talks directly from the website.
  • A Twitter integration widget with the latest SymbiFlow tweets.
  • A GitHub integration widget with information about the latest activity.
  • Information about the bitstream documentation projects and help wanted section has been moved to the subpage "For Developers".
  • Updated text on the webpage.
  • Changes in the layout of the webpage.
  • An updated year.
• "Getting Started" webpage:
  • Contains information about the introductory SymbiFlow tutorials.
• "For Developers" webpage:
  • Contains general information about the SymbiFlow toolchain and provides the links to the most important SymbiFlow projects.
  • Contains the "Help wanted" section with information about used technologies and communication channels.

The new changes were inspired by the issues available in this repository. This PR resolves:

• Resolves https://github.com/SymbiFlow/symbiflow-website/issues/37
• Resolves https://github.com/SymbiFlow/symbiflow-website/issues/36
• Resolves https://github.com/SymbiFlow/symbiflow-website/issues/33
• Resolves https://github.com/SymbiFlow/symbiflow-website/issues/7

[mithro]

Can you upload the preview for me to review?

[rw1nkler]

All the generated files are available in the symbiflow-scratch bucket that you created for me @mithro

[mithro]

Please put a link here in this pull request.

[rw1nkler]

• https://console.cloud.google.com/storage/browser/symbiflow-scratch
• gs://symbiflow-scratch
• https://storage.googleapis.com/symbiflow-scratch/

Google Cloud Platform

Google Cloud Platform lets you build, deploy, and scale applications, websites, and services on the same infrastructure as Google.

[mithro]

The For Developers header is a bit confusing;

• Is it for developers who want to develop the symbiflow tools?
• Is it for developers who want to use symbiflow?

[mithro]

Rework the following paragraph to be positive only;

SymbiFlow aims to optimise and automate FPGA development workflows and to push FPGAs towards more widespread adoption, bypassing the uninviting, closed, vendor-specific ecosystem.

[mithro]

Each of the cells in the table should be links.

• Free & Open Source
• Multi-platform
• Vendor-neutral
• Interchangeable tool suite
• Growing community
• Look inside and improve

[mithro]

Current status table should have links.

[mithro]

The tutorial's section seems a bit weird as a bunch of the links are not tutorials.

[mithro]

I think we want a Contact / Get Help link at the top with the Getting Started / Developers links?

[mithro]

This is already a pretty big improvement on the current website, so if things are not an easy fix we can convert my suggestions to GitHub issues and then merge this pull request and follow up with more pull requests.

I think the order of the contents in the new website isn't quite right.

I would like to see the order to be something like;

1. call to action text
2. news / updates / what has changed recently
3. pretty pictures / diagrams / etc
4. More detailed background information

Sections 1 and 2 should appear "above the fold" at normal computer resolutions.

I think there should be two call to actions in the first section (feel free to rework the exact words - these are just the "jists" that I would be after);

• "Getting started" -- A call to action around getting started as a user of the toolchain.
• "Help contribute" -- A call to action around helping the symbiflow project.

I wonder if there should be a rotating picture of potential development boards / screenshots above (or maybe even behind) the "getting started" call to action?

[mgielda]

Yes, I would be all for including the remarks that are simple to fix and merging this one, and then treating the other topics separately, as some of those are a little philosophical and might need some discussion etc.

When you say the features should be links, can you suggest where we should be linking to? I have some ideas but not for all the icons. But generally speaking it's a nice idea.

[mgielda]

Sorry, missed Tim's suggestion for the other section. Then we should have "Get started" and "Help contribute" for consistency. Alternative suggestion (from me) - "Getting started" and "Contributing to SymbiFlow". @mithro ?

[mithro]

Get Started! and Help Contribute seem pretty good?

Maybe Start using! and Help Contribute?

[mithro]

Or Start using!, Getting help and Contribute now!?

[rw1nkler]

I have changed:

• Getting Started title to Start using
• For developers title to Contribute now
• Tutorials title (in Start using) to Resources

I've also switched the detailed description with the talks section. The rest of the changes will be provided in next PRs. Can we merge it now? @mithro

The current preview is available in the bucket: https://storage.googleapis.com/symbiflow-scratch/index.html

[mithro]

@rw1nkler We can merge as soon as you have responded to each of the comments with a link to the new github issue tracking what hasn't been finished in this pull request.

[mithro]

@rw1nkler BTW You can create directories and stuff in the symbiflow-scratch bucket. I suggest using something like gs://symbiflow-scratch/rw1nkler/symbiflow-website/<git describe output> so you can upload multiple versions for to compare. I can't actually remember what the first version looked like when compared to your new version so I can't check you have actually made the changes I was thinking you should :-P

[rw1nkler]

1.

The For Developers header is a bit confusing;

* Is it for developers who want to develop the symbiflow tools?

* Is it for developers who want to use symbiflow?

The section has been renamed to Contribute now

2.

Rework the following paragraph to be positive only;

SymbiFlow aims to optimise and automate FPGA development workflows and to push FPGAs towards more widespread adoption, bypassing the uninviting, closed, vendor-specific ecosystem.

Done

3.

Each of the cells in the table should be links.

* Free & Open Source

* Multi-platform

* Vendor-neutral

* Interchangeable tool suite

* Growing community

* Look inside and improve

I've created a dedicated issue for this (https://github.com/SymbiFlow/symbiflow-website/issues/42)

4.

Current status table should have links.

Done

5.

The tutorial's section seems a bit weird as a bunch of the links are not tutorials.

The section has been renamed to Resources

6.

Contact / Get Help link at the top with the Getting Started / Developers links?

I've created a dedicated issue for this (https://github.com/SymbiFlow/symbiflow-website/issues/44)

7.

This is already a pretty big improvement on the current website, so if things are not an easy fix we can convert my suggestions to GitHub issues and then merge this pull request and follow up with more pull requests.

I think the order of the contents in the new website isn't quite right.

I would like to see the order to be something like;

1. call to action text

2. news / updates / what has changed recently

3. pretty pictures / diagrams / etc

4. More detailed background information

Sections 1 and 2 should appear "above the fold" at normal computer resolutions.

I think there should be two call to actions in the first section (feel free to rework the exact words - these are just the "jists" that I would be after);

* "Getting started" -- A call to action around getting started as a user of the toolchain.

* "Help contribute" -- A call to action around helping the symbiflow project.

I wonder if there should be a rotating picture of potential development boards / screenshots above (or maybe even behind) the "getting started" call to action?

I've created a dedicated issue for this (https://github.com/SymbiFlow/symbiflow-website/issues/43)

[rw1nkler]

@mithro, I've uploaded the website files to the bucket

Previous version:

• gs://symbiflow-scratch/rw1nkler/symbiflow-website/e563859

Current version:

• gs://symbiflow-scratch/rw1nkler/symbiflow-website/da4f31b

[mithro]

@rw1nkler - Can you make those links?

[rw1nkler]

• Previous version
• Current version

[mithro]

Okay, I'm going to merge this now and we can work on further improvements shortly.