/
coahoma.html
166 lines (147 loc) · 7.3 KB
/
coahoma.html
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
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<link rel="icon" href="../../favicon.ico">
<title>Co-designing a Mobile STEAM Learning Space with Youth</title>
<!-- Include jQuery -->
<script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js'></script>
<!-- PJ5.JS -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.8.0/p5.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.8.0/addons/p5.dom.min.js"></script>
<!-- Bootstrap core CSS -->
<link href="bower_components/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
<!-- My CSS -->
<link href="css/main2.css" type="text/css" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Droid+Sans+Mono" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=IBM+Plex+Mono: 400, 400i" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=IBM+Plex+Sans: 400, 400i" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Karla:400,700&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Montserrat:600" rel="stylesheet">
</head>
<!-- **************** END HEAD *********************** -->
<div class="navbar-doyung">
<a href="index.html" class="navbar-link"><p class="navbar-heading">< Home</p></a>
</div>
<div class="header-wrapper" style="background-color:#A146AB">
<h1>Co-designing a Mobile STEAM Learning Space with Youth</h1>
</div>
<div class="body-wrapper">
<br>
<br>
<p id="regular-text"> During 2016-2017, I was a UX + graphic designer, project manager, and curriculum developer in a team working with Coahoma County community members and organizations; these groups are addressing challenges in providing the youth of Coahoma with the necessary resources to be successful. Below are some of the design works I did to help the team understand and get feedback from the community. </p>
<br>
<p id="regular-text"> <b>*Note*:</b> After years of iteration and partnering with Coahoma community members, the project has evolved into "Shifting Rhythms." You can learn more here: <a href="http://www.shiftingrhythms.org" target="_blank">www.shiftingrhythms.org</a> </p>
<br>
<br>
<h2 class="section-header">Co-Designing with Youth</h2>
<p id="regular-text">
After developing relationships with schools, afterschool programs, and other organizations, we met with youth in Coahoma County to learn more about available and missing learning resources in their community. I helped design a tool (shown below) for youth to imagine a new learning space, which allowed us to listen and learn from them.
</p>
<img src="Images/coahoma/codesign-students.jpg" class="content-photo-big">
<p id="photo-caption">Left: Youth from a partner afterschool program designing a mobile bus that teaches arts, technology and making. Right: Samples of ideated spaces made by high schoolers.</p>
<p id="regular-text">
We were able to have conversations with over 100 youth from Coahoma. This information helped us narrow down to 5 potential ideas for a learning space in the county.
</p>
<br>
<p id="majorkey">
KEY TAKEAWAYS: Many of the youth feel uncomfortable in the city, and want a safe, youth-centered space where they can study, learn and hang out.
</p>
<br>
<br>
<h2 class="section-header">Community Meeting with Youth and Leaders</h2>
<p id="regular-text">
I created posters for 5 potential ideas that were formed using the data from the co-design activity. We held a meeting with youth and community leaders we had been partnering closely with, and sent the ideas to schools in the area for more feedback. We ended up receiving input from over 400 students.
</p>
<img src="Images/coahoma/communityideas.jpg" class="content-photo-big">
<p id="photo-caption">Posters designed for the community feedback session. Posters include information about impact, requirements, and case studies of existing spaces.</p>
<br>
<img src="Images/coahoma/communitymeetingphotos.jpg" class="content-photo-big">
<p id="photo-caption">Photos from our meeting. Community members were able to give feedback on each idea, as well as show interest in becoming involved with executing the space.</p>
<br>
<p id="majorkey">
KEY TAKEAWAYS: A mobile space can serve people across socio-economic lines in the county. Existing organizations see the mobile space as an opportunity to reach people without transportation, people in smaller towns, or people who might not know about their programs.
</p>
<br>
<br>
<h2 class="section-header">Testing Assumptions and Running Activities</h2>
<p id="regular-text">
Using the information from co-designs and community meetings, we ran playtest with the community at the annual Juke Joint Festival, a blues festival which brings thousands of Coahoma County residents to the city. We also playtested and iterated the activities at CCYO, a new youth center.
</p>
<img src="Images/coahoma/runningactivities.jpg" class="content-photo-big">
<p id="photo-caption">
Youth testing art, technology and music related activities. Left: a community mural. Middle and Right: music+technology activity using the Makey Makey.
</p>
<br>
<p id="majorkey">
KEY TAKEAWAYS: The activities were popular with younger groups and their parents. However, the team will have to rethink curriculum that will be better suited for teens.
</p>
<br>
<br>
<h2 class="section-header">Proposal to Local Government</h2>
<p id="regular-text">
At the end of the year, I designed a proposal for a mobile learning space to share with potential organization partners, as well as local government officials.
</p>
<img src="Images/coahoma/proposal.jpg" class="content-photo-big">
<p id="photo-caption">
Sample pages from the proposal. The proposal includes data from co-designs, financial plans, and potential curricula for the mobile learning space.
</p>
<br>
<br>
</div>
<!--Calling the P5.JS script:-->
<script src="javascript/coahomasketch.js"></script>
</body>
<style>
@media only screen and (max-width: 780px) {
#regular-text {
font-size: 16px;
}
.section-header {
font-size: 20px;
}
.content-photo-med {
width: 100%;
}
.content-photo-small {
width: 100%;
}
.content-photo-big {
width: 100%;
}
#photo-caption {
font-size: 12px;
margin-left: 10%;
margin-right: 10%;
}
#photo-caption-small {
font-size: 12px;
margin-left: 15%;
margin-right: 15%;
}
h1 {
font-size: 34px;
font-family: 'Montserrat';
font-weight: bolder;
}
.section-header {
font-family: 'Montserrat';
font-weight: bold;
}
}
@media only screen and (max-width: 650px) {
#regular-text {
font-size: 14px;
}
.section-header {
font-size: 18px;
}
h1 {
font-size: 24px;
}
}
</style>
<!--Different sized windows!-->