CU - Source and Replace SVGs of the existing military branches and add missing ones

[jennb33]

What Happened Current SVGs of the military branches need to be updated with consistent SVGs that may need to come from the Marketing departments/websites of each branch themselves. A Navy logo as an SVG was sourced from Wikipedia and should work because it does not make the Engineering team have to convert longer doing the weird PNG stuff (plugging the previously linked SVG into the CoastGuard.svg)

Tim R. found that the Army icon gives an internal RN warning about some in-SVG gradients not having stops and, as far as I could tell, the Army doesn't have the ~proper and true ~ emblem anywhere online, their branding site tells you to email someone.

• AF icon I found has the winged-trident thing inside the lower part of the lower logo misplaced (too far up vertically) and is missing the orange tips on the top/bottom trident
• Coast Guard icon doesn't have transparency on the holes in the anchor (this is the only issue meaningfully visible at the scale we render the icon)
• Navy icon has a flat-looking chain surrounding the eagle instead of a more 3D looking chain
• USMC icon has misshapen/flat appearance on the anchor (top and bottom) to what it should be
• So, basically, every icon is slightly wrong/could be cleaned up with a revisit

See Tim's comment below for more detail.

Specs: We need to have logos that are consistent with the look, feel and treatment across the VA App

Steps to Reproduce

Navigate to home screen for users with various military branches and note minor inconsistencies with official branding per the DoD/individual branches.

Desired behavior Jennifer B has offered to contact the marketing departments of each branch and contact them for the correct SVG logo type so that our app is consistent in look, feel and behaviour across the different technology products (OX and Android) that it is used with.

Acceptance Criteria Acceptance Criteria is that all Military Branch logos are supplied by the individual branches as RGB SVG files for use in the VA Mobile App for both OS and Android devices.

Bug Severity

• Impact: Low

• Frequency: High

• sev 2 - High

Ticket Checklist

• [N/A] Steps to reproduce are defined
• [X] Desired behavior is added
• [ ] Labels added (front-end, back-end, relevant feature, accessibility, etc)
• [ ] Estimate of 1 added (for front-end tickets)
• [ ] Added either to the relevant feature epic (if found during new feature implementation), or the bug epic

[jennb33]

Downloaded the DOD Seal as a .jpg and as an .ai file from https://www.defense.gov/Brand-Guide/#DOD-seal

[jennb33]

Requested Army logo as RGB SVG file on 6/5 via their contact page through https://www.army.mil/contact

[jennb33]

Requested Air Force Symbol and Emblem, as well as Space Force Emblem, on 6/5, via their form that is found here: https://www.trademark.af.mil/Branding/

[jennb33]

Requested US Navy logo on 6/5 via email usn.pentagon.cnr-arlington-va.mbx.navylicensing@us.navy.mil

[TimRoe]

A comment more fully documenting my findings on existing individual icons in updating them as needed for the May 2023 dependency XL branch since our existing PNG-in-SVG format broke with the updates to RN/other libraries:

• Coast Guard
  • defense.gov emblem: https://www.defense.gov/portals/1/Page-Assets/dod-trademark-licensing-guide/seals/coast-guard-logo1.png (note: this is also incorrect per official guidance)
  • SVG used from Wikipedia: https://upload.wikimedia.org/wikipedia/commons/e/e5/Mark_of_the_U.S._Coast_Guard.svg
  • Coast Guard branding documents:
  • https://media.defense.gov/2021/Oct/20/2002877103/-1/-1/1/USCG%20BRANDING%20GUIDELINES%20&%20FAQS.PDF
  • https://www.uscg.mil/Community/Trademark/insignia/
  • Issue with current SVG: lacks transparency inside the anchor "loops"
• Air Force
  • defense.gov emblem: https://www.defense.gov/portals/1/Page-Assets/dod-trademark-licensing-guide/seals/air-force-seal.png (note: this is also incorrect per official guidance)
  • SVG used from Wikipedia: https://upload.wikimedia.org/wikipedia/commons/archive/e/eb/20210122014752%21Mark_of_the_United_States_Air_Force.svg
  • Air Force branding documents:
  • https://www.trademark.af.mil/Branding/
  • https://www.trademark.af.mil/Branding/The-Air-Force-Emblem/
  • Issues with current SVG:
  • Missing the reddish tips on the "trident" parts of the winged golden symbol inside the coat of arms portion
  • The winged golden symbol inside the coat of arms portion is offset too far up vertically
