[FE] Review homepage, login screens, questions flow, and other screens in staging

Samara-Strauss commented 4 years ago

Background

In our 8.27.20 planning meeting, Mike mentioned he had homepage and login screens to review with Melissa. This ticket is to track that convo and make sure it happens.

10/21/20 update: Allyce is going to conduct a review of all screens currently in staging and perform design QA.

Tasks

[ ] Homepage
[ ] Account sign up
[ ] Account sign in
[ ] Forgot username
[ ] Forgot password
[ ] Questions flow
[ ] Style guide (WIP)

Things to review for:

Generally, we are reviewing for bugs or inconsistencies between the prototype and what was implemented in dev.

[ ] Compare content in the prototype and staging and make sure it matches
- In some places, mobile versus desktop content might be different, and we want to make sure it's the same. Double check this.
[ ] Review typography, like decisions made for H1, H2, H3. Make sure H tags are implemented correctly across the app.
- Note: the h tags are inconsistent in InVision, so Mike made some decisions. Don't compare what is in staging to what's in the prototype for this one.
[ ] Are things "pixel perfect"? I.e., do we need to add more padding anywhere? Any line breaks? Any wonkiness going on design-wise?
[ ] Check responsiveness from mobile to tablet to desktop

Samara-Strauss commented 4 years ago

Blocked — need the staging environment to be up before this can be done.

allyceh commented 3 years ago

@mikepif Looks like this is what we're going to do tomorrow, right? If so, I'll assign myself.

allyceh commented 3 years ago

@mikepif @leahbannon2 @bestes-usds Made some tweaks to this ticket to reflect what design QA will entail. Closed out 155 because it felt repetitive.

Per a convo with Leah and Brian today, I'll assess the LOE for the design QA once I take a look at the latest in staging, and will loop in Brian or Leah if I need support.

allyceh commented 3 years ago

@leahbannon2 or @bestes-usds , if you still have bandwidth to help out with this ticket, could you help with reviewing these two items from the list above?

In some places, mobile versus desktop content might be different, and we want to make sure it's the same. Double check this.
Check responsiveness from mobile to tablet to desktop
- Note: I don't have an iPad. Will need to find team member with an iPad to QA this.

I will start by reviewing typography and H tags. I'll draft a bug ticket format and run it by @mikepif .

@mikepif , in your experience, what types of devices do you think we should use for QA? What browsers do the NJ folks have on their laptops/desktop computers and what are we supporting? List of browser options:

Chrome
IE (old version and edge) List of devices: ? These should be devices that our applicants would have.

mikepif commented 3 years ago

I'd recommend at least testing with;

Chrome (Android), Chrome (v86+, desktop), Safari (iOS), Safari (Desktop), Firefox (v81+, desktop)

(*see market penetration below)

Probably worth support MS Edge too, but not worth supporting older IE not seen much in the wild anymore and a pain to support.

Probably not necessary, but device-wise;

iOS: iPhone X-12 (can use simulators), iPad (latest version is fine, tend to get most people on the latest version quickly) Android: At least v10 but probably v9 if possible (see below for market penetration)

allyceh commented 3 years ago

@mikepif Do we need to test older iPhone OS or screen sizes for older devices? Or, will we see the same thing if we test on X-12 as any other OS? Given the population of folks who are using the application, I am making the assumption that they won't have the X-12.

leahbannon2 commented 3 years ago

We'll need to support IE11, too. There's enough people still using it, and I believe IE is the browser they use at the county offices.

From analytics.usa.gov

amalabukar31 commented 3 years ago

@melissajschaff @allyceh are we declaring this done? or should I move it back to in progress for melissa to review?

newjersey / dhs-oneapp