Create hero image best practices template for Project Pages

[kristine-eudey]

Overview

We need to create a template/best practices sheet for hero images on Project pages so that project teams have the guidance they need to select/create an image that works well within the standard design of the page.

Action Items

Design:

• Review all current Project pages and look for any issues with hero images currently being used.
• Create written guidelines as well as a Figma template that can be shared with Project teams which gives guidance on image selection and takes into account current and possible future issues that may make a hero image not work well with the current page design.
• Template should show:
  • An example of where how this section will appear within the context of the page
  • Guidance for margins, ideal focal points, etc.
  • Visual examples of "do's and don'ts" which can help people understand the importance of these guidelines in supporting their project's page

Resources/Instructions

Hack for LA - Projects
Figma - Project Description Page
Github - Assets for Projects page

[github-actions]

Hi @kristine-eudey.

Good job adding the required labels to this issue.

Additional Resources:
Wiki: How to add status labels to issues (WIP. Link will be updated when the wiki is done)
Wiki: How to create issues (WIP. Link will be updated when the wiki is done)

[kristine-eudey]

Hi @ahoang94, I thought you were assigned to this issue but just realized it was still in the backlog and you weren't assigned. Are you currently working on it? If so can you please provide an update here so we can keep track of it? Thank you!

[ahoang94]

@kristine-eudey I plan on working on this issue this week, and I hope to be done by Sunday's meeting!

[kristine-eudey]

@ahoang94 just checking in to see if you'd like to discuss this during the meeting today. If so just put in Questions/In Review and we can discuss!

[ahoang94]

@kristine-eudey I talked to @abuna1985 about this issue at Thursday's meeting, and we came to the conclusion that the developers need to tinker with the header's formatting on the project pages before we can start work on a template. As shown in the video below, the padding of the artwork is entirely dependent on the size of the browser window, and so I believe that the developers are going to try to make it more static so that the artwork does not being to 'disappear' as the window becomes smaller.

Project.Header.1080p.mov

[ahoang94]

As mentioned in my last comment, this issue is now dependent on some developer work, and so I will move this to the prioritized backlog and remove my assignation for the time being.

[ExperimentsInHonesty]

I am going to close the issue and development will make a new issue, and then reference this one.