Update brigade.sh design #55

flynnduism · 2021-11-22T21:28:31Z

This is brings a brand refresh to the Brigade site. Preview here: https://v2.brigade.sh/

Main changes:

updates logos, colors, fonts, etc
instead of static background images dotted along the site, this adds an expanding pipes animation in the background that unfolds as you scroll the page
removes the need for ruby/jekyll/gems/a lot of npm packages that were way overkill for the site to run. now a lighter stack using parceljs to handle the landing page assets.

Content changes:

One of the biggest challenges for Brigade has always been showing off some of the cool stuff that Brigade can do - I want to try and plug in a few things here to expand on the old copy which has largely sat unchanged since the "we're launching a new thing called Brigade" phase back in 2017.

Added a video overview of Brigade. There's some nice overviews, deep dives and demos of Brigade on YouTube which I think are worth referencing on the site.

Talk about the speed and efficiency of Brigade

I added a short paragraph here trying to talk about what seems like one of the project's key standout features, but we don't really talk about it very much. I think it would be nice to talk about the way Brigade 2 is built to handle large streams of events and works to process jobs very very quickly. But I need some help and input on hopw best to communicate this.

Consolidate links and points of engagement (aka the mega-footer)

This is hopefully a decent start on re-framing the project's value prop and showing the new cool stuff in v2, but I would love some input on how I can better articulate this stuff!

netlify · 2021-11-22T21:28:36Z

✔️ Deploy Preview for v2-brigade ready!

🔨 Explore the source changes: d57f937

🔍 Inspect the deploy log: https://app.netlify.com/sites/v2-brigade/deploys/61df0fdabb2f670008fc22ba

😎 Browse the preview: https://deploy-preview-55--v2-brigade.netlify.app

krancour · 2021-11-22T22:30:26Z

@flynnduism this is amazing. And the background animation is mesmerizing. It's literally fun just to scroll. But it's not fun just for fun's sake -- I feel like that animation really represents what Brigade does. Awesome!

krancour · 2021-11-22T22:58:00Z

A couple notes about content:

The video is pretty old and v1-oriented. I'm recording an on-demand webinar for CNCF tomorrow. That video might be a better one to use here.
There's a mention of events from Trello somewhere on the page. We should probably strike that. While a Trello gateway is 100% possible, we don't have one now, so I'd hate for it to look like a false claim.
The example of "updating a CosmosDB database" might hit harder if it were "updating a MongoDB Database."
The example of "sending a Slack message" actually depicts handling an event from Slack, which I think is better, honestly, but the name of the example probably should be updated.

cc @vdice

flynnduism · 2021-11-23T04:43:49Z

Thanks Kent, I'll update with these edits. I have cleanup and CSS polishing to do during the week, I will update the content according to your points here too.

vdice

This looks so great, @flynnduism ! 👏

Stoked as well on the vastly simplified build approach and slimmed-down dependency tree.

vdice · 2021-11-23T16:31:03Z

index.html

+                  </li>
+                  <li class="slide-trigger">
+                    <label for="img-2" id="img-dot-2">
+                      <img src="assets/images/ex-icon-07.png" /> Update a CosmosDB database


Suggested change

<img src="assets/images/ex-icon-07.png" /> Update a CosmosDB database

<img src="assets/images/ex-icon-07.png" /> Update a MongoDB database

