-
Notifications
You must be signed in to change notification settings - Fork 1
Expand file tree
/
Copy pathcontent-department-of-education.php
More file actions
122 lines (104 loc) · 7.06 KB
/
content-department-of-education.php
File metadata and controls
122 lines (104 loc) · 7.06 KB
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
<section id="opportunity" class="page-section">
<figcaption class="outer-container">
<div class="inner-container">Photo credit: Kirsten Luce</div>
</figcaption>
<div class="outer-container mt-4">
<h3 class="future-A h3 inner-container">opportunity</h3>
<div class="inner-container">
<p>The NYC Department of Education’s Office of School Wellness Programs sought a new visual identity to convey the positive impact of its work for students, and to enable its messages to reach the right people.</p>
<p>We saw an opportunity to demonstrate the holistic nature of student health and wellness, and to help schools recognize the benefit of prioritizing the overall well-being of every student and family rather than ‘cherry-picking’ from the office’s suite of programs and materials.</p>
</div>
</div>
<figure class="alignnone mt-5">
<div class="parallax-container">
<blockquote class="parallax-node bleed" data-speed-modifier="0.5">
<p style="padding:0"><span class="quote">“</span>We're competing with math and English for time in the school day, but Wellness supports students to achieve in these subjects.<span class="quote">”</span><br/><small>—School Wellness Programs staff member</small></p>
</blockquote>
<img src="<?php echo os_path('DOE-Parallax.jpg', 'doe') ?>" srcset="<?php echo os_path('DOE-Parallax.jpg', 'doe') ?> 1x, <?php echo os_path('DOE-Parallax@2x.jpg', 'doe') ?> 2x" width="1600">
</div>
<figcaption class="outer-container"><div class="inner-container">A School Wellness Council meeting. (Photo credit: Kirsten Luce)</div></figcaption>
</figure>
</section>
<section id="process" class="page-section " >
<div class="outer-container">
<h3 class="future-A h3 inner-container mt-5">process</h3>
<div class="inner-container">
<p>We interviewed people across the NYC school community to build our evidence base, and quickly deduced the problem: head teachers across NYC are not prioritizing health and physical education in the school day, despite its benefits across grades and behavior.</p>
<p>Communicating the legitimacy and imperative of wellness education in the Office of School Wellness Programs’ visual communications became the chief objective. To create impact, capture the attention of key audiences, and communicate the core messages, we focused on the students, their actions and their outcomes. </p>
</div>
</div>
<figure class="alignnone mt-5">
<img src="<?php echo os_path('DOE-Interview.jpg', 'doe') ?>" srcset="<?php echo os_path('DOE-Interview.jpg', 'doe') ?> 1x, <?php echo os_path('DOE-Interview@2x.jpg', 'doe') ?> 2x">
<div class="outer-container">
<figcaption class="inner-container">Lizzie interviewing Dan Marascia, PE Teacher; Courtland Elementary School</figcaption>
</div>
</figure>
</section>
<section id="solution" class="page-section ">
<div class="outer-container">
<div class="inner-container mt-5">
<h3 class="future-A h3">solution</h3>
<p>We designed an identity which brands the result rather than the office. The wordmark logo Think—Move—Achieve— highlights the symbiotic relationship between learning to take care of one’s mind and body, and achieving personal and academic goals.</p>
</div>
</div>
<figure class="aligncenter doe-wordmarks active-on-inview mt-5" data-offset="0.6">
<div class="outer-container">
<img style="display:inline-block;" src="<?php echo os_path('Think.svg', 'doe') ?>">
<img style="display:inline-block;" src="<?php echo os_path('Move.svg', 'doe') ?>">
<img style="display:inline-block;" src="<?php echo os_path('Achieve.svg', 'doe') ?>">
</div>
</figure>
<div class="outer-container">
<figcaption class="inner-container">Think—Move—Achieve— Wordmark</figcaption>
</div>
<div class="outer-container mt-5">
<p class="inner-container">The line emphasizes the continuum between all three elements and therefore the holistic nature of wellness. This is supported by the graphic pattern to reinforce the identity.</p>
</div>
<figure class="aligncenter mt-5">
<img src="<?php echo os_path('DOE-Poster-Mock-ups.png', 'doe') ?>" srcset="<?php echo os_path('DOE-Poster-Mock-ups.png', 'doe') ?> 1x, <?php echo os_path('DOE-Poster-Mock-ups@2x.png', 'doe') ?> 2x" width="1200" height="797">
<div class="outer-container">
<figcaption class="inner-container">Think—Move—Achieve— Posters</figcaption>
</div>
</figure>
<div class="outer-container mt-5">
<div class="inner-container">
<p>We expanded the NYC Department of Education’s color palette, and used an approachable, confident and energetic typeface. </p>
</div>
</div>
<figure class="os-slideshow-container mt-5">
<div id="doe-billboard-dots"></div>
<ul class="list-unstyled os-slideshow center-mode" data-slick='{ "prevArrow": "#doe-billboard-nav .prev", "nextArrow": "#doe-billboard-nav .next", "appendDots": "#doe-billboard-dots" }'>
<li>
<img src="<?php echo os_path('DOE-wellness.jpg', 'doe'); ?>" srcset="<?php echo os_path('DOE-wellness.jpg', 'doe'); ?> 1x, <?php echo os_path('DOE-wellness@2x.jpg', 'doe'); ?> 2x" width="850" height="566" />
</li>
<li>
<img src="<?php echo os_path('DOE-champs.jpg', 'doe'); ?>" srcset="<?php echo os_path('DOE-champs.jpg', 'doe'); ?> 1x, <?php echo os_path('DOE-champs@2x.jpg', 'doe'); ?> 2x" width="850" height="566" />
</li>
<li>
<img src="<?php echo os_path('DOE-dance.jpg', 'doe'); ?>" srcset="<?php echo os_path('DOE-dance.jpg', 'doe'); ?> 1x, <?php echo os_path('DOE-dance@2x.jpg', 'doe'); ?> 2x" width="850" height="566" />
</li>
<li>
<img src="<?php echo os_path('DOE-kickball.jpg', 'doe'); ?>" srcset="<?php echo os_path('DOE-kickball.jpg', 'doe'); ?> 1x, <?php echo os_path('DOE-kickball@2x.jpg', 'doe'); ?> 2x" width="850" height="566" />
</li>
</ul>
<?php os_slide_nav("doe-billboard-nav"); ?>
<figcaption class="outer-container"><div class="inner-container">NYC school students participating in wellness programs (Photo credit: Kirsten Luce)</div></figcaption>
</figure>
<div class="outer-container mt-5">
<div class="inner-container">
<p>We showed how student stories reach audiences, and prescribed the photo style to support the office’s objectives: focusing on the student, student learning and schools’ engagement with physical and health education programming.</p>
</div>
</div>
<figure class="aligncenter mt-5">
<img src="<?php echo os_path('DOE-Brand-Guidelines.png', 'doe') ?>" srcset="<?php echo os_path('DOE-Brand-Guidelines.png', 'doe') ?> 1x, <?php echo os_path('DOE-Brand-Guidelines@2x.png', 'doe') ?> 2x">
<div class="outer-container">
<figcaption class="inner-container">DOE's Brand Guidelines</figcaption>
</div>
</figure>
<div class="outer-container">
<div class="inner-container mt-5">
<p>We refined the OSWP’s existing communications materials for clarity and brevity, and created Brand Guidelines to enable all staff to apply the identity consistently. </p>
<!-- <p class="h3 future-A h3"><a href="http://nyc.doe.owsp/" class="cta-link" target="_blank">nyc.doe.owsp <span class="icon arnhem rotate-cc-45">→</span></a></p> -->
</div>
</div>
</section>