QA | DESIGN v0.6.0.beta

[scottqueen-bixal]

Domain

design

Related Issue(s)

DUE: 8/19
ENV: https://bf-cms-main.bxdev.net/benefit-finder/death

New issues that arise from this task should be created using the Bug Report form.

The following issues have been addressed and are ready for design review

#1666
#1661
#1633
#1656
#1632
#1629
#1451
#1449
#1448
#1447

Description

No response

[ErnestoFernandezAlvarez]

#1666
@gscottqueen The summary box looks great. Just would like to confirm the color of the Link: "1A4480
Blue-link". On my screen it looked a bit darker but It might just be my monitor. If the color code is correct, please disregard the note.
Thank you

[ErnestoFernandezAlvarez]

#1661

This item was resolved and looks great!
Thank you!

[ErnestoFernandezAlvarez]

#1633

The buttons look good and follow the color and padding specification from the Client.
However, please note that for the redesign these CTA's-buttons have changed:

Form: The new design uses "Next" Cta, instead of "Continue" Cta.
Landing page: The new design uses "Start finding benefits", instead of "Start" Cta

Note: There is a new ticket created for this change item.
CTA legend changes #1697

[ErnestoFernandezAlvarez]

#1656
This update has been completed and looks great!
Note: initially the client wanted body copy text size for this component, but we pushed back. There might be a revision in the future as we complete the entire design of the user flow.

[ErnestoFernandezAlvarez]

#1632

@gscottqueen
This comment is about the MODAL BUTTONS only: the size and padding look good! However please note that the legend was changed for the redesign, following A11y recommendations:

Change "See results" to "See your results"
Change "Review selections" to "Review your selections"

Note: new ticket created for this change Modal CTA's legend change #1698

[ErnestoFernandezAlvarez]

#1629

Color changes requested by client have been address and look good!

[ErnestoFernandezAlvarez]

#1451
@gscottqueen @fongcindy
This is pending further revisions and will include the size and margins of the entire pages.

[ErnestoFernandezAlvarez]

#1449

The accordions look great! The following are minor details to refine:

1. There is not outline around the active state container of the accordion (Client'r Request) (see image ref)
2. Space between the CTA and the border of the container is 32px (see image ref)
3. The lines between the criteria items are too thick. Please take a look at the close up screenshot taken from the site. (see image ref)

This is the new ticket to capture these items:Refinement of the Benefit Accordion Cards #1699

[ErnestoFernandezAlvarez]

@scottqueen-bixal @fongcindy
This is the ticket created to capture the Red Error Line Spacing Issue that we discussed last week.

#1704

[ErnestoFernandezAlvarez]

#1448

The cards look correct according to design details and proportions, however please note that the font changes has not been applied yet.

Default
Hover
Heading Font: Source Sans Pro Bold 21pt underlined
Text Font: Source Sans Pro Regular 17 pt
Heading Font color: 11385B
Text Font color: 1B1B1B
Background color Default State: FFFFFF
2pt Outline color: 0081A1
*Note Shadow effect applied to outline.

Hover
Heading Font: Source Sans Pro Bold 21pt underlined
Text Font: Source Sans Pro Regular 17 pt
Heading Font color: 11385B
Text Font color: 1B1B1B
Background color Hover State: CCECF2
2pt Outline color: 0081A1
*Note Shadow effect applied to outline.

The font details are as follows and they are listed in the Figma File:

[ErnestoFernandezAlvarez]

@scottqueen-bixal @fongcindy

Note this ticket has been created to capture the radio button color style change:
Radio button change to Client's design style #1708

Yes and No font: Source Sans Pro 17pt Regular

Outline default state: 1B1B1B
Fill default state: FFFFFF

Outline active state: 0186A2
Fill active state: 1B1B1B

[scottqueen-bixal]

1A4480
confirmed:

[ErnestoFernandezAlvarez]

#1447

The icons display correctly only in some result pages.

A new ticket has been created to capture this bug:
#1711

Please see how the DOLO icon displays filled in one of the result pages:

These icons have been updated to 45x45 box size and converted to SVG: https://drive.google.com/drive/folders/17qpXww2C_oFq4ybIS_D0W3fxzvSYKjgP?usp=drive_link

[scottqueen-bixal]

#1447

The icons display correctly only in some result pages.

A new ticket has been created to capture this bug: #1711

Please see how the DOLO icon displays filled in one of the result pages:

These icons have been updated to 45x45 box size and converted to SVG: https://drive.google.com/drive/folders/17qpXww2C_oFq4ybIS_D0W3fxzvSYKjgP?usp=drive_link

the death icon was missing some fill paths on the previous export, this new export seems to do the trick.

All the svgs are still exported as 46 x 45

[ErnestoFernandezAlvarez]

thanks @scottqueen-bixal
Let me know if you need them exported again. Sometimes these files get corrupted out of nowhere!