Redesign showcase on splash #922

victorlin · 2024-06-14T22:02:12Z

preview

Description of proposed changes

Adding more information to the showcase ("featured analyses") section.

Links

splash page redesign #849
Slack thread for design discussion

Checklist

~~Check if changes affect the resource index JSON revision~~
Settle on design
Settle on descriptions
Clean up code
Consider adding border color change on hover to mimic behavior of buttons 01bcb3c
- The link underline on hover is a sufficient focus indicator for these cards.
Local: swapping in blab for a group URL shows the blab group logo
Checks pass
Merge base PR Swap splash tiles to use viz screenshots #914
Post-merge: check that the group logos are properly fetched (it's expected to not work on review app)

trvrb · 2024-06-19T23:43:56Z

I really like where this is headed @victorlin (and it seems like most everyone agrees with this). I just made some minor tweaks. I'd be happy for this to go live except the issues with /pathogens, etc... and code clean up.

I think it's your call for whether to:

Just merge this PR into PR Swap splash tiles to use viz screenshots #914 (branch trvrb/semantic-tiles) as this PR is set up in GitHub to do, and then clean up the PR there
Close PR Swap splash tiles to use viz screenshots #914 and swap this PR to merge into master

victorlin · 2024-06-20T17:30:27Z

@trvrb thanks for those tweaks, visually it's looking very polished. One more thing I want to try is border change on hover to mimic behavior of buttons on the same page.

Code is quite messy so I'll clean it up with the aim to keep things visually identical.

Since there are additional screenshot updates in this PR, I'll close #914 and consolidate all the screenshot changes into this PR as a single commit.

trvrb · 2024-06-20T17:56:24Z

Sounds good. Thanks @victorlin!

static-site/src/components/splash/index.jsx

Co-authored-by: Trevor Bedford <trevor@bedford.io>

- Add description and type - Ensure url is specific to match description - Remove "(narrative)" since new design will show type information Co-authored-by: Trevor Bedford <trevor@bedford.io>

Co-authored-by: Trevor Bedford <trevor@bedford.io>

Make each card bigger and display additional information. Static preview: <https://github.com/nextstrain/nextstrain.org/assets/13424970/b04c0f6e-d35c-4502-bd6e-b893e90b66ba> Co-authored-by: Trevor Bedford <trevor@bedford.io>

joverlee521

Thanks for all of the work you've put into the redesign @victorlin 🌈

jameshadfield

Really nice work @victorlin! Only one little bug which needs fixing (isNarrative prop), the rest of my comments can be split out to future work / discussion

jameshadfield · 2024-06-27T03:57:20Z

static-site/src/components/splash/index.jsx

+
+  useEffect(() => {
+    async function getGroupLogo(group) {
+      const response = await fetch(`/charon/getSourceInfo?prefix=/groups/${group}`);


Post-merge: check that the group logos are properly fetched (it's expected to not work on review app)

I've tested this locally with the appropriate IAM user + CONFIG_FILE="env/production/config.json" and it works.

[following is not a request for changes, just discussion]

These requests don't feel right to me. If we used SSR then they could be made (and cached) server-side, but fundamentally it feels like data that should be hardcoded similarly to how showcase.yaml is hardcoded. Maybe it's just fine, I don't know. Anyone else have thoughts?

Hardcoding group logos in the YAML feels off to me. These aren't tracked in version control and can be changed by group owners at any time.

Hardcoding group logos in the YAML feels off to me.

+1. I think the groups logo should be dynamic since we don't have control over them.

static-site/src/components/splash/index.jsx

This removes the need to specify type in the YAML.

trvrb

I really like where this ended up @victorlin. 😀

Ideally the code can be more flexible, but right now things are looking good with the current content. Describe what sort of content is needed to keep things looking good.

victorlin self-assigned this Jun 14, 2024

nextstrain-bot temporarily deployed to nextstrain-s-victorlin--ubqpe8 June 14, 2024 22:02 Inactive

victorlin temporarily deployed to nextstrain-s-victorlin--ubqpe8 June 14, 2024 22:47 Inactive

victorlin temporarily deployed to nextstrain-s-victorlin--ubqpe8 June 15, 2024 00:23 Inactive

victorlin mentioned this pull request Jun 18, 2024

splash page redesign #849

Closed

15 tasks

victorlin temporarily deployed to nextstrain-s-victorlin--ubqpe8 June 18, 2024 23:21 Inactive

victorlin force-pushed the victorlin/splash-showcase-redesign branch from 14b2ef4 to ec5da30 Compare June 18, 2024 23:26

victorlin temporarily deployed to nextstrain-s-victorlin--ubqpe8 June 18, 2024 23:26 Inactive

trvrb temporarily deployed to nextstrain-s-victorlin--ubqpe8 June 19, 2024 23:10 Inactive

trvrb temporarily deployed to nextstrain-s-victorlin--ubqpe8 June 19, 2024 23:40 Inactive

trvrb temporarily deployed to nextstrain-s-victorlin--ubqpe8 June 20, 2024 00:01 Inactive

victorlin force-pushed the victorlin/splash-showcase-redesign branch from fffe300 to 5e6764f Compare June 21, 2024 23:55

victorlin temporarily deployed to nextstrain-s-victorlin--ubqpe8 June 21, 2024 23:55 Inactive

victorlin force-pushed the victorlin/splash-showcase-redesign branch from 5e6764f to afb144b Compare June 21, 2024 23:57

victorlin temporarily deployed to nextstrain-s-victorlin--ubqpe8 June 21, 2024 23:58 Inactive

victorlin mentioned this pull request Jun 21, 2024

Showcase refactor and additions #930

Merged

2 tasks

victorlin changed the base branch from trvrb/semantic-tiles to victorlin/showcase-refactor June 21, 2024 23:59

victorlin mentioned this pull request Jun 22, 2024

Swap splash tiles to use viz screenshots #914

Merged

6 tasks

victorlin temporarily deployed to nextstrain-s-victorlin--ubqpe8 June 22, 2024 00:13 Inactive

jameshadfield reviewed Jun 24, 2024

View reviewed changes

static-site/src/components/splash/index.jsx Outdated Show resolved Hide resolved

victorlin temporarily deployed to nextstrain-s-victorlin--ubqpe8 June 24, 2024 20:56 Inactive

jameshadfield reviewed Jun 24, 2024

View reviewed changes

static-site/src/components/splash/index.jsx Outdated Show resolved Hide resolved

victorlin temporarily deployed to nextstrain-s-victorlin--ubqpe8 June 24, 2024 21:26 Inactive

victorlin temporarily deployed to nextstrain-s-victorlin--ubqpe8 June 24, 2024 21:37 Inactive

victorlin force-pushed the victorlin/splash-showcase-redesign branch from 32d2c7f to 3711b69 Compare June 24, 2024 22:46

victorlin force-pushed the victorlin/showcase-refactor branch from cdce492 to e71d5e1 Compare June 24, 2024 22:46

victorlin temporarily deployed to nextstrain-s-victorlin--ubqpe8 June 24, 2024 22:46 Inactive

victorlin and others added 5 commits June 24, 2024 17:13

Add whitespace for readability

171a999

Reorder cards

d8b07e3

Co-authored-by: Trevor Bedford <trevor@bedford.io>

Update showcase info for new design

05cb490

- Add description and type - Ensure url is specific to match description - Remove "(narrative)" since new design will show type information Co-authored-by: Trevor Bedford <trevor@bedford.io>

Include a version of the strain logo suitable for icon sizing

619f37b

Co-authored-by: Trevor Bedford <trevor@bedford.io>

Redesign showcase on Splash

be4aebc

Make each card bigger and display additional information. Static preview: <https://github.com/nextstrain/nextstrain.org/assets/13424970/b04c0f6e-d35c-4502-bd6e-b893e90b66ba> Co-authored-by: Trevor Bedford <trevor@bedford.io>

victorlin force-pushed the victorlin/splash-showcase-redesign branch from 3711b69 to 08158d3 Compare June 25, 2024 00:13

victorlin temporarily deployed to nextstrain-s-victorlin--ubqpe8 June 25, 2024 00:14 Inactive

victorlin changed the base branch from victorlin/showcase-refactor to trvrb/semantic-tiles June 25, 2024 00:17

victorlin marked this pull request as ready for review June 25, 2024 00:23

joverlee521 approved these changes Jun 25, 2024

View reviewed changes

jameshadfield requested changes Jun 27, 2024

View reviewed changes

Infer if resource is a narrative from the URL

c8ef39b

This removes the need to specify type in the YAML.

victorlin force-pushed the victorlin/splash-showcase-redesign branch from 08158d3 to c8ef39b Compare June 27, 2024 17:52

victorlin temporarily deployed to nextstrain-s-victorlin--ubqpe8 June 27, 2024 17:52 Inactive

victorlin deployed to nextstrain-s-victorlin--ubqpe8 June 27, 2024 17:54 View deployment

trvrb self-requested a review June 27, 2024 18:00

trvrb approved these changes Jun 27, 2024

View reviewed changes

Describe content constraints in showcase.yaml

13beec5

Ideally the code can be more flexible, but right now things are looking good with the current content. Describe what sort of content is needed to keep things looking good.

victorlin force-pushed the victorlin/splash-showcase-redesign branch from bde50a3 to 13beec5 Compare June 27, 2024 18:07

victorlin temporarily deployed to nextstrain-s-victorlin--ubqpe8 June 27, 2024 18:08 Inactive

Base automatically changed from trvrb/semantic-tiles to master June 27, 2024 18:08

victorlin merged commit 3f91b31 into master Jun 27, 2024
4 checks passed

victorlin deleted the victorlin/splash-showcase-redesign branch June 27, 2024 18:09

victorlin mentioned this pull request Jun 27, 2024

Canary deployment does not always reflect latest merged PR #935

Closed

jameshadfield mentioned this pull request Aug 25, 2024

Auto-prepend / to tile URLs #996

Merged

3 tasks

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Redesign showcase on splash #922

Redesign showcase on splash #922

victorlin commented Jun 14, 2024 •

edited

Loading

trvrb commented Jun 19, 2024

victorlin commented Jun 20, 2024

trvrb commented Jun 20, 2024

joverlee521 left a comment

jameshadfield left a comment

jameshadfield Jun 27, 2024

victorlin Jun 27, 2024

joverlee521 Jun 27, 2024

trvrb left a comment

Redesign showcase on splash #922

Redesign showcase on splash #922

Conversation

victorlin commented Jun 14, 2024 • edited Loading

Description of proposed changes

Links

Checklist

trvrb commented Jun 19, 2024

victorlin commented Jun 20, 2024

trvrb commented Jun 20, 2024

joverlee521 left a comment

Choose a reason for hiding this comment

jameshadfield left a comment

Choose a reason for hiding this comment

jameshadfield Jun 27, 2024

Choose a reason for hiding this comment

victorlin Jun 27, 2024

Choose a reason for hiding this comment

joverlee521 Jun 27, 2024

Choose a reason for hiding this comment

trvrb left a comment

Choose a reason for hiding this comment

victorlin commented Jun 14, 2024 •

edited

Loading