File size: 15,963 Bytes
56d40a2
 
c417f2d
 
 
 
 
9243cff
 
 
c417f2d
 
 
9243cff
 
 
 
 
 
 
c417f2d
9243cff
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
c417f2d
9243cff
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
c417f2d
 
9243cff
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
c417f2d
 
9243cff
 
 
 
 
 
 
 
 
 
 
 
c417f2d
9243cff
 
 
 
 
 
 
 
 
 
 
 
c417f2d
 
9243cff
 
 
 
 
 
 
 
 
 
 
 
 
 
c417f2d
 
733e57b
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
9243cff
 
c417f2d
9243cff
 
 
 
 
 
 
 
 
 
 
 
 
 
 
c417f2d
9243cff
 
 
 
 
 
 
 
 
 
 
 
 
c417f2d
 
9243cff
 
c417f2d
18dce59
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
9243cff
 
 
 
 
 
 
 
 
 
 
c417f2d
 
9243cff
 
c417f2d
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
"use client"

import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"
import { Badge } from "@/components/ui/badge"
import { Separator } from "@/components/ui/separator"
import { Button } from "@/components/ui/button"
import Link from "next/link"
import { ExternalLink } from "lucide-react"
import { Navigation } from "@/components/navigation"
import { PageHeader } from "@/components/page-header"

