Skip to content

Commit f0de844

Browse files
tscotntscotn
committed
update game
1 parent 77b6768 commit f0de844

File tree

95 files changed

+2673
-0
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

95 files changed

+2673
-0
lines changed

‎.DS_Store

0 Bytes
Binary file not shown.

‎DigHT 250/.DS_Store

10 KB
Binary file not shown.

‎DigHT 250/Digital Humanities Blog/.DS_Store

6 KB
Binary file not shown.

‎DigHT 250/Digital Humanities Blog/assets/.3 Heschels-No-Religion-is-an-Island.pdf.icloud

191 Bytes
Binary file not shown.

‎DigHT 250/Digital Humanities Blog/assets/.DS_Store

6 KB
Binary file not shown.

‎DigHT 250/Digital Humanities Blog/assets/2021 DiscoverSTEM Webpage Instructions.updated.docx

441 KB
Binary file not shown.

‎DigHT 250/Digital Humanities Blog/assets/Final Review sheet based on old finals.docx

14.9 KB
Binary file not shown.

‎DigHT 250/Digital Humanities Blog/assets/Final statement.docx

18.4 KB
Binary file not shown.

‎DigHT 250/Digital Humanities Blog/assets/Readings for use on final exam-1.docx

16.5 KB
Binary file not shown.

‎DigHT 250/Digital Humanities Blog/assets/Syllabus Math 213 - Fall 2020.docx

1.05 MB
Binary file not shown.

‎DigHT 250/Digital Humanities Blog/assets/f2020 Final Exam.docx

16.7 KB
Binary file not shown.

‎DigHT 250/Digital Humanities Blog/assets/genres.webp

54 KB
Binary file not shown.

‎DigHT 250/Digital Humanities Blog/assets/heat_map.png

571 KB
Loading

‎DigHT 250/Digital Humanities Blog/assets/infographic.jpg

191 KB
Loading

‎DigHT 250/Digital Humanities Blog/assets/neural-network.jpg

45.2 KB
Loading

‎DigHT 250/Digital Humanities Blog/assets/obama.webp

38.2 KB
Binary file not shown.

‎DigHT 250/Digital Humanities Blog/assets/plot.svg

+1
Loading

‎DigHT 250/Digital Humanities Blog/assets/regression_trees.png

44.7 KB
Loading

‎DigHT 250/Digital Humanities Blog/assets/spotify-wrapped.png

79.3 KB
Loading

‎DigHT 250/Digital Humanities Blog/css/articles.css

+167
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,167 @@
1+
@import url('https://fonts.googleapis.com/css2?family=Major+Mono+Display&family=Montserrat&display=swap');
2+
3+
:root {
4+
--headline-font: 'Major Mono Display', monospace;
5+
--body-font: 'Montserrat', sans-serif;
6+
7+
--background-color: #3c887eff;
8+
--headline-color: #a17c6b;
9+
--header-color: #e0f2e9;
10+
--anchor-color: #ceb5a7;
11+
--body-color: #e0f2e9;
12+
--transition-color: #A9DBC3;
13+
}
14+
15+
html {
16+
text-align: center;
17+
width: 100%;
18+
height: 100%;
19+
}
20+
21+
/* default css for mobile */
22+
body {
23+
display: flex;
24+
flex-direction: column;
25+
width: 100%;
26+
height: 100%;
27+
margin: 0;
28+
padding: 0;
29+
background-color: var(--background-color);
30+
font-family: var(--body-font);
31+
}
32+
33+
header, footer {
34+
padding: 1rem 0;
35+
background-color: var( --header-color);
36+
font-family: var(--headline-font);
37+
clear: both;
38+
}
39+
40+
body * {
41+
color: var(--body-color);
42+
}
43+
44+
h1, h2, h3 {
45+
color: var(--headline-color);
46+
font-family: var(--headline-font);
47+
}
48+
49+
nav * {
50+
margin: 0 2rem;
51+
}
52+
53+
a {
54+
color: var(--anchor-color);
55+
text-decoration: none;
56+
}
57+
58+
header a:hover, article a:hover {
59+
text-decoration: revert;
60+
}
61+
62+
.card {
63+
background-color: var(--header-color);
64+
height: 10rem;
65+
padding: 1rem;
66+
border-radius: .5rem;
67+
transition: background-color .5s;
68+
border-color: var(--background-color);
69+
border: solid;
70+
}
71+
72+
.card h2, .card p {
73+
padding: 0;
74+
margin: 0;
75+
color: var(--headline-color);
76+
}
77+
78+
/* .container * {
79+
text-align: center;
80+
} */
81+
82+
a:hover {
83+
text-decoration: none;
84+
}
85+
86+
article {
87+
text-align: left;
88+
}
89+
90+
p {
91+
margin: 1rem 2rem;
92+
text-indent: 2rem;
93+
}
94+
95+
img {
96+
margin: 1rem;
97+
width: 20rem;
98+
width: -moz-available;
99+
}
100+
101+
/* default desktop */
102+
@media screen and (min-width: 600px) {
103+
nav {
104+
display: block;
105+
}
106+
107+
.container {
108+
display: flex;
109+
justify-content: space-around;
110+
}
111+
112+
.card {
113+
width: 15rem;
114+
height: auto;
115+
}
116+
117+
.card:hover {
118+
background-color: var(--transition-color);
119+
}
120+
121+
.img-left {
122+
float: left;
123+
padding-left: 2rem;
124+
}
125+
126+
.img-right {
127+
float: right;
128+
padding-right: 2rem;
129+
}
130+
131+
footer {
132+
width: 100%;
133+
position: relative;
134+
bottom: 0;
135+
}
136+
137+
article {
138+
width: 80%;
139+
align-self: center;
140+
}
141+
142+
img {
143+
margin-top: 0;
144+
height: 16rem;
145+
width: auto;
146+
}
147+
}
148+
149+
/* printing */
150+
@media print {
151+
html {
152+
text-align: left;
153+
}
154+
155+
html * {
156+
font-family: var(--body-font);
157+
color: black !important;
158+
}
159+
160+
.card {
161+
border-style: none;
162+
}
163+
164+
.card {
165+
height: auto;
166+
}
167+
}

