Background Artwork


Grants & Research Programs

Both the Grants and Research Programs modules contain photos to serve as a backdrop for introductions to each initiative. These photos are still shots; they are mainly for background texture and to reinforce the scholarly tone of the section.

Preparing assets

  • Orientation: Rectangle
  • Size: 655px wide by 320px tall

Guidelines

  • These photos crop depending on the length of the text, so it’s important that the focus of the photo be at the top to middle of the photo.
  • Avoid human faces. Keep the subject abstract, or part of the photo out of focus.
  • Upload the full-color photo at full opacity. The black and white treatment and faded-out styling will be applied automatically.

Experts

Header

The header background on the Experts page features a collage of experts. This collage is exported from Photoshop as a single image, but that image can be updated in Craft should any individuals need to be introduced or removed from the artwork.

Preparing assets

  • Orientation: Rectangle
  • Size: 1495px wide by 360px tall.
Guidelines
  • There are 6 spots for photos in the collage. As the screen gets smaller, the background will crop and focus on the center of the photo.
    • Emphasize action shots—particular if individuals are speaking at events or engaging with young scholars.
    • Vary the scale of individuals as well as the number of experts per photo spot.
    • For the majority of photos, the individual should be looking away from the camera.
    • Try to keep the photos diverse. Devote at least one spot to students.
    • Avoid extremely dark or light photos. You can use levels to adjust brightness.
  • Each photo in the collage should measure ~374px wide. Two of the spots will measure 374px wide by 360px tall. The other four spots will be 180px tall.
  • Adjust levels and positioning of assets in Photoshop. Keep the desaturation and color overlay turned on when saving.
  • Select File > Save for web. When you’re ready to save out the JPEG, select File > Save for web, and save out at quality 60. “Optimized” and “convert to sRGB” should be checked.

Download collage PSD template (12.5 MB)


Young Scholars Initiative

Header

The YSI section of the website is branded with a secondary dark blue. For background artwork in the header of the Young Scholars landing page, we use a blurry photo underneath a semi-transparent dark blue color field. The photo measures 1495px wide by 800px tall to allow for wide screens and the height of stacked modules in the header on smaller screens. The photo centers vertically in the header. This photo does not need to be updated, but should it become outdated or need to change for messaging reasons, use the following guidelines.

Preparing assets

  • Orientation: Rectangle
  • Size: 1495px wide by 800px tall (photo does not take up full width—can be 1200px in the artwork)
Guidelines
  • Keep the images photographic. Avoid text, illustrations, infographics or charts with any text, or handdrawn textures.
  • Use photos with a lot of textural detail at a small scale—avoid the ability to focus in on specific individual’s faces.
  • Avoid extremely dark or light photos. You can use levels to adjust brightness.
  • Adjust levels and positioning of assets in Photoshop. Keep the desaturation and color overlay turned on when saving.
  • Select File > Save for web. Use the following settings (size will vary depending on which collage you’re exporting).

Download YSI header PSD template (13.6 MB)

Homepage module

The YSI module on the Homepage is text-only, atop a blurry photo and semi-transparent dark blue color field. The photo scales to the width of the viewport, until it is replaced by a solid dark blue.

Preparing assets

  • Orientation: Rectangle
  • Size: 978px wide by 300px tall (photo does not take up full width—can be 750px in the artwork)
Guidelines
  • Adjust levels and positioning of assets in Photoshop. Keep the desaturation and color overlay turned on when saving.
  • Select File > Save for web. When you’re ready to save out the JPEG, select File > Save for web, and save out at quality 60. “Optimized” and “convert to sRGB” should be checked.

Community module

The YSI module on the Community page features a quote, sampling of student avatars, and link to the Young Scholars page. For background artwork, we use a blurry photo underneath a semi-transparent dark blue color field. The photo scales to the width of the viewport, until it is replaced by a solid dark blue. At smaller screen sizes, the photos of students are omitted.

Preparing assets

  • Orientation: Rectangle
  • Size: 1495px wide by 640px tall (photo does not take up full width—can be 1200px in the artwork)
Guidelines
  • Keep the images photographic. Avoid text, illustrations, infographics or charts with any text, or handdrawn textures.
  • Choose a photo that features students.
  • Avoid extremely dark or light photos. You can use levels to adjust brightness.
  • Adjust levels and positioning of assets in Photoshop. Keep the desaturation and color overlay turned on when saving.
  • Select File > Save for web. When you’re ready to save out the JPEG, select File > Save for web, and save out at quality 60. “Optimized” and “convert to sRGB” should be checked.

Download YSI homepage module PSD template (2.2 MB)

Download YSI Community band PSD template (8.1 MB)


Events

Events and Event Detail header

The events section of the website is branded with a secondary dark green. For background artwork in the header of the Events landing page and Event Detail pages, we use a vector world map overlaid at 20% opacity on a green gradient. For consistency across events and differentiation from other entries, the world map should only be used here. The world map measures 1495px wide by 800px tall to allow for wide screens and the height of stacked modules in the header on smaller screens. The map centers vertically in the header.

Download world map SVG (813 KB)

The gradient behind the map can be reproduced in Photoshop with a linear gradient from #141b1b and #222929 at 50 degrees, scaled at 150%.