iab-agents
diff --git a/‎.DS_Store‎
2 KB b/‎.DS_Store‎
2 KB
diff --git a/‎img/been.png‎
286 KB b/‎img/been.png‎
286 KB
diff --git a/‎img/jentse.jpg‎
46.4 KB b/‎img/jentse.jpg‎
46.4 KB
diff --git a/‎img/kaiser.jpg‎
-97.2 KB b/‎img/kaiser.jpg‎
-97.2 KB
diff --git a/‎img/kun.jpg‎
246 KB b/‎img/kun.jpg‎
246 KB
diff --git a/‎img/nancy.jpg‎
70.3 KB b/‎img/nancy.jpg‎
70.3 KB
diff --git a/‎src/App.jsx‎
Lines changed: 115 additions & 20 deletions b/‎src/App.jsx‎
Lines changed: 115 additions & 20 deletions
diff --git a/‎src/data/peopleRepository.js‎
Lines changed: 64 additions & 9 deletions b/‎src/data/peopleRepository.js‎
Lines changed: 64 additions & 9 deletions
@@ -1,3 +1,4 @@
+import { Fragment, useEffect, useState } from 'react';
 import heroImage from '../img/hero.png';
 import Navigation from './components/Navigation';
 import PersonCard from './components/PersonCard';
@@ -6,16 +7,23 @@ import { getPeopleByRole, PERSON_ROLE } from './data/peopleRepository';
 import {
   advisors,
   cfpCategories,
+  ethicsNote,
   importantDates,
+  neuripsReviewTrack,
+  openReviewUrl,
   programCommittee,
   schedule,
+  specialTrack,
   speakerSection,
+  submissionDeadline,
+  submissionDeadlineLabel,
   submissionFormats,
   topics,
 } from './data/siteData';
 
 const speakers = getPeopleByRole(PERSON_ROLE.SPEAKER);
 const organizers = getPeopleByRole(PERSON_ROLE.ORGANIZER);