• Marine Corps
  • defense.gov emblem: https://www.defense.gov/portals/1/Page-Assets/dod-trademark-licensing-guide/seals/marine-seal1.png (note: this is also incorrect per official guidance)
  • SVG used from Wikipedia: https://upload.wikimedia.org/wikipedia/commons/3/3b/Seal_of_the_U.S._Marine_Corps.svg
  • Marine Corps branding documents:
  • https://www.hqmc.marines.mil/Agencies/Counsel-for-the-Commandant/Marine-Corps-Trademark-Licensing-Program/Our-Emblems-And-Graphics//
  • Page 3 of: https://www.hqmc.marines.mil/Portals/134/USMC%20Content%20Guide%202021_1.pdf
  • Issue with current SVG:
  • Misshapen/flat appearance on the anchor (top and bottom) to what it should be
  • Wrong text around perimeter and incorrect background color
  • Incorrect external roping color
• Army
  • defense.gov emblem: https://www.defense.gov/portals/1/Page-Assets/dod-trademark-licensing-guide/seals/army-seal.png
  • SVG used from Wikipedia: https://upload.wikimedia.org/wikipedia/commons/2/24/Mark_of_the_United_States_Army.svg
  • No official branding documents, sources found:
  • https://www.defense.gov/Resources/Branding-and-Trademarks/DOD-Trademark-Licensing-Guide/#one
  • https://www.army.mil/aemo#org-new-army-brand
  • Issues with current SVG:
  • Gives an internal React Native warning about some in-SVG gradients not having stops
  • No official guidance found online to validate accuracy besides the defense.gov page which have incorrect emblems for the other branches
• Navy
  • defense.gov emblem: https://www.defense.gov/portals/1/Page-Assets/dod-trademark-licensing-guide/seals/navy-seal.png (note: this is also incorrect per official guidance)
  • SVG used from Wikipedia: https://upload.wikimedia.org/wikipedia/commons/b/b1/Emblem_of_the_United_States_Navy.svg
  • Navy branding documents:
  • Page 13: https://media.defense.gov/2021/Apr/08/2002616384/-1/-1/1/FINALLICENSINGGUIDELINES_DIGITAL_2162021.PDF
  • https://www.navy.mil/trademarks/
  • Issue with current SVG: has a flat-looking chain surrounding the eagle instead of a more 3D looking chain

[TimRoe]

@jennb33

The current options being pulled into the app that we do not have a branch emblem for (displays no emblem next to their name/branch of service):

• DoD
  • I see the JPG and AI file commented prior, I think we'll want to ask for an SVG:
  • To have the consistency of using all SVGs--not sure offhand our existing icon handling can handle non-SVGs
  • AI file vector icons are apparently some Adobe proprietary standard that's considered less good than SVG
• Public Health Service
• NOAA

As these would be new additions, no online searching was conducted (see prior comment) on whether there's publicly available SVGs for them that meet published branding guidance.

As of present, the API does not appear to include Space Force so we'd need a BE ticket to include that (and possibly reaching out to the API maintainer to have it added).

[TimRoe]

Added blocked-external label and moved to Blocked pending getting SVGs from branches to plug in.

Also added 2 points since the code changes involved to plug in new SVGs once we have them should be minor including adding additional branches.*

*Except Space Force which should be a separate ticket since it also would need at least BE changes--maybe API changes we'd be dependent on another group to expose for consumption.

[bischoffa]

@TimRoe who were you working with externally regarding the blocker?

[jennb33]

@bischoffa we were working with Ryan, who is OOO this week. He was reaching out to the military branches. cc: @TimRoe

[TKDickson]

This is code upkeep, not a bug. Updating labels & titles accordingly, and FYI @jennb33

[jennb33]

I will reach out to Ryan to see if he has had any response from reaching out to the military branches for getting their updated .SVG files. cc: @bischoffa @TimRoe

[rtwell]

unfortunately, I was met with the same runaround that everyone else has encountered. For now, let's use what we have and keep our ears to the ground about any Veteran feedback about them. Sorry gang!