[BEAM-14312] [Website] Home Page Improvements - Reorder Sections

• Type: Improvement
• Status: Resolved
• Priority: P3
• Resolution: Fixed
• Fix Version/s: Not applicable
• Component/s: website
• Labels: website
• Assignee: Bulat Safiullin
• Reporter: Daria Bezkorovaina
• Created: 15/Apr/22 04:40
• Updated: 12/May/22 20:48
• Resolved: 10/May/22 06:53

Description

Create a PR with reordered sections of the Home page and changed footer (need to have staging version for comparison). Keep it as draft for review. 

1) Change order of the sections: 

Current UX flow of the page sections: How does it work? (graph) -> You Choose Your Favorite Environment and Programming Language! -> Apache Beam Features -> Check out our social media -> Try Beam Playground ->  Apache Beam Runs in These Environments -> Case Studies Powered by Apache Beam -> Stay Up To Date with Beam

Proposed UX flow of the page sections: How does it work? (graph)> Apache Beam Features > You Choose Your Favorite Environment and Programming Language! -> Apache Beam Runs in These Environments -> Try Beam Playground -> Case Studies Powered by Apache Beam -> Stay Up To Date with Beam 

*removed "Check out our social media" section from the main flow. 

2) Move GitHub, Twitter, Youtube buttons to the page footer (area on the right highlighted with red) and arrange them vertically, add LinkedIn button, link to https://www.linkedin.com/company/apache-beam/ : 

 

3)

3.1 Remove the section "You Choose Your Environment and Programming language. 

3.2.  Change title of the section "Apache Beam runs in these environments" to "Write Once, Run Anywhere" 
Link each logo to the respective documentation: 

Flink -> http://apache-beam-website-pull-requests.storage.googleapis.com/17408/documentation/runners/flink/index.html 

Samza -> https://beam.apache.org/documentation/runners/samza/ 

Spark -> https://beam.apache.org/documentation/runners/spark/ 

Dataflow -> https://beam.apache.org/documentation/runners/dataflow/ 

Twister -> https://beam.apache.org/documentation/runners/twister2/ 

Amazon Kinesis Data Analytics
Logo: https://images.app.goo.gl/zrd5ccwg2SoDB2R99 
Link: https://docs.aws.amazon.com/kinesisanalytics/latest/java/examples-beam.html 

 

3.3. Add new section below: "Create Multi-language Pipelines"

Add logos and link to documentation:
Java - > http://apache-beam-website-pull-requests.storage.googleapis.com/17388/documentation/sdks/java/index.html 

Python -> http://apache-beam-website-pull-requests.storage.googleapis.com/17388/documentation/sdks/python/index.html 

Go -> http://apache-beam-website-pull-requests.storage.googleapis.com/17388/documentation/sdks/go/index.html 

SQL -> http://apache-beam-website-pull-requests.storage.googleapis.com/17388/documentation/dsls/sql/overview/index.html 

The final result should look like below: 

 

 

4. Replace the "How Does It Work?" Graph with the updated design: 

 

 

 

Issue Links

• links to: GitHub Pull Request #17408