export default function AboutPage() {
  return (
    <div className="min-h-screen bg-background">
      <Navigation />
      
      <PageHeader 
        title="About AI Evaluation Dashboard"
        description="A comprehensive platform for documenting and sharing AI system evaluations with transparency and rigor."
      />

      <div className="container mx-auto px-4 sm:px-6 py-6 max-w-4xl">
        <div className="grid gap-6">
          <Card>
            <CardHeader>
              <CardTitle>Project Goals</CardTitle>
              <CardDescription>
                Our mission is to advance responsible AI development through transparent evaluation
              </CardDescription>
            </CardHeader>
            <CardContent className="space-y-4">
              <div className="grid gap-3">
                <div className="flex items-start gap-3">
                  <div className="w-2 h-2 bg-primary rounded-full mt-2 flex-shrink-0" />
                  <div>
                    <h4 className="font-medium">Comprehensive Evaluation Framework</h4>
                    <p className="text-sm text-muted-foreground">
                      Support structured evaluation across 20+ categories covering capabilities and risks
                    </p>
                  </div>
                </div>
                <div className="flex items-start gap-3">
                  <div className="w-2 h-2 bg-primary rounded-full mt-2 flex-shrink-0" />
                  <div>
                    <h4 className="font-medium">Transparency & Accountability</h4>
                    <p className="text-sm text-muted-foreground">
                      Promote open documentation of AI system capabilities, limitations, and risks
                    </p>
                  </div>
                </div>
                <div className="flex items-start gap-3">
                  <div className="w-2 h-2 bg-primary rounded-full mt-2 flex-shrink-0" />
                  <div>
                    <h4 className="font-medium">Industry Standards</h4>
                    <p className="text-sm text-muted-foreground">
                      Facilitate adoption of consistent evaluation practices across organizations
                    </p>
                  </div>
                </div>
              </div>
            </CardContent>
          </Card>

          <Card>
            <CardHeader>
              <CardTitle>Key Features</CardTitle>
              <CardDescription>
                Tools and capabilities that support comprehensive AI evaluation
              </CardDescription>
            </CardHeader>
            <CardContent>
              <div className="grid gap-4 sm:grid-cols-2">
                <div className="space-y-2">
                  <Badge variant="secondary" className="mb-2">Evaluation</Badge>
                  <ul className="space-y-1 text-sm">
                    <li>• Structured evaluation forms</li>
                    <li>• Multi-modal system support</li>
                    <li>• Evidence-based assessments</li>
                    <li>• Category-specific questions</li>
                  </ul>
                </div>
                <div className="space-y-2">
                  <Badge variant="secondary" className="mb-2">Analytics</Badge>
                  <ul className="space-y-1 text-sm">
                    <li>• Completeness tracking</li>
                    <li>• Performance benchmarking</li>
                    <li>• Risk area identification</li>
                    <li>• Comparative analysis</li>
                  </ul>
                </div>
                <div className="space-y-2">
                  <Badge variant="secondary" className="mb-2">Documentation</Badge>
                  <ul className="space-y-1 text-sm">
                    <li>• Standardized reporting</li>
                    <li>• Evidence management</li>
                    <li>• Version tracking</li>
                    <li>• Export capabilities</li>
                  </ul>
                </div>
                <div className="space-y-2">
                  <Badge variant="secondary" className="mb-2">Collaboration</Badge>
                  <ul className="space-y-1 text-sm">
                    <li>• Team evaluation workflows</li>
                    <li>• Review processes</li>
                    <li>• Stakeholder engagement</li>
                    <li>• Public transparency</li>
                  </ul>
                </div>
              </div>
            </CardContent>
          </Card>

          <Card>
            <CardHeader>
              <CardTitle>Evaluation Categories</CardTitle>
              <CardDescription>
                Comprehensive coverage across capabilities and risk areas
              </CardDescription>
            </CardHeader>
            <CardContent>
              <div className="grid gap-6 sm:grid-cols-2">
                <div>
                  <h4 className="font-medium mb-3 text-primary">Capability Areas</h4>
                  <div className="flex flex-wrap gap-2">
                    <Badge variant="outline">Language Communication</Badge>
                    <Badge variant="outline">Problem Solving</Badge>
                    <Badge variant="outline">Creativity Innovation</Badge>
                    <Badge variant="outline">Learning Memory</Badge>
                    <Badge variant="outline">Social Intelligence</Badge>
                    <Badge variant="outline">Perception Vision</Badge>
                    <Badge variant="outline">Physical Manipulation</Badge>
                    <Badge variant="outline">Metacognition</Badge>
                    <Badge variant="outline">Robotic Intelligence</Badge>
                  </div>
                </div>
                <div>
                  <h4 className="font-medium mb-3 text-destructive">Risk Areas</h4>
                  <div className="flex flex-wrap gap-2">
                    <Badge variant="outline">Harmful Content</Badge>
                    <Badge variant="outline">Information Integrity</Badge>
                    <Badge variant="outline">Privacy Data</Badge>
                    <Badge variant="outline">Bias Fairness</Badge>
                    <Badge variant="outline">Security Robustness</Badge>
                    <Badge variant="outline">Dangerous Capabilities</Badge>
                    <Badge variant="outline">Human AI Interaction</Badge>
                    <Badge variant="outline">Environmental Impact</Badge>
                    <Badge variant="outline">Economic Displacement</Badge>
                    <Badge variant="outline">Governance Accountability</Badge>
                    <Badge variant="outline">Value Chain</Badge>
                  </div>
                </div>
              </div>
              
              <Separator className="my-6" />
              
              <div className="space-y-4">
                <h4 className="font-medium text-foreground">Taxonomy Sources</h4>
                <p className="text-sm text-muted-foreground">
                  Our evaluation framework builds upon established research and industry standards:
                </p>
                <div className="grid gap-3 sm:grid-cols-2">
                  <div className="flex items-start gap-3 p-3 border rounded-lg">
                    <ExternalLink className="h-4 w-4 text-muted-foreground mt-0.5 flex-shrink-0" />
                    <div>
                      <h5 className="font-medium text-sm">OECD AI Capability Indicators</h5>
                      <p className="text-xs text-muted-foreground mb-2">
                        OECD framework for AI capabilities assessment and evaluation
                      </p>
                      <Link 
                        href="https://www.oecd.org/en/publications/introducing-the-oecd-ai-capability-indicators_be745f04-en.html" 
                        target="_blank"
                        className="text-xs text-primary hover:underline"
                      >
                        oecd.org/ai-capability-indicators
                      </Link>
                    </div>
                  </div>
                  <div className="flex items-start gap-3 p-3 border rounded-lg">
                    <ExternalLink className="h-4 w-4 text-muted-foreground mt-0.5 flex-shrink-0" />
                    <div>
                      <h5 className="font-medium text-sm">NIST AI Risk Management Framework</h5>
                      <p className="text-xs text-muted-foreground mb-2">
                        NIST framework for identifying and managing AI risks
                      </p>
                      <Link 
                        href="https://nvlpubs.nist.gov/nistpubs/ai/NIST.AI.600-1.pdf" 
                        target="_blank"
                        className="text-xs text-primary hover:underline"
                      >
                        nvlpubs.nist.gov/NIST.AI.600-1.pdf
                      </Link>
                    </div>
                  </div>
                </div>
              </div>
            </CardContent>
          </Card>

          <Card>
            <CardHeader>
              <CardTitle>Getting Started</CardTitle>
              <CardDescription>
                Begin evaluating AI systems with our structured approach
              </CardDescription>
            </CardHeader>
            <CardContent className="space-y-4">
              <div className="grid gap-4 sm:grid-cols-3">
                <div className="text-center p-4 border rounded-lg">
                  <div className="w-8 h-8 bg-primary text-primary-foreground rounded-full flex items-center justify-center mx-auto mb-2 text-sm font-bold">
                    1
                  </div>
                  <h4 className="font-medium mb-1">Create Evaluation</h4>
                  <p className="text-xs text-muted-foreground">Start a new evaluation for your AI system</p>
                </div>
                <div className="text-center p-4 border rounded-lg">
                  <div className="w-8 h-8 bg-primary text-primary-foreground rounded-full flex items-center justify-center mx-auto mb-2 text-sm font-bold">
                    2
                  </div>
                  <h4 className="font-medium mb-1">Complete Assessment</h4>
                  <p className="text-xs text-muted-foreground">Answer questions across relevant categories</p>
                </div>
                <div className="text-center p-4 border rounded-lg">
                  <div className="w-8 h-8 bg-primary text-primary-foreground rounded-full flex items-center justify-center mx-auto mb-2 text-sm font-bold">
                    3
                  </div>
                  <h4 className="font-medium mb-1">Review & Share</h4>
                  <p className="text-xs text-muted-foreground">Analyze results and share with stakeholders</p>
                </div>
              </div>
            </CardContent>
          </Card>

          <Card>
            <CardHeader>
              <CardTitle>Contributions & Open Data</CardTitle>
              <CardDescription>
                Explore our open-source evaluation framework and example datasets
              </CardDescription>
            </CardHeader>
            <CardContent className="space-y-4">
              <div className="grid gap-4 sm:grid-cols-2">
                <div className="flex items-start gap-3 p-4 border rounded-lg">
                  <div className="w-8 h-8 bg-blue-100 dark:bg-blue-900 rounded-lg flex items-center justify-center flex-shrink-0">
                    <svg className="w-4 h-4 text-blue-600 dark:text-blue-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                      <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
                    </svg>
                  </div>
                  <div>
                    <h4 className="font-medium mb-2">Evaluation Schema</h4>
                    <p className="text-sm text-muted-foreground mb-3">
                      Access our complete evaluation framework including category definitions, question sets, and validation schemas.
                    </p>
                    <Link 
                      href="https://huggingface.co/spaces/evaleval/general-eval-card/tree/main/schema" 
                      target="_blank" 
                      className="inline-flex items-center gap-1 text-sm text-primary hover:underline"
                    >
                      View on Hugging Face
                      <ExternalLink className="h-3 w-3" />
                    </Link>
                  </div>
                </div>
                
                <div className="flex items-start gap-3 p-4 border rounded-lg">
                  <div className="w-8 h-8 bg-green-100 dark:bg-green-900 rounded-lg flex items-center justify-center flex-shrink-0">
                    <svg className="w-4 h-4 text-green-600 dark:text-green-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                      <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M3 7v10a2 2 0 002 2h14a2 2 0 002-2V9a2 2 0 00-2-2H5a2 2 0 00-2-2z" />
                      <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M8 5a2 2 0 012-2h4a2 2 0 012 2v10a2 2 0 01-2 2H10a2 2 0 01-2-2V5z" />
                    </svg>
                  </div>
                  <div>
                    <h4 className="font-medium mb-2">Example Evaluations</h4>
                    <p className="text-sm text-muted-foreground mb-3">
                      Explore completed evaluation examples from leading AI systems to understand the evaluation process.
                    </p>
                    <Link 
                      href="https://huggingface.co/spaces/evaleval/general-eval-card/tree/main/public/evaluations" 
                      target="_blank" 
                      className="inline-flex items-center gap-1 text-sm text-primary hover:underline"
                    >
                      View on Hugging Face
                      <ExternalLink className="h-3 w-3" />
                    </Link>
                  </div>
                </div>
              </div>
              
              <div className="bg-muted/50 p-4 rounded-lg">
                <h5 className="font-medium mb-2 text-sm">Contribute to the Framework</h5>
                <p className="text-xs text-muted-foreground">
                  Our evaluation framework is open for community contributions. Use these schemas and examples to create your own evaluations, 
                  or contribute improvements to help advance AI transparency and accountability standards.
                </p>
              </div>
            </CardContent>
          </Card>

          <Separator />

          <div className="text-center space-y-4">
            <h3 className="text-lg font-semibold">Ready to get started?</h3>
            <p className="text-muted-foreground">
              Create your first evaluation card and begin documenting your AI system's capabilities and risks.
            </p>
            <Link href="/">
              <Button size="lg" className="gap-2">
                Start Evaluating
                <ExternalLink className="h-4 w-4" />
              </Button>
            </Link>
          </div>
        </div>
      </div>
    </div>
  )
}