gallery.md

layout	default
title	Gallery
description	Visual showcase of research outputs from the AI & Global Development Lab.

Gallery

Satellite imagery, data visualizations, and research outputs from our work on global development. For interactive visualizations, visit {{ site.main_site.name }}/visualizations.

Explore figure batteries grouped by paper. Use the index to jump to a study, click a title to open the paper, and click any panel to view it full-size.

{% assign batteries = site.data.gallery_batteries %}

<div class="battery-index card card-glass animate-on-scroll" aria-label="Figure battery index">
  <p class="battery-index__label">Index</p>
  <div class="battery-index__links">
    {% for battery in batteries %}
      <a class="tag" href="#{{ battery.id }}">{{ battery.title }}</a>
    {% endfor %}
  </div>
</div>

<div class="figure-batteries mt-6">
  {% for battery in batteries %}
    <article class="figure-battery card card-glass animate-on-scroll" id="{{ battery.id }}">
      <header class="figure-battery__header">
        <h3 class="figure-battery__title">
          <a href="{{ battery.href }}" target="_blank" rel="noopener">{{ battery.title }}</a>
        </h3>
        <a class="figure-battery__paper link-arrow" href="{{ battery.href }}" target="_blank" rel="noopener">Paper</a>
      </header>

      <div class="figure-battery__grid" aria-label="Panels for {{ battery.title }}">
        {% for panel in battery.panels %}
          <button class="figure-tile" type="button" data-lightbox aria-label="Open full-size image: {{ battery.title }} — {{ panel.label }}">
            <picture class="figure-tile__media">
              {% if panel.dark %}
                <source srcset="{{ panel.dark | relative_url }}" media="(prefers-color-scheme: dark)">
              {% endif %}
              <img
                src="{{ panel.light | relative_url }}"
                alt="{{ panel.alt }}"
                class="figure-tile__img{% if panel.invert_dark %} figure-tile__img--invert-dark{% endif %}"
                loading="lazy" />
            </picture>
            <span class="figure-tile__label">{{ panel.label }}</span>
          </button>
        {% endfor %}
      </div>
    </article>
  {% endfor %}
</div>

Use Our Images

Images from our research are available for academic and educational use with attribution. For high-resolution versions or media inquiries, please contact us.