(per #55 (comment))

vdice · 2021-11-23T16:31:20Z

index.html

+                  </li>
+                  <li class="slide-trigger">
+                    <label for="img-3" id="img-dot-3">
+                      <img src="assets/images/ex-icon-05.png" /> Send a Slack message


Suggested change

<img src="assets/images/ex-icon-05.png" /> Send a Slack message

<img src="assets/images/ex-icon-05.png" /> Handle a Slack message event

(per #55 (comment))

vdice · 2021-11-23T16:31:36Z

index.html

+
+            <p>Brigade can be used to chain containers together to build processing pipelines.</p>
+            <ul class="fancy">
+              <li>Watch for incoming requests from services like GitHub, Docker, and Trello</li>


Suggested change

<li>Watch for incoming requests from services like GitHub, Docker, and Trello</li>

<li>Watch for incoming requests from services like GitHub, Docker, and BitBucket</li>

(per #55 (comment))

krancour · 2021-11-25T01:47:17Z

Here's a new YouTube video we can use: https://www.youtube.com/watch?v=EqJ9_k56Q3U

krancour · 2021-12-01T20:54:49Z

Just wanted to check if this is close to mergeable. v2 has gone GA this afternoon.

flynnduism · 2021-12-01T21:00:15Z

@krancour congratulations! I will apply these edits and feedback items today to get this finalized asap!

krancour · 2021-12-01T21:57:39Z

Thanks @flynnduism!

flynnduism · 2021-12-02T19:21:36Z

@krancour @vdice I've updated this PR with the suggested content edits and some minor design cleanups.
Ready for some 👀

CICD Note: the netlify config for the site will not pass this PR, as the command to build the site needs to change for the new (non-jekyll) tooling. You can preview the build properly here https://v2.brigade.sh/

Build command will change from:

gulp && bundle exec jekyll build

to:

yarn parcel index.html

krancour · 2021-12-02T21:07:24Z

@flynnduism this looks great!

I do notice some elements overlapping in ways that I don't think were intended. Example:

And the overlapping is a bit different in different browsers. Ugh. I had hoped the days of browsers rendering sites differently were mostly behind us.

krancour · 2021-12-16T15:39:16Z

@flynnduism just wanted to follow up. Are we close on this?

radu-matei · 2021-12-17T08:36:00Z

Super-nit that can be totally ignored until a later time — it would be great if we had some basic syntax highlighting for the examples on the main page.
(I've been using hljs for a while for my posts and it works well enough for me.)

flynnduism · 2021-12-22T21:24:24Z

@krancour I've pushed layout changes for the various mobile and desktop states, to fix the issue where some of the content panels overlapped each other.

krancour · 2021-12-23T21:31:26Z

A lot of the Netlify checks are failing. I suspect the recent move to CNCF's Netlify account may have something to do with it. I'll volunteer to investigate that.

flynnduism · 2022-01-03T18:39:20Z

@krancour the test fails here are to be expected, as the v1 site checks here are expecting jekyll build to pass - this branch removes Jekyll and uses yarn parcel index.html to build the site instead.

This PR can be tested at a different location (v2.brigade.sh), and if it looks good to ship the Netlify build command can be swapped out for the prod instance of the website.

krancour · 2022-01-06T22:29:57Z

@flynnduism it looks like this needs to be rebased on the v2 branch. There aren't actually any conflicts. I'd do it myself, but I can't push to your branch.

After that, if you also think this is ready, LGTM.

~~I'll straighten out Netlify to deploy the v2 branch to v2.brigade.sh and if all looks good still, we can PR v2 to main and we'll be done.~~

Edit: I did deploy this already to https://v2.brigade.sh for anyone who wants to preview it.

krancour · 2022-01-12T15:59:44Z

@flynnduism, alternatively, I can do the rebase if you check the "Allow edits and access to secrets by maintainers" box on the PR.

Bumps [nokogiri](https://github.com/sparklemotion/nokogiri) from 1.11.4 to 1.12.5. - [Release notes](https://github.com/sparklemotion/nokogiri/releases) - [Changelog](https://github.com/sparklemotion/nokogiri/blob/main/CHANGELOG.md) - [Commits](sparklemotion/nokogiri@v1.11.4...v1.12.5) --- updated-dependencies: - dependency-name: nokogiri dependency-type: indirect ... Signed-off-by: dependabot[bot] <[email protected]>

Signed-off-by: Kent Rancourt <[email protected]>

* for a one page site jekyll is overkill * changes this from a static site to a simple index.html * use parcel.js to handle the scss to css compilation * this removes the need for ruby, bundler, gulp and most packages Signed-off-by: flynnduism <[email protected]>

Signed-off-by: flynnduism <[email protected]>

flynnduism · 2022-01-12T17:46:08Z

Rebase is in @krancour, sorry for the delay. Ready for 👀

vdice reviewed Nov 23, 2021

View reviewed changes

flynnduism force-pushed the v2design branch from 842867b to 30fc279 Compare December 2, 2021 19:15

flynnduism force-pushed the v2design branch from bfdc827 to cffa233 Compare December 22, 2021 19:53

flynnduism assigned krancour and flynnduism Dec 22, 2021

flynnduism mentioned this pull request Dec 22, 2021

Add syntax highlighter to site for code block colors #56

Open

flynnduism force-pushed the v2design branch from cffa233 to 1afaf7a Compare December 23, 2021 18:05

flynnduism changed the base branch from main to v2 December 23, 2021 18:07

flynnduism force-pushed the v2design branch from 1afaf7a to 027bc9b Compare December 23, 2021 18:07

krancour added the needs-rebase label Jan 6, 2022

dependabot bot and others added 3 commits January 12, 2022 09:22

add @brigadecore/www-maintainers as CODEOWNERS

170b0fe

Signed-off-by: Kent Rancourt <[email protected]>

say no to jekyll

0218cb2

* for a one page site jekyll is overkill * changes this from a static site to a simple index.html * use parcel.js to handle the scss to css compilation * this removes the need for ruby, bundler, gulp and most packages Signed-off-by: flynnduism <[email protected]>

flynnduism added 7 commits January 12, 2022 09:22

content cleanup for v2

807831a

Signed-off-by: flynnduism <[email protected]>

add floating content sections

f26681b

Signed-off-by: flynnduism <[email protected]>

cleanups and v2 edits

7ab3c5f

Signed-off-by: flynnduism <[email protected]>

adding mobile cleanups (more to follow)

42ef259

Signed-off-by: flynnduism <[email protected]>

mobile layout cleanup

3853280

Signed-off-by: flynnduism <[email protected]>

used fixed positioning values to avoid overlapping

c5aef13

Signed-off-by: flynnduism <[email protected]>

adjust sticky banner

d57f937

Signed-off-by: flynnduism <[email protected]>

flynnduism force-pushed the v2design branch from 027bc9b to d57f937 Compare January 12, 2022 17:28

krancour approved these changes Jan 12, 2022

View reviewed changes

krancour merged commit d9ccc28 into brigadecore:v2 Jan 12, 2022

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Update brigade.sh design #55

Update brigade.sh design #55

flynnduism commented Nov 22, 2021

netlify bot commented Nov 22, 2021 •

edited

Loading

krancour commented Nov 22, 2021 •

edited

Loading

krancour commented Nov 22, 2021 •

edited

Loading

flynnduism commented Nov 23, 2021 via email •

edited

Loading

vdice left a comment

vdice Nov 23, 2021

vdice Nov 23, 2021

vdice Nov 23, 2021

krancour commented Nov 25, 2021

krancour commented Dec 1, 2021

flynnduism commented Dec 1, 2021

krancour commented Dec 1, 2021

flynnduism commented Dec 2, 2021

krancour commented Dec 2, 2021

krancour commented Dec 16, 2021

radu-matei commented Dec 17, 2021 •

edited

Loading

flynnduism commented Dec 22, 2021 •

edited

Loading

krancour commented Dec 23, 2021 •

edited

Loading

flynnduism commented Jan 3, 2022

krancour commented Jan 6, 2022 •

edited

Loading

krancour commented Jan 12, 2022

flynnduism commented Jan 12, 2022

	<img src="assets/images/ex-icon-07.png" /> Update a CosmosDB database
	<img src="assets/images/ex-icon-07.png" /> Update a MongoDB database

	<img src="assets/images/ex-icon-05.png" /> Send a Slack message
	<img src="assets/images/ex-icon-05.png" /> Handle a Slack message event

	<li>Watch for incoming requests from services like GitHub, Docker, and Trello</li>
	<li>Watch for incoming requests from services like GitHub, Docker, and BitBucket</li>

Update brigade.sh design #55

Update brigade.sh design #55

Conversation

flynnduism commented Nov 22, 2021

Main changes:

Content changes:

netlify bot commented Nov 22, 2021 • edited Loading

krancour commented Nov 22, 2021 • edited Loading

krancour commented Nov 22, 2021 • edited Loading

flynnduism commented Nov 23, 2021 via email • edited Loading

vdice left a comment

Choose a reason for hiding this comment

vdice Nov 23, 2021

Choose a reason for hiding this comment

vdice Nov 23, 2021

Choose a reason for hiding this comment

vdice Nov 23, 2021

Choose a reason for hiding this comment

krancour commented Nov 25, 2021

krancour commented Dec 1, 2021

flynnduism commented Dec 1, 2021

krancour commented Dec 1, 2021

flynnduism commented Dec 2, 2021

krancour commented Dec 2, 2021

krancour commented Dec 16, 2021

radu-matei commented Dec 17, 2021 • edited Loading

flynnduism commented Dec 22, 2021 • edited Loading

krancour commented Dec 23, 2021 • edited Loading

flynnduism commented Jan 3, 2022

krancour commented Jan 6, 2022 • edited Loading

krancour commented Jan 12, 2022

flynnduism commented Jan 12, 2022

netlify bot commented Nov 22, 2021 •

edited

Loading

krancour commented Nov 22, 2021 •

edited

Loading

krancour commented Nov 22, 2021 •

edited

Loading

flynnduism commented Nov 23, 2021 via email •

edited

Loading

radu-matei commented Dec 17, 2021 •

edited

Loading

flynnduism commented Dec 22, 2021 •

edited

Loading

krancour commented Dec 23, 2021 •

edited

Loading

krancour commented Jan 6, 2022 •

edited

Loading