‎DigHT 250/Digital Humanities Blog/css/styles.css

+133
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,133 @@
1+
@import url('https://fonts.googleapis.com/css2?family=Major+Mono+Display&family=Montserrat&display=swap');
2+
3+
:root {
4+
--headline-font: 'Major Mono Display', monospace;
5+
--body-font: 'Montserrat', sans-serif;
6+
7+
--background-color: #3c887eff;
8+
--headline-color: #a17c6b;
9+
--header-color: #e0f2e9;
10+
--anchor-color: #ceb5a7;
11+
--body-color: #e0f2e9;
12+
--transition-color: #A9DBC3;
13+
}
14+
15+
html {
16+
text-align: center;
17+
}
18+
19+
/* default css for mobile */
20+
body {
21+
margin: 0;
22+
padding: 0;
23+
background-color: var(--background-color);
24+
font-family: var(--body-font);
25+
}
26+
27+
header, footer {
28+
padding: 1rem 0;
29+
background-color: var( --header-color);
30+
font-family: var(--headline-font);
31+
}
32+
33+
body * {
34+
color: var(--body-color);
35+
}
36+
37+
h1, h2, h3 {
38+
color: var(--headline-color);
39+
font-family: var(--headline-font);
40+
}
41+
42+
nav * {
43+
margin: 0 2rem;
44+
}
45+
46+
a {
47+
color: var(--anchor-color);
48+
text-decoration: none;
49+
}
50+
51+
header a:hover {
52+
text-decoration: revert;
53+
}
54+
55+
.card {
56+
background-color: var(--header-color);
57+
height: auto;
58+
padding: 1rem;
59+
border-radius: .5rem;
60+
transition: background-color .5s;
61+
border-color: var(--background-color);
62+
border: solid;
63+
margin: 1rem;
64+
}
65+
66+
.card h2, .card p {
67+
padding: 0;
68+
margin: 0;
69+
color: var(--headline-color);
70+
text-indent: 0;
71+
}
72+
73+
p {
74+
text-indent: 2rem;
75+
}
76+
77+
a:hover {
78+
text-decoration: none;
79+
}
80+
81+
/* default desktop */
82+
@media screen and (min-width: 600px) {
83+
nav {
84+
display: block;
85+
}
86+
87+
.container {
88+
display: flex;
89+
justify-content: space-around;
90+
}
91+
92+
.card {
93+
width: 15rem;
94+
height: auto;
95+
}
96+
97+
.card:hover {
98+
background-color: var(--transition-color);
99+
}
100+
101+
footer {
102+
width: 100%;
103+
position: absolute;
104+
bottom: 0;
105+
}
106+
107+
#description {
108+
width: 75%;
109+
text-align: left;
110+
padding: 1rem;
111+
margin-left: 2rem;
112+
}
113+
}
114+
115+
/* printing */
116+
@media print {
117+
html {
118+
text-align: left;
119+
}
120+
121+
html * {
122+
font-family: var(--body-font);
123+
color: black !important;
124+
}
125+
126+
.card {
127+
border-style: none;
128+
}
129+
130+
.card {
131+
height: auto;
132+
}
133+
}

‎DigHT 250/Digital Humanities Blog/html/article_1.html

