this repo has no description
add bellairs.quest HTML
+1307
+234
site/index.html
+234
site/index.html
···
1
+
<!DOCTYPE html>
2
+
<html lang="en">
3
+
<head>
4
+
<meta charset="UTF-8">
5
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+
<title>A Human Approach to Computational Science</title>
7
+
<link rel="stylesheet" href="styles.css">
8
+
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
9
+
</head>
10
+
<body>
11
+
<header>
12
+
<nav>
13
+
<div class="logo">The Bellairs Manifesto</div>
14
+
<div class="nav-container">
15
+
<ul class="main-nav">
16
+
<li><a href="#manifesto">Manifesto</a></li>
17
+
<li><a href="#usecases">Actions</a></li>
18
+
<li><a href="#timeline">Timeline</a></li>
19
+
<li><a href="#about">About</a></li>
20
+
</ul>
21
+
<ul class="social-nav">
22
+
<li class="social-icon"><a href="https://matrix.to/#/#bellairs-discuss:recoil.org" target="_blank" aria-label="Matrix">
23
+
<img src="matrix-icon.svg" alt="Matrix" width="20" height="20" class="matrix-icon">
24
+
</a></li>
25
+
<li class="social-icon"><a href="https://bsky.app/profile/bellairs.quest" target="_blank" aria-label="Bluesky">
26
+
<img src="bluesky-icon.svg" alt="Bluesky" width="20" height="20" class="bsky-icon">
27
+
</a></li>
28
+
</ul>
29
+
</div>
30
+
</nav>
31
+
</header>
32
+
33
+
<section id="hero">
34
+
<div class="container">
35
+
<h2>A Human Approach to Computational Science</h2>
36
+
<p class="byline">Our vision is a world where everybody can access tools to explore, participate in and benefit from computational science.</p>
37
+
<a href="#manifesto" class="cta-button">Read the Manifesto</a>
38
+
</div>
39
+
</section>
40
+
41
+
<section id="manifesto">
42
+
<div class="container">
43
+
<h2>Manifesto</h2>
44
+
<div class="byline">March 2025 Participants: <a href="https://anil.recoil.org" target="_blank">Anil Madhavapeddy</a>, <a href="https://www.cs.cornell.edu/~jnfoster/" target="_blank">Nate Foster</a>, <a href="https://cs.nyu.edu/~apanda/" target="_blank">Aurojit Panda</a>, <a href="https://cseweb.ucsd.edu/~mcoblenz/" target="_blank">Michael Coblenz</a>, <a href="https://www.cst.cam.ac.uk/people/mte24" target="_blank">Mark Elvers</a>, <a href="https://gazagnaire.org" target="_blank">Thomas Gazagnaire</a>, <a href="https://web.eecs.umich.edu/~comar/" target="_blank">Cyrus Omar</a>, <a href="https://www.jonmsterling.com" target="_blank">Jonathan Sterling</a>, <a href="https://www.ianbrown.tech" target="_blank">Ian Brown</a>, and <a href="#about">more signing up</a> since.</div>
45
+
46
+
<p><a href="https://en.wikipedia.org/wiki/Computational_science">Computational science</a> uses large-scale computation and data to gain insights into how to solve complex physical problems ranging from the microscopic to the planetary scale. The legitimacy of computational science emerges from a continuous process of hypothesising, experimentation and recombination of code across these datasets.</p>
47
+
<p>We've asked ourselves how we might recenter science on the numerous people involved in this process, and so propose the following first set of principles to start the conversation. We <a href="#about">invite</a> interested people to join our exploration.</p>
48
+
49
+
<div class="principle">
50
+
<h3>1. Rehumanising science for all</h3>
51
+
<p>Science is a human endeavor shaped by contributions from many individuals, and scientific insights stem from and flow through people. All stakeholders, such as academics, curators, traditional knowledge holders, journalists, reviewers, policymakers, and citizens, should be included in and benefit from the process. Scientific digital infrastructure therefore exists to both support inquisitive exploration and also to distribute the benefits of evidence-driven actions across society.</p>
52
+
</div>
53
+
54
+
<div class="principle">
55
+
<h3>2. Melding institutions and crowds</h3>
56
+
<p>Opening the door to public participation in the scientific discourse means broadening access to data and the skills required to analyse it. Today, large institutions play the important role of bringing together researchers under one roof, but emerging digital infrastructure promises new opportunities for participation across institutional and geographic boundaries. We aim to decouple access to the tools for science from institutional affiliation, and thus reduce the barrier to meaningful participation.</p>
57
+
</div>
58
+
59
+
<div class="principle">
60
+
<h3>3. Supporting positive scientific feedback loops</h3>
61
+
<p>Academics, journalists, and politicians all collaborating effectively across their specialisms results in maximal return on investments in science. We aim to empower creators to disseminate datasets towards the accumulation of reliable evidence and to reduce ongoing maintenance costs. By tracking positive outcomes, we seek to incentivize the responsible, ongoing curation of datasets.</p>
62
+
</div>
63
+
64
+
<p>Modern computational science should leverage both traditional and community-centered sources of insights and data, and enable such groups to take full advantage of digital resources. We want to develop these in an open and collaborative process that follows the principles above. We <a href="#about">invite</a> you to work with us!</p>
65
+
66
+
67
+
<blockquote>"Our vision is a world where everybody can access tools to explore, participate in and benefit from computational science."</blockquote>
68
+
</div>
69
+
70
+
71
+
72
+
</section>
73
+
74
+
<section id="usecases">
75
+
<div class="container">
76
+
<h2>Reinforcing Use Cases</h2>
77
+
<p>We are identifying use cases that can be used to help design and iterate on systems towards implementing our manifesto. The use cases are intended to represent needs that different kinds of scientists have. There will be many other additional use cases to bring to light concerns that may not be represented here. Please consider contributing yours!</p>
78
+
79
+
<div class="usecase">
80
+
<h3>1. Conservation and sensing</h3>
81
+
<p>Some large-scale research projects require acquiring, aggregating, manipulating, analyzing, and reporting on a multitude of data sets. Sometimes, the outputs may even connect to real-time systems, such as data dashboards or sensor networks, which need to be configured as a result of the analysis.</p>
82
+
<p>We explore how to balance open science with necessary privacy for sensitive ecological data.</p>
83
+
<p class="investigators"><strong>Investigators:</strong> <a href="https://cseweb.ucsd.edu/~mcoblenz/" target="_blank">Michael Coblenz</a>, <a href="https://anil.recoil.org" target="_blank">Anil Madhavapeddy</a>, <a href="https://web.eecs.umich.edu/~comar/" target="_blank">Cyrus Omar</a></p>
84
+
<p><a href="usecase-conservation.html" class="cta-button">Read More</a></p>
85
+
</div>
86
+
87
+
<div class="usecase">
88
+
<h3>2. Breaking Specialist Training out of the University</h3>
89
+
<p>Meaningful participation in important scientific discourses requires specialist knowledge, but access to specialized training is currently centralized in universities and gated behind tuition fees and time barriers.</p>
90
+
<p>We aim to build sustainable infrastructure for a decentralized network of publicly accessible courseware.</p>
91
+
<p class="investigators"><strong>Investigators:</strong> <a href="https://www.jonmsterling.com" target="_blank">Jonathan Sterling</a>, <a href="https://anil.recoil.org" target="_blank">Anil Madhavapeddy</a></p>
92
+
<p><a href="usecase-training.html" class="cta-button">Read More</a></p>
93
+
</div>
94
+
95
+
<div class="usecase">
96
+
<h3>3. Collaboration in the Small</h3>
97
+
<p>Many research projects require inputs from other researchers, including those in different areas. Finding, using, and extending other researchers' digital artifacts is challenging today.</p>
98
+
<p>We're developing systems to make it easier to discover digital artifacts, track contributions, and reduce friction for sharing between research groups.</p>
99
+
<p class="investigators"><strong>Investigators:</strong> <a href="https://cseweb.ucsd.edu/~mcoblenz/" target="_blank">Michael Coblenz</a></p>
100
+
<p><a href="usecase-collaboration.html" class="cta-button">Read More</a></p>
101
+
</div>
102
+
</div>
103
+
</section>
104
+
105
+
<section id="timeline">
106
+
<div class="container">
107
+
<h2>Timeline</h2>
108
+
<div class="timeline-separator">
109
+
<span>Upcoming Events</span>
110
+
</div>
111
+
<div class="timeline">
112
+
<div class="timeline-item future">
113
+
<div class="timeline-date">October 2025</div>
114
+
<div class="timeline-content">
115
+
<p><a href="https://conf.researchr.org/home/icfp-splash-2025/propl-2025" target="_blank">Programming for the Planet</a> (PROPL) will bring us together again to refine the manifesto and continue designing our systems for decentralised science.</p>
116
+
</div>
117
+
</div>
118
+
</div>
119
+
<div class="timeline-separator">
120
+
<span>Past Events</span>
121
+
</div>
122
+
<div class="timeline">
123
+
<div class="timeline-item">
124
+
<div class="timeline-date">March 2025</div>
125
+
<div class="timeline-content">
126
+
<p>We held the Bellairs research summit on planetary computing, where we launched the first version of the manifesto towards human computational science.</p>
127
+
</div>
128
+
</div>
129
+
<div class="timeline-item">
130
+
<div class="timeline-date">March 2025</div>
131
+
<div class="timeline-content">
132
+
<p><a href="https://www.jonmsterling.com" target="_blank">Jon Sterling</a> publishes the <a href="https://www.forester-notes.org/OYOJ.xml" target="_blank">Forester 5.0</a> design for global identity.</p>
133
+
</div>
134
+
</div>
135
+
<div class="timeline-item">
136
+
<div class="timeline-date">February 2025</div>
137
+
<div class="timeline-content">
138
+
<p><a href="https://www.ianbrown.tech" target="_blank">Ian Brown</a> contrasts <a href="https://www.ianbrown.tech/2025/02/18/fleeing-the-hellsite-mastodon-vs-bluesky/" target="_blank">Mastodon vs BlueSky</a> in a deep-dive of their architectures.</p>
139
+
</div>
140
+
</div>
141
+
<div class="timeline-item">
142
+
<div class="timeline-date">January 2025</div>
143
+
<div class="timeline-content">
144
+
<p><a href="https://gazagnaire.org" target="_blank">Thomas Gazagnaire</a> launches <a href="https://parsimoni.co/blog/2025-02-11-parsimoni-to-demonstrate-its-spaceos-in-orbit-on-clustergate-1.html" target="_blank">SpaceOS</a> to perform scientific computation in orbit.</p>
145
+
</div>
146
+
</div>
147
+
<div class="timeline-item">
148
+
<div class="timeline-date">September 2024</div>
149
+
<div class="timeline-content">
150
+
<p><a href="https://www.cst.cam.ac.uk/people/mte24" target="_blank">Mark Elvers</a> operates the first capability-based <a href="https://tarides.com/blog/2023-08-02-obuilder-on-macos/" target="_blank">distributed build platform</a> for open source software.</p>
151
+
</div>
152
+
</div>
153
+
<div class="timeline-item">
154
+
<div class="timeline-date">August 2024</div>
155
+
<div class="timeline-content">
156
+
<p><a href="https://cs.nyu.edu/~apanda/" target="_blank">Aurojit Panda</a> rethinks the <a href="https://cs.nyu.edu/~apanda/assets/papers/ie-sigcomm24.pdf" target="_blank">architecture of edge Internet services</a> to bring back end-to-end simplicity.</p>
157
+
</div>
158
+
</div>
159
+
<div class="timeline-item">
160
+
<div class="timeline-date">April 2024</div>
161
+
<div class="timeline-content">
162
+
<p><a href="https://cseweb.ucsd.edu/~mcoblenz/" target="_blank">Michael Coblenz</a> designs a <a href="https://dl.acm.org/doi/10.1145/3597503.3639139" target="_blank">theory of scientific programming efficacy</a>.</p>
163
+
</div>
164
+
</div>
165
+
<div class="timeline-item">
166
+
<div class="timeline-date">March 2024</div>
167
+
<div class="timeline-content">
168
+
<p><a href="https://web.eecs.umich.edu/~comar/" target="_blank">Cyrus Omar</a> talks about <a href="https://watch.eeg.cl.cam.ac.uk/w/3nGExywoVm6XFRBA2zYxSL" target="_blank">building live programming interfaces for planetary computing</a> at <a href="https://propl.dev" target="_blank">PROPL 2024</a>.</p>
169
+
</div>
170
+
</div>
171
+
<div class="timeline-item">
172
+
<div class="timeline-date">February 2024</div>
173
+
<div class="timeline-content">
174
+
<p><a href="https://anil.recoil.org" target="_blank">Anil Madhavapeddy</a> makes the case for <a href="https://arxiv.org/pdf/2303.04501" target="_blank">planetary computing for data-driven environmental policy-making</a> to handle the ingestion, transformation, analysis and publication of environmental data products.</p>
175
+
</div>
176
+
</div>
177
+
<div class="timeline-item">
178
+
<div class="timeline-date">August 2023</div>
179
+
<div class="timeline-content">
180
+
<p><a href="https://www.cs.cornell.edu/~jnfoster/" target="_blank">Nate Foster</a> considers how programming languages might help to <a href="https://yjolt.org/programming-language-future-interests" target="_blank">capture property conveyancing</a>, sparking an interest in the legal applications of ownership.</p>
181
+
</div>
182
+
</div>
183
+
</div>
184
+
</div>
185
+
</section>
186
+
187
+
<section id="about">
188
+
<div class="container">
189
+
<h2>About</h2>
190
+
<h3>Participants</h3>
191
+
<div class="participants">
192
+
<ul>
193
+
<li class="original"><a href="https://anil.recoil.org" target="_blank">Anil Madhavapeddy</a></li>
194
+
<li class="original"><a href="https://www.cs.cornell.edu/~jnfoster/" target="_blank">Nate Foster</a></li>
195
+
<li class="original"><a href="https://cs.nyu.edu/~apanda/" target="_blank">Aurojit Panda</a></li>
196
+
<li class="original"><a href="https://cseweb.ucsd.edu/~mcoblenz/" target="_blank">Michael Coblenz</a></li>
197
+
<li class="original"><a href="https://www.cst.cam.ac.uk/people/mte24" target="_blank">Mark Elvers</a></li>
198
+
<li class="original"><a href="https://gazagnaire.org" target="_blank">Thomas Gazagnaire</a></li>
199
+
<li class="original"><a href="https://web.eecs.umich.edu/~comar/" target="_blank">Cyrus Omar</a></li>
200
+
<li class="original"><a href="https://www.jonmsterling.com" target="_blank">Jonathan Sterling</a></li>
201
+
<li class="original"><a href="https://www.ianbrown.tech" target="_blank">Ian Brown</a></li>
202
+
<li><a href="https://dorchard.github.io" target="_blank">Dominic Orchard</a></li>
203
+
<li><a href="https://profiles.imperial.ac.uk/h.haddadi" target="_blank">Hamed Haddadi</a></li>
204
+
<li><a href="https://www.cst.cam.ac.uk/people/jac22" target="_blank">Jon Crowcroft</a></li>
205
+
<li><a href="https://dynamicaspects.org/research/" target="_blank">Roly Perera</a></li>
206
+
<li><a href="https://www.cst.cam.ac.uk/people/efs20" target="_blank">Emily Shuckburgh</a></li>
207
+
<li><a href="https://www.cfse.cam.ac.uk/directory/marla_fuchs" target="_blank">Marla Fuchs</a></li>
208
+
</ul>
209
+
</div>
210
+
211
+
<h3>Join the Conversation</h3>
212
+
<p>We'd love to have you on board as well; we recognise that we need lots of input and participation from diverse stakeholders across disciplines, and so we invite you to join our exploration and contribute to this open collaboration. Just get in touch with any of the participants above and we can add you to the list above. We're using Matrix to stay connected as well.</p>
213
+
<div class="social-links">
214
+
<a href="https://matrix.to/#/#bellairs-discuss:recoil.org" class="matrix-link">
215
+
<img src="matrix-icon.svg" alt="Matrix" width="20" height="20" class="matrix-icon">
216
+
Join our Matrix Channel
217
+
</a>
218
+
<a href="https://bsky.app/profile/bellairs.quest" target="_blank" class="bluesky-link">
219
+
<img src="bluesky-icon.svg" alt="Bluesky" width="20" height="20" class="bsky-icon">
220
+
Follow on Bluesky
221
+
</a>
222
+
</div>
223
+
</div>
224
+
</section>
225
+
226
+
<footer>
227
+
<div class="container">
228
+
<p class="disclaimer">© 2025 in the public domain. This site is not directly affiliated with the <a href="https://www.mcgill.ca/bellairs/" target="_blank">Bellairs Research Institute</a>, but we are grateful to them for hosting our research symposium that made this manifesto possible.</p>
229
+
</div>
230
+
</footer>
231
+
232
+
<script src="scripts.js"></script>
233
+
</body>
234
+
</html>
+104
site/scripts.js
+104
site/scripts.js
···
1
+
document.addEventListener('DOMContentLoaded', function() {
2
+
// Smooth scrolling for navigation links
3
+
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
4
+
anchor.addEventListener('click', function(e) {
5
+
e.preventDefault();
6
+
7
+
document.querySelector(this.getAttribute('href')).scrollIntoView({
8
+
behavior: 'smooth'
9
+
});
10
+
});
11
+
});
12
+
13
+
// Add CSS for animations
14
+
const style = document.createElement('style');
15
+
style.textContent = `
16
+
.timeline-item {
17
+
opacity: 0;
18
+
transform: translateY(50px);
19
+
transition: opacity 0.6s ease, transform 0.6s ease;
20
+
}
21
+
22
+
.timeline-item.animate {
23
+
opacity: 1;
24
+
transform: translateY(0);
25
+
}
26
+
27
+
.timeline-item:nth-child(even) {
28
+
transform: translateY(50px);
29
+
}
30
+
31
+
.timeline-item:nth-child(even).animate {
32
+
transform: translateY(0);
33
+
}
34
+
35
+
.timeline-item:nth-child(1) {
36
+
transition-delay: 0.1s;
37
+
}
38
+
39
+
.timeline-item:nth-child(2) {
40
+
transition-delay: 0.2s;
41
+
}
42
+
43
+
.timeline-item:nth-child(3) {
44
+
transition-delay: 0.3s;
45
+
}
46
+
47
+
.timeline-item:nth-child(4) {
48
+
transition-delay: 0.4s;
49
+
}
50
+
51
+
.timeline-item:nth-child(5) {
52
+
transition-delay: 0.5s;
53
+
}
54
+
55
+
.timeline-item:nth-child(6) {
56
+
transition-delay: 0.6s;
57
+
}
58
+
`;
59
+
document.head.appendChild(style);
60
+
61
+
// Animate timeline elements on scroll
62
+
const timelineItems = document.querySelectorAll('.timeline-item');
63
+
64
+
function animateOnScroll() {
65
+
timelineItems.forEach(item => {
66
+
const itemPosition = item.getBoundingClientRect().top;
67
+
const screenPosition = window.innerHeight / 1.2;
68
+
69
+
if (itemPosition < screenPosition) {
70
+
item.classList.add('animate');
71
+
}
72
+
});
73
+
}
74
+
75
+
// Initial animation setup
76
+
setTimeout(() => {
77
+
animateOnScroll();
78
+
}, 300);
79
+
80
+
// Check on scroll
81
+
window.addEventListener('scroll', animateOnScroll);
82
+
83
+
// Function to add new timeline items
84
+
window.addTimelineItem = function(date, title, content) {
85
+
const timeline = document.querySelector('.timeline');
86
+
const timelineItem = document.createElement('div');
87
+
timelineItem.classList.add('timeline-item');
88
+
89
+
timelineItem.innerHTML = `
90
+
<div class="timeline-date">${date}</div>
91
+
<div class="timeline-content">
92
+
<h3>${title}</h3>
93
+
<p>${content}</p>
94
+
</div>
95
+
`;
96
+
97
+
timeline.appendChild(timelineItem);
98
+
99
+
// Update animation elements
100
+
setTimeout(() => {
101
+
animateOnScroll();
102
+
}, 100);
103
+
};
104
+
});
+792
site/styles.css
+792
site/styles.css
···
1
+
/* Base styles */
2
+
:root {
3
+
--primary-color: #3498db;
4
+
--og-color: #f3fffa;
5
+
--secondary-color: #2c3e50;
6
+
--accent-color: #e74c3c;
7
+
--light-color: #ecf0f1;
8
+
--dark-color: #2c3e50;
9
+
--text-color: #333;
10
+
--transition-speed: 0.3s;
11
+
}
12
+
13
+
* {
14
+
margin: 0;
15
+
padding: 0;
16
+
box-sizing: border-box;
17
+
}
18
+
19
+
html {
20
+
scroll-behavior: smooth;
21
+
}
22
+
23
+
body {
24
+
font-family: 'Helvetica Neue', Arial, sans-serif;
25
+
line-height: 1.6;
26
+
color: var(--text-color);
27
+
background-color: var(--light-color);
28
+
font-size: 18px; /* Increased base font size */
29
+
}
30
+
31
+
.container {
32
+
max-width: 1000px;
33
+
margin: 0 auto;
34
+
padding: 0 20px;
35
+
}
36
+
37
+
h1, h2, h3, h4 {
38
+
margin-bottom: 20px;
39
+
color: var(--secondary-color);
40
+
}
41
+
42
+
p {
43
+
margin-bottom: 20px;
44
+
font-size: 1.1rem; /* Larger paragraph text */
45
+
line-height: 1.8;
46
+
max-width: 100%;
47
+
}
48
+
49
+
a {
50
+
color: var(--primary-color);
51
+
text-decoration: none;
52
+
transition: all var(--transition-speed) ease;
53
+
}
54
+
55
+
a:hover {
56
+
color: var(--accent-color);
57
+
}
58
+
59
+
/* Navigation */
60
+
header {
61
+
background-color: var(--secondary-color);
62
+
position: fixed;
63
+
top: 0;
64
+
left: 0;
65
+
right: 0;
66
+
z-index: 1000;
67
+
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
68
+
}
69
+
70
+
nav {
71
+
display: flex;
72
+
justify-content: space-between;
73
+
align-items: center;
74
+
padding: 20px;
75
+
max-width: 1000px;
76
+
margin: 0 auto;
77
+
}
78
+
79
+
.logo {
80
+
color: white;
81
+
font-size: 1.5rem;
82
+
font-weight: bold;
83
+
}
84
+
85
+
.nav-container {
86
+
display: flex;
87
+
align-items: center;
88
+
}
89
+
90
+
nav ul {
91
+
display: flex;
92
+
list-style: none;
93
+
}
94
+
95
+
.main-nav {
96
+
margin-right: 30px;
97
+
}
98
+
99
+
.social-nav {
100
+
border-left: 1px solid rgba(255, 255, 255, 0.2);
101
+
padding-left: 20px;
102
+
}
103
+
104
+
nav ul li {
105
+
margin-left: 30px;
106
+
}
107
+
108
+
.main-nav li:first-child {
109
+
margin-left: 0;
110
+
}
111
+
112
+
nav ul li.social-icon {
113
+
margin-left: 15px;
114
+
}
115
+
116
+
.social-nav li:first-child {
117
+
margin-left: 0;
118
+
}
119
+
120
+
nav ul li a {
121
+
color: white;
122
+
position: relative;
123
+
}
124
+
125
+
nav ul li a:after {
126
+
content: '';
127
+
position: absolute;
128
+
width: 0;
129
+
height: 2px;
130
+
background: var(--accent-color);
131
+
bottom: -5px;
132
+
left: 0;
133
+
transition: width var(--transition-speed) ease;
134
+
}
135
+
136
+
nav ul li a:hover:after {
137
+
width: 100%;
138
+
}
139
+
140
+
/* Hero Section */
141
+
#hero {
142
+
background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
143
+
color: white;
144
+
text-align: center;
145
+
padding: 150px 20px 100px;
146
+
margin-top: 60px;
147
+
}
148
+
149
+
#hero h2 {
150
+
font-size: 3rem;
151
+
margin-bottom: 30px;
152
+
color: white;
153
+
line-height: 1.2;
154
+
max-width: 700px;
155
+
margin-left: auto;
156
+
margin-right: auto;
157
+
}
158
+
159
+
#hero .byline {
160
+
font-size: 1.5rem;
161
+
margin-bottom: 40px;
162
+
}
163
+
164
+
.cta-button {
165
+
display: inline-block;
166
+
background-color: var(--accent-color);
167
+
color: white;
168
+
padding: 15px 30px;
169
+
border-radius: 5px;
170
+
font-weight: bold;
171
+
transition: background-color var(--transition-speed) ease;
172
+
}
173
+
174
+
.cta-button:hover {
175
+
background-color: #c0392b;
176
+
color: white;
177
+
}
178
+
179
+
/* Section Styles */
180
+
section {
181
+
padding: 80px 0;
182
+
}
183
+
184
+
section h2 {
185
+
font-size: 2.5rem;
186
+
text-align: center;
187
+
margin-bottom: 50px;
188
+
position: relative;
189
+
}
190
+
191
+
section h2:after {
192
+
content: '';
193
+
position: absolute;
194
+
width: 100px;
195
+
height: 3px;
196
+
background-color: var(--accent-color);
197
+
bottom: -15px;
198
+
left: 50%;
199
+
transform: translateX(-50%);
200
+
}
201
+
202
+
/* Manifesto Section */
203
+
#manifesto {
204
+
background-color: white;
205
+
}
206
+
207
+
#manifesto .byline {
208
+
font-size: 1.2rem;
209
+
text-align: center;
210
+
margin-bottom: 30px;
211
+
}
212
+
213
+
#manifesto .byline a {
214
+
color: var(--primary-color);
215
+
text-decoration: none;
216
+
transition: color 0.3s ease;
217
+
}
218
+
219
+
#manifesto .byline a:hover {
220
+
color: var(--accent-color);
221
+
text-decoration: underline;
222
+
}
223
+
224
+
blockquote {
225
+
font-size: 1.5rem;
226
+
font-style: italic;
227
+
border-left: 5px solid var(--primary-color);
228
+
padding-left: 20px;
229
+
margin: 30px 0;
230
+
color: var(--primary-color);
231
+
}
232
+
233
+
.closing-quote {
234
+
text-align: center;
235
+
border-left: none;
236
+
padding: 25px 20px;
237
+
margin: 40px auto 20px;
238
+
max-width: 800px;
239
+
color: var(--accent-color);
240
+
font-weight: 400;
241
+
background-color: rgba(231, 76, 60, 0.05);
242
+
border-radius: 8px;
243
+
}
244
+
245
+
.principle {
246
+
margin-bottom: 40px;
247
+
padding: 20px;
248
+
border-radius: 5px;
249
+
background-color: rgba(236, 240, 241, 0.5);
250
+
transition: transform var(--transition-speed) ease;
251
+
}
252
+
253
+
.principle:hover {
254
+
transform: translateY(-5px);
255
+
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
256
+
}
257
+
258
+
.principle h3 {
259
+
color: var(--primary-color);
260
+
}
261
+
262
+
/* Use Cases Section */
263
+
#usecases {
264
+
background-color: #f9f9f9;
265
+
}
266
+
267
+
.usecase {
268
+
margin-bottom: 50px;
269
+
padding: 30px;
270
+
border-radius: 5px;
271
+
background-color: white;
272
+
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
273
+
transition: transform var(--transition-speed) ease;
274
+
}
275
+
276
+
.usecase:hover {
277
+
transform: translateY(-5px);
278
+
box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
279
+
}
280
+
281
+
.usecase h3 {
282
+
color: var(--primary-color);
283
+
margin-bottom: 15px;
284
+
}
285
+
286
+
.usecase ul {
287
+
margin-left: 20px;
288
+
margin-bottom: 20px;
289
+
}
290
+
291
+
.usecase .cta-button {
292
+
display: inline-block;
293
+
background-color: var(--primary-color);
294
+
color: white;
295
+
padding: 8px 20px;
296
+
border-radius: 5px;
297
+
font-weight: bold;
298
+
font-size: 0.9rem;
299
+
margin-top: 10px;
300
+
transition: background-color var(--transition-speed) ease;
301
+
}
302
+
303
+
.usecase .cta-button:hover {
304
+
background-color: var(--accent-color);
305
+
color: white;
306
+
text-decoration: none;
307
+
}
308
+
309
+
.investigators {
310
+
font-style: italic;
311
+
color: var(--primary-color);
312
+
border-top: 1px solid #eee;
313
+
padding-top: 10px;
314
+
margin-top: 15px;
315
+
}
316
+
317
+
/* Use Case Detail Page */
318
+
#usecase-detail {
319
+
background-color: #f9f9f9;
320
+
margin-top: 60px;
321
+
padding-top: 80px;
322
+
}
323
+
324
+
.back-link {
325
+
margin-top: 30px;
326
+
margin-bottom: 20px;
327
+
}
328
+
329
+
.back-link a {
330
+
display: inline-block;
331
+
color: var(--primary-color);
332
+
font-weight: 500;
333
+
transition: color var(--transition-speed) ease;
334
+
}
335
+
336
+
.back-link a:hover {
337
+
color: var(--accent-color);
338
+
text-decoration: underline;
339
+
}
340
+
341
+
.investigators a {
342
+
color: var(--primary-color);
343
+
text-decoration: none;
344
+
transition: color 0.3s ease;
345
+
}
346
+
347
+
.investigators a:hover {
348
+
color: var(--accent-color);
349
+
text-decoration: underline;
350
+
}
351
+
352
+
/* Timeline Section */
353
+
#timeline {
354
+
background-color: white;
355
+
padding-bottom: 100px;
356
+
}
357
+
358
+
.timeline-separator {
359
+
text-align: center;
360
+
position: relative;
361
+
margin: 30px auto 40px;
362
+
max-width: 800px;
363
+
}
364
+
365
+
.timeline-separator:before {
366
+
content: '';
367
+
position: absolute;
368
+
width: 100%;
369
+
height: 1px;
370
+
background-color: #e0e0e0;
371
+
top: 50%;
372
+
left: 0;
373
+
z-index: 1;
374
+
}
375
+
376
+
.timeline-separator span {
377
+
display: inline-block;
378
+
padding: 10px 20px;
379
+
background-color: white;
380
+
color: var(--secondary-color);
381
+
font-weight: bold;
382
+
position: relative;
383
+
z-index: 2;
384
+
border-radius: 20px;
385
+
box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
386
+
font-size: 1.1rem;
387
+
}
388
+
389
+
.timeline-separator:first-of-type span {
390
+
color: #27ae60;
391
+
box-shadow: 0 3px 10px rgba(39, 174, 96, 0.15);
392
+
}
393
+
394
+
.timeline {
395
+
position: relative;
396
+
max-width: 800px;
397
+
margin: 0 auto;
398
+
}
399
+
400
+
.timeline:before {
401
+
content: '';
402
+
position: absolute;
403
+
top: 0;
404
+
bottom: 0;
405
+
left: 50%;
406
+
width: 4px;
407
+
background: linear-gradient(to bottom, var(--primary-color), var(--accent-color));
408
+
transform: translateX(-50%);
409
+
border-radius: 4px;
410
+
}
411
+
412
+
.timeline-item.future:after {
413
+
border-color: #27ae60;
414
+
border-width: 3px;
415
+
}
416
+
417
+
.timeline-item.future .timeline-content {
418
+
background-color: #f9fffc;
419
+
box-shadow: 0 5px 25px rgba(39, 174, 96, 0.15);
420
+
}
421
+
422
+
.timeline-item.future .timeline-content:before {
423
+
border-right-color: #f9fffc;
424
+
}
425
+
426
+
.timeline-item.future:nth-child(even) .timeline-content:before {
427
+
border-left-color: #f9fffc;
428
+
}
429
+
430
+
.timeline-item.future .timeline-date {
431
+
color: #27ae60;
432
+
}
433
+
434
+
.timeline-item {
435
+
position: relative;
436
+
margin-bottom: 70px;
437
+
display: flex;
438
+
justify-content: flex-start;
439
+
align-items: center;
440
+
width: 48%;
441
+
margin-right: 2%;
442
+
}
443
+
444
+
.timeline-item:nth-child(even) {
445
+
margin-left: 52%;
446
+
margin-right: 0;
447
+
width: 48%;
448
+
}
449
+
450
+
.timeline-item:after {
451
+
content: '';
452
+
position: absolute;
453
+
width: 16px;
454
+
height: 16px;
455
+
background-color: white;
456
+
border: 3px solid var(--primary-color);
457
+
top: 20px;
458
+
border-radius: 50%;
459
+
z-index: 2;
460
+
right: auto;
461
+
left: calc(104%);
462
+
transform: translateX(-50%);
463
+
}
464
+
465
+
.timeline-item:nth-child(even):after {
466
+
left: -4%;
467
+
right: auto;
468
+
transform: translateX(-50%);
469
+
}
470
+
471
+
.timeline-date {
472
+
position: absolute;
473
+
width: 170px;
474
+
text-align: right;
475
+
left: -200px;
476
+
color: var(--primary-color);
477
+
font-weight: bold;
478
+
font-size: 1.1rem;
479
+
}
480
+
481
+
.timeline-item:nth-child(even) .timeline-date {
482
+
right: -200px;
483
+
left: auto;
484
+
text-align: left;
485
+
}
486
+
487
+
.timeline-content {
488
+
background-color: #f9f9f9;
489
+
padding: 20px 25px;
490
+
border-radius: 8px;
491
+
box-shadow: 0 5px 25px rgba(0, 0, 0, 0.1);
492
+
position: relative;
493
+
width: 100%;
494
+
transition: transform 0.3s ease, box-shadow 0.3s ease;
495
+
}
496
+
497
+
.timeline-content:hover {
498
+
transform: translateY(-5px);
499
+
box-shadow: 0 15px 35px rgba(0, 0, 0, 0.15);
500
+
}
501
+
502
+
.timeline-content p {
503
+
font-size: 1.15rem;
504
+
line-height: 1.6;
505
+
margin: 0;
506
+
font-weight: 400;
507
+
}
508
+
509
+
.timeline-content a {
510
+
color: var(--primary-color);
511
+
text-decoration: none;
512
+
font-weight: 500;
513
+
transition: color 0.3s ease;
514
+
}
515
+
516
+
.timeline-content a:hover {
517
+
color: var(--accent-color);
518
+
text-decoration: underline;
519
+
}
520
+
521
+
.timeline-content:before {
522
+
content: '';
523
+
position: absolute;
524
+
top: 20px;
525
+
right: 100%;
526
+
border: 12px solid transparent;
527
+
border-right-color: #f9f9f9;
528
+
margin-right: -1px;
529
+
}
530
+
531
+
.timeline-item:nth-child(even) .timeline-content:before {
532
+
left: 100%;
533
+
right: auto;
534
+
border-color: transparent;
535
+
border-left-color: #f9f9f9;
536
+
margin-left: -1px;
537
+
}
538
+
539
+
/* About Section */
540
+
#about {
541
+
background-color: #f9f9f9;
542
+
text-align: center;
543
+
}
544
+
545
+
.participants ul {
546
+
display: flex;
547
+
flex-wrap: wrap;
548
+
justify-content: center;
549
+
list-style: none;
550
+
margin-bottom: 40px;
551
+
}
552
+
553
+
.participants li {
554
+
margin: 10px 20px;
555
+
padding: 10px 20px;
556
+
background-color: white;
557
+
border-radius: 5px;
558
+
box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05);
559
+
transition: transform var(--transition-speed) ease;
560
+
font-size: 1.1rem;
561
+
}
562
+
563
+
.participants li:hover {
564
+
transform: translateY(-5px);
565
+
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
566
+
}
567
+
568
+
.participants li a {
569
+
color: var(--secondary-color);
570
+
font-weight: 500;
571
+
text-decoration: none;
572
+
transition: color 0.3s ease;
573
+
}
574
+
575
+
.participants li a:hover {
576
+
color: black;
577
+
text-decoration: underline;
578
+
}
579
+
580
+
.participants li.original {
581
+
background-color: var(--og-color);
582
+
}
583
+
584
+
.participants li.original a {
585
+
color: black;
586
+
}
587
+
588
+
.participants li.original:hover {
589
+
background-color: var(--og-color);
590
+
}
591
+
592
+
.social-icon a {
593
+
display: inline-block;
594
+
color: white;
595
+
transition: all var(--transition-speed) ease;
596
+
line-height: normal;
597
+
}
598
+
599
+
.social-icon img.bsky-icon,
600
+
.social-icon img.matrix-icon {
601
+
position: relative;
602
+
top: 3px;
603
+
filter: invert(1);
604
+
vertical-align: baseline;
605
+
}
606
+
607
+
.social-icon a:hover {
608
+
opacity: 0.8;
609
+
}
610
+
611
+
.social-links {
612
+
display: flex;
613
+
gap: 15px;
614
+
margin-top: 20px;
615
+
justify-content: center;
616
+
flex-wrap: wrap;
617
+
}
618
+
619
+
.matrix-link, .bluesky-link {
620
+
display: inline-flex;
621
+
align-items: center;
622
+
padding: 10px 20px;
623
+
color: white;
624
+
border-radius: 5px;
625
+
transition: background-color var(--transition-speed) ease;
626
+
font-weight: 500;
627
+
}
628
+
629
+
.matrix-link {
630
+
background-color: var(--primary-color);
631
+
}
632
+
633
+
.bluesky-link {
634
+
background-color: #0085FF;
635
+
}
636
+
637
+
.bluesky-link img.bsky-icon,
638
+
.matrix-link img.matrix-icon {
639
+
margin-right: 8px;
640
+
position: relative;
641
+
top: 4px;
642
+
vertical-align: baseline;
643
+
}
644
+
645
+
.matrix-link:hover {
646
+
background-color: #2980b9;
647
+
color: white;
648
+
}
649
+
650
+
.bluesky-link:hover {
651
+
background-color: #0066CC;
652
+
color: white;
653
+
}
654
+
655
+
/* Footer */
656
+
footer {
657
+
background-color: var(--secondary-color);
658
+
color: white;
659
+
text-align: center;
660
+
padding: 30px 0;
661
+
}
662
+
663
+
footer .disclaimer {
664
+
font-size: 0.85rem;
665
+
opacity: 0.85;
666
+
max-width: 800px;
667
+
margin: 10px auto 0;
668
+
line-height: 1.5;
669
+
}
670
+
671
+
footer .disclaimer a {
672
+
color: white;
673
+
text-decoration: underline;
674
+
opacity: 0.9;
675
+
transition: opacity 0.3s ease;
676
+
}
677
+
678
+
footer .disclaimer a:hover {
679
+
opacity: 1;
680
+
color: white;
681
+
}
682
+
683
+
/* Responsive styles */
684
+
@media (max-width: 768px) {
685
+
nav {
686
+
flex-direction: column;
687
+
padding: 15px;
688
+
}
689
+
690
+
.logo {
691
+
display: none;
692
+
}
693
+
694
+
.nav-container {
695
+
flex-direction: row;
696
+
width: 100%;
697
+
justify-content: center;
698
+
}
699
+
700
+
.main-nav {
701
+
margin-right: 0;
702
+
margin-top: 0;
703
+
flex-wrap: wrap;
704
+
justify-content: center;
705
+
}
706
+
707
+
.social-nav {
708
+
display: none;
709
+
}
710
+
711
+
nav ul li {
712
+
margin: 10px;
713
+
}
714
+
715
+
nav ul li.social-icon {
716
+
margin: 10px;
717
+
}
718
+
719
+
#hero {
720
+
padding: 120px 20px 100px;
721
+
margin-top: 40px;
722
+
}
723
+
724
+
#hero h2 {
725
+
font-size: 2.2rem;
726
+
padding: 0 10px;
727
+
}
728
+
729
+
.timeline-separator {
730
+
margin: 40px auto 30px;
731
+
}
732
+
733
+
.timeline-separator span {
734
+
padding: 8px 15px;
735
+
font-size: 1rem;
736
+
}
737
+
738
+
.timeline:before {
739
+
left: 30px;
740
+
}
741
+
742
+
.timeline-item, .timeline-item:nth-child(even) {
743
+
width: calc(100% - 60px);
744
+
margin-left: 0;
745
+
margin-right: 0;
746
+
padding-left: 60px;
747
+
}
748
+
749
+
.timeline:before {
750
+
left: 30px;
751
+
transform: translateX(-50%);
752
+
}
753
+
754
+
.timeline-item:after, .timeline-item:nth-child(even):after {
755
+
left: 30px;
756
+
right: auto;
757
+
transform: translateX(-50%);
758
+
}
759
+
760
+
.timeline-date, .timeline-item:nth-child(even) .timeline-date {
761
+
left: 40px;
762
+
right: auto;
763
+
text-align: left;
764
+
top: -30px;
765
+
width: auto;
766
+
}
767
+
768
+
.timeline-content:before, .timeline-item:nth-child(even) .timeline-content:before {
769
+
left: -20px;
770
+
right: auto;
771
+
border-color: transparent;
772
+
border-right-color: #f9f9f9;
773
+
}
774
+
775
+
.timeline-item.future .timeline-content:before {
776
+
border-right-color: #f9fffc;
777
+
}
778
+
779
+
.timeline-content {
780
+
font-size: 0.95rem;
781
+
padding-top: 30px;
782
+
}
783
+
784
+
.timeline-content h3 {
785
+
font-size: 1.2rem;
786
+
}
787
+
788
+
.participants ul {
789
+
flex-direction: column;
790
+
align-items: center;
791
+
}
792
+
}
+63
site/usecase-collaboration.html
+63
site/usecase-collaboration.html
···
1
+
<!DOCTYPE html>
2
+
<html lang="en">
3
+
<head>
4
+
<meta charset="UTF-8">
5
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+
<title>Collaboration in the Small - A Human Approach to Computational Science</title>
7
+
<link rel="stylesheet" href="styles.css">
8
+
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
9
+
</head>
10
+
<body>
11
+
<header>
12
+
<nav>
13
+
<div class="logo">The Bellairs Manifesto</div>
14
+
<div class="nav-container">
15
+
<ul class="main-nav">
16
+
<li><a href="index.html#manifesto">Manifesto</a></li>
17
+
<li><a href="index.html#usecases">Actions</a></li>
18
+
<li><a href="index.html#timeline">Timeline</a></li>
19
+
<li><a href="index.html#about">About</a></li>
20
+
</ul>
21
+
<ul class="social-nav">
22
+
<li class="social-icon"><a href="https://matrix.to/#/#bellairs-discuss:recoil.org" target="_blank" aria-label="Matrix">
23
+
<img src="matrix-icon.svg" alt="Matrix" width="20" height="20" class="matrix-icon">
24
+
</a></li>
25
+
<li class="social-icon"><a href="https://bsky.app/profile/bellairs.quest" target="_blank" aria-label="Bluesky">
26
+
<img src="bluesky-icon.svg" alt="Bluesky" width="20" height="20" class="bsky-icon">
27
+
</a></li>
28
+
</ul>
29
+
</div>
30
+
</nav>
31
+
</header>
32
+
33
+
<section id="usecase-detail">
34
+
<div class="container">
35
+
<h2>Use Case: Collaboration in the Small</h2>
36
+
37
+
<div class="usecase">
38
+
<p>Many research projects necessitate the involvement of inputs from other researchers, including those in a different area. For example:</p>
39
+
<ul>
40
+
<li>Research on schedulers depends on the availability of traces (e.g., from large ML clusters or servers running databases for web servers) that are not readily available to the average computer systems researcher. At the same time, these traces are considered sensitive (because they reveal information about cluster size and machine specification) and are not often posted online.</li>
41
+
<li>Research on verification and testing requires system specifications, which need to be validated by the programmers who built the software but are not experts in verification. Few groups have sufficient expertise to both write specifications for real-world software and use them for verification tasks, and collaboration is thus key to these efforts.</li>
42
+
<li>Research that extends prior work, which constructs data or analysis artifacts, and would benefit from starting from these artifacts.</li>
43
+
</ul>
44
+
<p>However, finding other researchers' digital artifacts, and then using (or extending) them is challenging today: we have relatively few mechanisms to discover existing digital artifacts (the ones we have usually require serendipitously reading a research paper or website that describes the artifact); no mechanisms to ensure that contributions from publicly available artifacts are recognized; and nearly no good mechanism to share artifacts among a small set of research groups (each of which might have an evolving set of individual participants).</p>
45
+
<p>We will address these challenges by developing systems that make it easier to discover digital artifacts, make it easier to track the contributions of each artifact's provider, and reduce friction for sharing artifacts between research groups.</p>
46
+
<p class="investigators"><strong>Investigators:</strong> <a href="https://cseweb.ucsd.edu/~mcoblenz/" target="_blank">Michael Coblenz</a></p>
47
+
</div>
48
+
49
+
<div class="back-link">
50
+
<a href="index.html#usecases">← Back to all use cases</a>
51
+
</div>
52
+
</div>
53
+
</section>
54
+
55
+
<footer>
56
+
<div class="container">
57
+
<p class="disclaimer">© 2025 in the public domain. This site is not directly affiliated with the <a href="https://www.mcgill.ca/bellairs/" target="_blank">Bellairs Research Institute</a>, but we are grateful to them for hosting our research symposium that made this manifesto possible.</p>
58
+
</div>
59
+
</footer>
60
+
61
+
<script src="scripts.js"></script>
62
+
</body>
63
+
</html>
+57
site/usecase-conservation.html
+57
site/usecase-conservation.html
···
1
+
<!DOCTYPE html>
2
+
<html lang="en">
3
+
<head>
4
+
<meta charset="UTF-8">
5
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+
<title>Conservation and Sensing - A Human Approach to Computational Science</title>
7
+
<link rel="stylesheet" href="styles.css">
8
+
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
9
+
</head>
10
+
<body>
11
+
<header>
12
+
<nav>
13
+
<div class="logo">The Bellairs Manifesto</div>
14
+
<div class="nav-container">
15
+
<ul class="main-nav">
16
+
<li><a href="index.html#manifesto">Manifesto</a></li>
17
+
<li><a href="index.html#usecases">Actions</a></li>
18
+
<li><a href="index.html#timeline">Timeline</a></li>
19
+
<li><a href="index.html#about">About</a></li>
20
+
</ul>
21
+
<ul class="social-nav">
22
+
<li class="social-icon"><a href="https://matrix.to/#/#bellairs-discuss:recoil.org" target="_blank" aria-label="Matrix">
23
+
<img src="matrix-icon.svg" alt="Matrix" width="20" height="20" class="matrix-icon">
24
+
</a></li>
25
+
<li class="social-icon"><a href="https://bsky.app/profile/bellairs.quest" target="_blank" aria-label="Bluesky">
26
+
<img src="bluesky-icon.svg" alt="Bluesky" width="20" height="20" class="bsky-icon">
27
+
</a></li>
28
+
</ul>
29
+
</div>
30
+
</nav>
31
+
</header>
32
+
33
+
<section id="usecase-detail">
34
+
<div class="container">
35
+
<h2>Use Case: Conservation and Sensing</h2>
36
+
37
+
<div class="usecase">
38
+
<p>Some large-scale research projects require acquiring, aggregating, manipulating, analyzing, and reporting on a multitude of data sets. Sometimes, the outputs may even connect to real-time systems, such as data dashboards or sensor networks, which need to be configured as a result of the analysis. For example, the IUCN Red List of Threatened Species is derived from a multitude of data regarding species sightings, habitat loss, and climate predictions. Among this data is output from the Centre for Earth Observation, which itself constructs complex models that assimilate data. As another example, a network of sensing buoys may receive control inputs from a control system that sends commands on the basis of weather predictions and mission inputs.</p>
39
+
<p>Some inputs must be protected. For example, locations of threatened species may be useful in the analysis but need to be kept private lest poachers destroy those populations. Thus, although this scenario benefits from openness and transparency in general, not everything can be made public.</p>
40
+
<p class="investigators"><strong>Investigators:</strong> <a href="https://cseweb.ucsd.edu/~mcoblenz/" target="_blank">Michael Coblenz</a>, <a href="https://anil.recoil.org" target="_blank">Anil Madhavapeddy</a>, <a href="https://web.eecs.umich.edu/~comar/" target="_blank">Cyrus Omar</a></p>
41
+
</div>
42
+
43
+
<div class="back-link">
44
+
<a href="index.html#usecases">← Back to all use cases</a>
45
+
</div>
46
+
</div>
47
+
</section>
48
+
49
+
<footer>
50
+
<div class="container">
51
+
<p class="disclaimer">© 2025 in the public domain. This site is not directly affiliated with the <a href="https://www.mcgill.ca/bellairs/" target="_blank">Bellairs Research Institute</a>, but we are grateful to them for hosting our research symposium that made this manifesto possible.</p>
52
+
</div>
53
+
</footer>
54
+
55
+
<script src="scripts.js"></script>
56
+
</body>
57
+
</html>
+57
site/usecase-training.html
+57
site/usecase-training.html
···
1
+
<!DOCTYPE html>
2
+
<html lang="en">
3
+
<head>
4
+
<meta charset="UTF-8">
5
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+
<title>Breaking Specialist Training out of the University - A Human Approach to Computational Science</title>
7
+
<link rel="stylesheet" href="styles.css">
8
+
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
9
+
</head>
10
+
<body>
11
+
<header>
12
+
<nav>
13
+
<div class="logo">The Bellairs Manifesto</div>
14
+
<div class="nav-container">
15
+
<ul class="main-nav">
16
+
<li><a href="index.html#manifesto">Manifesto</a></li>
17
+
<li><a href="index.html#usecases">Actions</a></li>
18
+
<li><a href="index.html#timeline">Timeline</a></li>
19
+
<li><a href="index.html#about">About</a></li>
20
+
</ul>
21
+
<ul class="social-nav">
22
+
<li class="social-icon"><a href="https://matrix.to/#/#bellairs-discuss:recoil.org" target="_blank" aria-label="Matrix">
23
+
<img src="matrix-icon.svg" alt="Matrix" width="20" height="20" class="matrix-icon">
24
+
</a></li>
25
+
<li class="social-icon"><a href="https://bsky.app/profile/bellairs.quest" target="_blank" aria-label="Bluesky">
26
+
<img src="bluesky-icon.svg" alt="Bluesky" width="20" height="20" class="bsky-icon">
27
+
</a></li>
28
+
</ul>
29
+
</div>
30
+
</nav>
31
+
</header>
32
+
33
+
<section id="usecase-detail">
34
+
<div class="container">
35
+
<h2>Use Case: Breaking Specialist Training out of the University</h2>
36
+
37
+
<div class="usecase">
38
+
<p>Meaningful participation in important scientific discourses requires specialist knowledge. For example, to evaluate the safety of a plan to deploy machine learning in public infrastructure, some understanding of current techniques and their range of applicability is required; likewise, climate data cannot be meaningfully analysed by someone who lacks prior experience in statistics. Access to specialist training of this kind is presently centralised in the universities and gated behind tuition fees and time barriers.</p>
39
+
<p>We will answer the erosion of public trust in the scientific process with a credible invitation: join us, learn our methods, and contribute to the discourse. To that end, we aim to build sustainable infrastructure for a decentralised network of publicly accessible online courseware, textbooks, tutorials, and social media that will serve as the roots of a new and serious partnership between the public and the scientific community.</p>
40
+
<p class="investigators"><strong>Investigators:</strong> <a href="https://www.jonmsterling.com" target="_blank">Jonathan Sterling</a>, <a href="https://anil.recoil.org" target="_blank">Anil Madhavapeddy</a></p>
41
+
</div>
42
+
43
+
<div class="back-link">
44
+
<a href="index.html#usecases">← Back to all use cases</a>
45
+
</div>
46
+
</div>
47
+
</section>
48
+
49
+
<footer>
50
+
<div class="container">
51
+
<p class="disclaimer">© 2025 in the public domain. This site is not directly affiliated with the <a href="https://www.mcgill.ca/bellairs/" target="_blank">Bellairs Research Institute</a>, but we are grateful to them for hosting our research symposium that made this manifesto possible.</p>
52
+
</div>
53
+
</footer>
54
+
55
+
<script src="scripts.js"></script>
56
+
</body>
57
+
</html>