+const featuredAdvisors = getPeopleByRole(PERSON_ROLE.ADVISOR);
 
 function Hero() {
   return (
@@ -81,9 +89,13 @@ function News() {
       <div className="container">
         <h2>News</h2>
         <ul className="news-list">
-          <li><span className="date">Coming soon</span><span>Call for Papers will open shortly. Stay tuned.</span></li>
           <li>
-            <span className="date">Jul 2026</span>
+            <span className="date">Jul 22, 2026</span>
+            <span>Call for Papers is out. Submission site <a href={openReviewUrl} target="_blank" rel="noopener noreferrer">OpenReview</a> is open.</span>
+          </li>
+          <li><span className="date">Jul 21, 2026</span><span>Our speakers and panelists are confirmed!</span></li>
+          <li>
+            <span className="date">Jul 12, 2026</span>
             <span>🎉 IAB is accepted as a <a href="https://neurips.cc/Conferences/2026" target="_blank" rel="noopener noreferrer">NeurIPS 2026</a> workshop in Sydney.</span>
           </li>
         </ul>
@@ -117,9 +129,9 @@ function Scope() {
 
 function Speakers() {
   return (
-    <section id="speakers">
+    <section id="speakers" className="alt">
       <div className="container">
-        <h2>Invited Speakers</h2>
+        <h2>Invited Speakers &amp; Panelists</h2>
         <p className="lead">{speakerSection.message}</p>
         {speakerSection.showProfiles && (
           <div className="people-grid speakers-grid">
@@ -133,7 +145,7 @@ function Speakers() {
 
 function Schedule() {
   return (
-    <section id="schedule" className="alt">
+    <section id="schedule">
       <div className="container">
         <h2>Schedule <span className="status-pill">Tentative</span></h2>
         <p className="lead">Full-day workshop with keynotes, paper presentations, posters, and a panel discussion. The program below is tentative and subject to change.</p>
@@ -143,7 +155,13 @@ function Schedule() {
               <span className="sch-time">{item.time}</span>
               <span className="sch-desc">
                 {item.title}{' '}
-                {item.emphasis && <strong>{item.emphasis}</strong>}{' '}
+                {Array.isArray(item.emphasis)
+                  ? item.emphasis.map((name, index) => (
+                      <Fragment key={name}>
+                        <strong>{name}</strong>{index < item.emphasis.length - 1 && ', '}
+                      </Fragment>
+                    ))
+                  : item.emphasis && <strong>{item.emphasis}</strong>}{' '}
                 {item.suffix && <span>{item.suffix} </span>}
                 {item.meta && <em>{item.meta}</em>}
               </span>
@@ -160,33 +178,107 @@ function CallForPapers() {
     <section id="cfp">
       <div className="container">
         <h2>Call for Papers</h2>
-        <p className="lead">We solicit two types of non-archival submissions and welcome empirical studies, datasets, methods papers, tools, and negative results on understanding agent behavior.</p>
-        <p className="lead">We particularly welcome contributions across four categories:</p>
+
+        <h3 className="cfp-heading">Topics</h3>
+        <p className="lead">We call for non-archival submissions on understanding agent behavior. We welcome work that helps us understand what agents do and why, including but not limited to:</p>
         <ul className="lead-list">
-          {cfpCategories.map(([name, description]) => (
-            <li key={name}><strong>{name}:</strong> {description}</li>
+          {cfpCategories.map(([name, description, example]) => (
+            <li key={name}><strong>{name}:</strong> {description} <span className="eg">{example}</span></li>
           ))}
         </ul>
+        <div className="special-track">
+          <h4>This year, we have a <span className="st-hl">Special Track</span>: {specialTrack.heading}</h4>
+          <p>{specialTrack.body}</p>
+        </div>
         <p className="lead">We also encourage negative results and methodological position papers.</p>
+
+        <h3 className="cfp-heading">Submission Format</h3>
         <div className="cfp-formats">
           {submissionFormats.map(([title, description]) => (
-            <article className="cfp-box" key={title}><h3>{title}</h3><p>{description}</p></article>
+            <article className="cfp-box" key={title}><h4>{title}</h4><p>{description}</p></article>
           ))}
           <article className="cfp-box">
-            <h3>Review Process</h3>
-            <p>NeurIPS-style formatting, double-blind review, and three reviews per submission via <a href="https://openreview.net" target="_blank" rel="noopener noreferrer">OpenReview</a>.</p>
+            <h4>Review Process</h4>
+            <p>NeurIPS-style formatting, double-blind review, submission site: <a href={openReviewUrl} target="_blank" rel="noopener noreferrer">OpenReview</a>.</p>
           </article>
         </div>
-        <div className="dates-row">
-          {importantDates.map(([label, value]) => (
-            <div className="date-card" key={label}><div className="lab">{label}</div><div className="val">{value}</div></div>
-          ))}
+        <div className="cfp-tracks">
+          <article className="cfp-box">
+            <h4>{neuripsReviewTrack.title}</h4>
+            <p>{neuripsReviewTrack.intro}</p>
+            <span className="track-due">{neuripsReviewTrack.due}</span>
+            <p>{neuripsReviewTrack.body}</p>
+          </article>
         </div>
+
+        <h3 className="cfp-heading">Important Dates</h3>
+        <Countdown />
+        <table className="dates-table">
+          <tbody>
+            {importantDates.map(({ label, value, key }) => (
+              <tr key={label} className={key ? 'key' : undefined}>
+                <td>{label}</td>
+                <td>{value}</td>
+              </tr>
+            ))}
+          </tbody>
+        </table>
+
+        <h3 className="cfp-heading">Ethics and LLM Usage</h3>
+        <p className="lead">
+          {ethicsNote.body}{' '}
+          <a href={ethicsNote.url} target="_blank" rel="noopener noreferrer">{ethicsNote.linkText}</a> for details.
+        </p>
       </div>
     </section>
   );
 }
 
+const pad = (n) => String(n).padStart(2, '0');
+
+function timeLeft(deadline) {
+  const ms = new Date(deadline).getTime() - Date.now();
+  if (ms <= 0) return null;
+  const sec = Math.floor(ms / 1000);
+  return {
+    days: String(Math.floor(sec / 86400)),
+    hours: pad(Math.floor((sec % 86400) / 3600)),
+    minutes: pad(Math.floor((sec % 3600) / 60)),
+    seconds: pad(sec % 60),
+  };
+}
+
+function Countdown() {
+  const [left, setLeft] = useState(() => timeLeft(submissionDeadline));
+
+  useEffect(() => {
+    const timer = setInterval(() => setLeft(timeLeft(submissionDeadline)), 1000);
+    return () => clearInterval(timer);
+  }, []);
+
+  if (!left) {
+    return (
+      <div className="countdown">
+        <div className="cd-label">Submissions are closed<strong>The deadline has passed.</strong></div>
+      </div>
+    );
+  }
+
+  return (
+    <div className="countdown">
+      <div className="cd-label">Submission deadline in<strong>{submissionDeadlineLabel}</strong></div>
+      <div className="cd-units">
+        {[['Days', left.days], ['Hours', left.hours], ['Minutes', left.minutes], ['Seconds', left.seconds]].map(([unit, value]) => (
+          <div className="cd-unit" key={unit}>
+            <div className="n">{value}</div>
+            <div className="u">{unit}</div>
+          </div>
+        ))}
+      </div>
+    </div>
+  );
+}
+
 function InlinePeople({ people, linked = false }) {
   return people.map(([name, affiliation, url], index) => (
     <span key={name}>
@@ -206,7 +298,10 @@ function Organizers() {
         </div>
         <div className="adv">
           <h3>Advisory Board</h3>
-          <p className="adv-note">Researchers and collaborators who have supported and advised this workshop.</p>
+          <p className="adv-note">We thank the following faculty and senior researchers who have supported this workshop.</p>
+          <div className="people-grid advisors-grid">
+            {featuredAdvisors.map((advisor) => <PersonCard key={advisor.id} person={advisor} variant="organizer" />)}
+          </div>
           <p><InlinePeople people={advisors} linked /></p>
         </div>
         <div className="adv">
@@ -235,7 +330,7 @@ function Footer() {
     <footer>
       <div className="container">
         <p><strong>IAB</strong> · Interpreting Agent Behavior: Human-Centered Interpretation for Understanding Agents, Humans, and Interaction</p>
-        <p>Workshop proposal, 2026 · Contact: <a href="mailto:jgao77@jh.edu">jgao77@jh.edu</a></p>
+        <p>NeurIPS Workshop, 2026 · Contact: <a href="mailto:iab-workshop@googlegroups.com">iab-workshop@googlegroups.com</a></p>
       </div>
     </footer>
   );
@@ -250,9 +345,9 @@ export default function App() {
         <About />
         <News />
         <Scope />
+        <CallForPapers />
         <Speakers />
         <Schedule />
-        <CallForPapers />
         <Organizers />
         <Sponsors />
       </main>
 
@@ -1,8 +1,12 @@
+import beenImage from '../../img/been.png';
 import bowenImage from '../../img/bowen.jpg';
 import boyuanImage from '../../img/boyuan.jpg';
+import jentseImage from '../../img/jentse.jpg';
 import kaiserImage from '../../img/kaiser.jpg';
 import katherineImage from '../../img/katherine.jpg';
+import kunImage from '../../img/kun.jpg';
 import marcImage from '../../img/marc.jpg';
+import nancyImage from '../../img/nancy.jpg';
 
 export const AVATAR_TYPE = Object.freeze({
   LOCAL: 'local',
@@ -13,6 +17,7 @@ export const AVATAR_TYPE = Object.freeze({
 export const PERSON_ROLE = Object.freeze({
   SPEAKER: 'speaker',
   ORGANIZER: 'organizer',
+  ADVISOR: 'advisor',
 });
 
 const people = [
@@ -41,13 +46,13 @@ const people = [
     },
   },
   {
-    id: 'bowen-baker',
+    id: 'been-kim',
     roles: [PERSON_ROLE.SPEAKER],
-    name: 'Bowen Baker',
-    url: 'https://bowenbaker.github.io/',
-    affiliation: 'OpenAI',
-    focus: 'Multi-Agent Systems',
-    avatar: { type: AVATAR_TYPE.LOCAL, src: bowenImage },
+    name: 'Been Kim',
+    url: 'https://beenkim.github.io/',
+    affiliation: 'Google DeepMind',
+    focus: 'Agentic Interpretability',
+    avatar: { type: AVATAR_TYPE.LOCAL, src: beenImage },
   },
   {
     id: 'marc-alexandre-cote',
@@ -58,6 +63,15 @@ const people = [
     focus: 'RL & Language Agents',
     avatar: { type: AVATAR_TYPE.LOCAL, src: marcImage },
   },
+  {
+    id: 'bowen-baker',
+    roles: [PERSON_ROLE.SPEAKER],
+    name: 'Bowen Baker',
+    url: 'https://bowenbaker.github.io/',
+    affiliation: 'OpenAI',
+    focus: 'Multi-Agent Systems',
+    avatar: { type: AVATAR_TYPE.LOCAL, src: bowenImage },
+  },
   {
     id: 'dinh-phung',
     roles: [PERSON_ROLE.SPEAKER],
@@ -70,15 +84,23 @@ const people = [
       src: 'https://dinhphung.com/uploads/Main/HomePage/dinh_profile.jpg',
     },
   },
+  {
+    id: 'kun-zhang',
+    roles: [PERSON_ROLE.SPEAKER],
+    name: 'Kun Zhang',
+    url: 'https://www.andrew.cmu.edu/user/kunz1/index.html',
+    affiliation: 'Carnegie Mellon University & MBZUAI',
+    focus: 'Causal Discovery',
+    avatar: { type: AVATAR_TYPE.LOCAL, src: kunImage },
+  },
   {
     id: 'nancy-f-chen',
     roles: [PERSON_ROLE.SPEAKER],
     name: 'Nancy F. Chen',
     url: 'https://sites.google.com/site/nancyfchen/bio',
-    affiliation: 'A*STAR',
+    affiliation: 'A*STAR Singapore',
     focus: 'Multimodal Generative AI',
-    note: 'Tentative speaker · In-person or online attendance TBD',
-    avatar: { type: AVATAR_TYPE.INITIALS, value: 'NC' },
+    avatar: { type: AVATAR_TYPE.LOCAL, src: nancyImage },
   },
   {
     id: 'jie-sophia-gao',
@@ -167,6 +189,39 @@ const people = [
       src: 'https://hoirqrkdgbmvpwutwuwj.supabase.co/storage/v1/object/public/assets/assets/8dd39412-d3c3-40bb-9209-be3a78a93ae1_800w.png',
     },
   },
+  {
+    id: 'jen-tse-huang',
+    roles: [PERSON_ROLE.ORGANIZER],
+    name: 'Jen-tse Huang',
+    url: 'https://penguinnnnn.github.io/',
+    affiliation: 'Johns Hopkins University',
+    focus: 'Human-AI Alignment',
+    avatar: { type: AVATAR_TYPE.LOCAL, src: jentseImage },
+  },
+  {
+    id: 'ziang-xiao',
+    roles: [PERSON_ROLE.ADVISOR],
+    name: 'Ziang Xiao',
+    url: 'https://www.cs.jhu.edu/faculty/ziang-xiao/',
+    affiliation: 'Johns Hopkins University',
+    focus: 'Human-AI Interaction',
+    avatar: {
+      type: AVATAR_TYPE.REMOTE,
+      src: 'https://www.cs.jhu.edu/wp-content/uploads/2022/11/Ziang-Xiao-square-1.jpeg',
+    },
+  },
+  {
+    id: 'toby-jia-jun-li',
+    roles: [PERSON_ROLE.ADVISOR],
+    name: 'Toby Jia-Jun Li',
+    url: 'https://toby.li/',
+    affiliation: 'University of Notre Dame',
+    focus: 'Human-Centered AI',
+    avatar: {
+      type: AVATAR_TYPE.REMOTE,
+      src: 'https://toby.li/images/toby_profile.jpg',
+    },
+  },
 ];
 
 const avatarTypes = new Set(Object.values(AVATAR_TYPE));