Dr. Walter White
Blog
Publications
Teaching
CV
K

3. Media & Interactive

1 min read

Image (with caption + zoom/fullscreen)

<Image 
  src="/images/demo-chart.png" 
  alt="Analytics Breakdown Chart" 
  caption="Figure 2.1 – Weekly engagement metrics" 
  zoom
/>

Video (responsive, with controls)

<Video 
  src="/media/demo-video.mp4" 
  title="Platform Walkthrough"
  autoplay 
  muted 
  loop 
  controls 
/>

AudioPlayer (for research or podcasts)

<AudioPlayer 
  src="/audio/interview-snippet.mp3" 
  title="Research Interview: Dr. Smith" 
  description="Segment from ethnographic study on data sharing" 
/>
<Gallery
  images={[
    { src: "/gallery/image1.jpg", alt: "Field Study 1" },
    { src: "/gallery/image2.jpg", alt: "Field Study 2" },
    { src: "/gallery/image3.jpg", alt: "Field Study 3" },
  ]}
/>

Embed (external content: YouTube, Twitter, iframe)

<Embed 
  src="https://www.youtube.com/embed/dQw4w9WgXcQ" 
  title="Demo Presentation" 
  provider="youtube"
/>

For Twitter or iframe:

<Embed 
  src="https://twitter.com/OpenAI/status/1234567890123456789" 
  provider="twitter" 
/>

<Embed 
  src="https://data.example.org/visualization" 
  title="Live Data Feed" 
  provider="iframe"
/>
<Carousel
  slides={[
    { title: "Step 1", content: "Upload your document." },
    { title: "Step 2", content: "Select your template." },
    { title: "Step 3", content: "Publish with one click." },
  ]}
/>
On this Page