+36
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
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+
<link rel="stylesheet" href="../css/articles.css">
7+
<title>Data Visualization</title>
8+
</head>
9+
<body>
10+
<header>
11+
<a href="../index.html"><h1>DIGITAL HUMANITIES: DATA</h1></a>
12+
<nav>
13+
<a href="article_1.html">VISUALIZATION</a>
14+
<a href="article_2.html">SCIENCE</a>
15+
<a href="article_3.html">ALCHEMY</a>
16+
</nav>
17+
18+
<h2>data visualization</h2>
19+
</header>
20+
21+
<article>
22+
<p>Data visualization is all about communicating information succinctly with graphics and visuals. This is where boxplots, scatterplots, histograms, pie charts, etc. are used to deliver relevant information on a topic to an audience. DV can be a powerful tool for persuading communities, businesses and others, and is an effective way to supporting an argument with facts, if done correctly.</p>
23+
<img class="img-right" src="../assets/heat_map.png" alt="Heat map showing COVID case severity across the United States.">
24+
<p>Unfortunately, visuals are easily manipulated, and different conclusions about the same data can be drawn just by changing the scale, the grouping, the method, and even titles. It's important that data communicators use the tools at their disposal to make data more understandable, less confusing, but most importantly, accurate.</p>
25+
<img class="img-left" src="../assets/infographic.jpg" alt="Infographic presenting statistics from a survey of community members assessing impact of Coronavirus on daily life and health.">
26+
<p>The coronavirus pandemic has been an opportunity for data visualizations to shine. Charts of case counts over time are effective at showing the severity of the pandemic from day to day and week to week, and heat maps can illustrate how certain places are doing in comparison to others. Infographics can communicate all kinds of useful information, like guidelines for mask wearing, effective handwashing techniques, and more.</p>
27+
<p>With so much at stake, it's important that pandemic visualizations be designed to appropriately respond to fear and misinformation. Being informed is only as good as the information one is taking in, so manipulative or even malicious statistics should have no place in data visualization.</p>
28+
<img class="img-right" src="../assets/plot.svg" alt="Chart of Coronavirus deaths by country from February to April.">
29+
<p>For more information on the relationship between the coronavirus pandemic response and data visualization, visit <a href="https://online.stanford.edu/effective-data-visualization-In-the-era-of-COVID-19" target="_blank">Stanford Online</a>. For examples of the effect of misusing data visualization on social media, read more at <a href="https://healthitanalytics.com/news/covid-19-data-visualizations-shared-on-twitter-may-lack-reliability" target="_blank">Health IT Analytics</a>.</p>
30+
</article>
31+
32+
<footer>
33+
<h3>scot nielson · 2020</h3>
34+
</footer>
35+
</body>
36+
</html>

‎DigHT 250/Digital Humanities Blog/html/article_2.html

+34
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
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+
<link rel="stylesheet" href="../css/articles.css">
7+
<title>Data Science</title>
8+
</head>
9+
<body>
10+
<header>
11+
<a href="../index.html"><h1>DIGITAL HUMANITIES: DATA</h1></a>
12+
<nav>
13+
<a href="article_1.html">VISUALIZATION</a>
14+
<a href="article_2.html">SCIENCE</a>
15+
<a href="article_3.html">ALCHEMY</a>
16+
</nav>
17+
18+
<h2>data science</h2>
19+
</header>
20+
21+
<article>
22+
<p>Data Science has been called the sexiest job of the century, which when you find out that it’s really just statistics and computers, may be hard to believe. But the people with experience in using the critical-thinking skills involved in approaching a problem, collecting data, and using sophisticated tools to draw out the story underneath that data are among the highest paid and most sought after in the business world.</p>
23+
<img class="img-left" src="../assets/regression_trees.png">
24+
<p>Data Scientists use programming tools like R and Python combined with statistical tools like regression trees, machine learning, and even Artificial Intelligence to tackle problems and questions like <a target="_blank" href="https://www.theatlantic.com/international/archive/2019/04/how-technology-could-revolutionize-refugee-resettlement/587383/">“where is the best city for a new refugee to find a job and live comfortably?”</a> to “what show will a given Netflix user want to watch next?”</p>
25+
<img class="img-right" src="../assets/neural-network.jpg">
26+
<p>Data science is a field that’s growing faster than ever and having an increasingly important role in the relationship between people and technology. This is why professionals need to take great care to be sure that ethical lines are being drawn and that data is utilized to improve the people living in the world rather than exploit and marginalize them. For example, Deep Fakes and improved Text Generation algorithms are making it easier than ever to distribute fake news. Twitter users are finding that the image focus algorithm acts in a problematic way. This <a target="_blank" href="https://www.theverge.com/21298762/face-depixelizer-ai-machine-learning-tool-pulse-stylegan-obama-bias">image recreation technology</a> published in 2020 highlighted how easy it is to build harmful biases into AI, accidentally transforming a photo of Barack Obama into that of a white man.</p>
27+
<img class="img-left" src="../assets/obama.webp">
28+
</article>
29+
30+
<footer>
31+
<h3>scot nielson · 2020</h3>
32+
</footer>
33+
</body>
34+
</html>

0 commit comments

Comments
 (0)