Skip to content

LG-9973: Implement new default Sign In page from A/B test results#8542

Merged
aduth merged 4 commits intomainfrom
aduth-lg-9973-a-b-test-cleanup
Jun 9, 2023
Merged

LG-9973: Implement new default Sign In page from A/B test results#8542
aduth merged 4 commits intomainfrom
aduth-lg-9973-a-b-test-cleanup

Conversation

@aduth
Copy link
Contributor

@aduth aduth commented Jun 6, 2023

🎫 Ticket

LG-9973

🛠 Summary of changes

Updates Sign In page to reflect the winner of the recent A/B test (the "tabbed" variant), removing all code associated with the A/B test and unused tests.

Easier to review with whitespace changes hidden: https://github.com/18F/identity-idp/pull/8542/files?w=1

📜 Testing Plan

  1. Go to http://localhost:3000
  2. Verify that you can still sign in and create an account

👀 Screenshots

Before After
image image

changelog: User-Facing Improvements, Sign In, Update layout of Sign In page to reflect results of recent A/B test
@aduth aduth requested a review from a team June 6, 2023 20:56
Copy link
Contributor

@zachmargolis zachmargolis left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

track_event(
'User Registration: enter email visited',
sign_in_a_b_test_bucket:,
from_sign_in:,
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

is this a useful param to keep at all?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It could be, but my YAGNI hardliner instincts tell me we don't have an immediate use for it detached from the A/B test.

Generally, I do find that we're increasingly wanting to track "clicks" and correlating how a user arrives at a particular place, but maybe that's something we'd want to have some generic support for (e.g. a referrer base property on analytics events, or using ClickObserverComponent now that its implemented with sendBeacon as of @matthinz's improvements in #8496†).

† Previously, I would have avoided ClickObserverComponent for links which navigate the user away, since you couldn't trust that the analytics would be logged unless adding some async await + spinner button, often more trouble than it was worth.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

FWIW I think a referer property on events could be useful (perhaps normalized to just the path, could even leave it nil for links from other hosts if we wanted).

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

(obviously we'd keep the misspelling from HTTP 😄 )

ses_configuration_set_name: ''
set_remember_device_session_expiration: false
sign_up_mfa_selection_order_testing: '{ "default": 100, "authentication_app_priority": 0, "usability_priority": 0 }'
sign_in_a_b_testing: '{ "default": 100,"tabbed" :0, "banner": 0 } '
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

😱 can't believe we had the extra space inside that string there, glad we're removing it

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

😱 can't believe we had the extra space inside that string there, glad we're removing it

😅 Luckily it seemed to tolerate pretty well regardless!

@aduth
Copy link
Contributor Author

aduth commented Jun 7, 2023

I snuck in some styling improvements in d1f3066, to improve appearance in mobile:

  1. Per the original design, the font size should shrink from 1.25rem to 1rem, to avoid text wrapping at common mobile viewport sizes
  2. To better handle when wrapping does occur (such as narrow mobile viewports like iPhone SE), vertically center the text

I left a "TODO" to fill in with the upstream pull request, which I'll add before merging.

Device Before After
iPhone XR before-xr after-xr
iPhone SE before-se after-se

@aduth
Copy link
Contributor Author

aduth commented Jun 7, 2023

I left a "TODO" to fill in with the upstream pull request, which I'll add before merging.

Done and reconciled with upstream uswds/uswds#5324 in 88d7f68.

@aduth aduth merged commit 9d60b9c into main Jun 9, 2023
@aduth aduth deleted the aduth-lg-9973-a-b-test-cleanup branch June 9, 2023 12:32
@jmhooper jmhooper mentioned this pull request Jun 13, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants