-
Notifications
You must be signed in to change notification settings - Fork 1
Expand file tree
/
Copy pathpage-about.php
More file actions
302 lines (255 loc) · 10.9 KB
/
page-about.php
File metadata and controls
302 lines (255 loc) · 10.9 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
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
<?php
/**
* Page: About
*
* @package obsub
*/
get_header(); ?>
<?php the_post(); ?>
<section id="about-intro" class="about-intro page-section use-ui-light-theme">
<div class="intro-content section-content">
<div class="outer-container">
<div class="inner-container">
<h1 class="h1 page-title">What happens when creative people are involved in shaping solutions to the issues we face as a society?</h1>
</div>
<nav class="page-nav inner-container">
<ul class="list-unstyled mt-nudge">
<!-- <li><a href="#approach" class="future-A h3 smooth-scroll" style=" color:white;">approach</a></li> -->
<li><a href="#practice-areas" class="future-A h3 smooth-scroll" style=" color:white;">practice areas</a></li>
<li><a href="#capabilities" class="future-A h3 smooth-scroll" style=" color:white;">capabilities</a></li>
<li><a href="#team" class="future-A h3 smooth-scroll" style=" color:white;">team</a></li>
</ul>
</nav>
</div>
</div>
</section>
<!-- <section id="approach" class="about__approach">
<div class="outer-container mt-3 mb-3">
<div class="inner-container">
<h3 class="future-A">approach</h3>
<p class="mt-1">We differ from large consultancies and small studios by how we conduct our engagements.</p>
</div>
</div>
<div class="full-height page-section">
<div class="outer-container">
<div class="flex-blocks">
<div class="flex-left column column-span-4" style="display: flex; flex-direction: column; justify-content: center;">
<h3 class="future-A">research-led strategy</h3>
<p class="mt-1">Understanding the unique conditions of your organization's strategy and policy, as well the needs of audiences and users, is the starting point of any engagement. Only when we truly understand the problem do we start to develop solutions.</p>
</div>
<div class="flex-right column column-span-8">
<img src="http://via.placeholder.com/900X900" alt="">
</div>
</div>
</div>
</div>
<div class="full-height page-section">
<div class="outer-container">
<div class="flex-blocks">
<div class="flex-left column column-span-4" style="display: flex; flex-direction: column; justify-content: center;">
<h3 class="future-A">involving you</h3>
<p class="mt-1">Our most fruitful engagements are with clients who care. We involve you so that you have the opportunity to shape the direction of our work together. Our process may challenge you to think beyond your expectations, but you can rely on us to always keep your best interests in mind.</p>
</div>
<div class="flex-right column column-span-8">
<img src="http://via.placeholder.com/900X900" alt="">
</div>
</div>
</div>
</div>
<div class="full-height page-section">
<div class="outer-container">
<div class="flex-blocks">
<div class="flex-left column column-span-4" style="display: flex; flex-direction: column; justify-content: center;">
<h3 class="future-A">original solutions</h3>
<p class="mt-1">Our team of designers, strategists, and developers approach a challenge from all angles, resulting in intuitive, practical, and beautiful designs that are well-executed.</p>
</div>
<div class="flex-right column column-span-8">
<img src="http://via.placeholder.com/900X900" alt="">
</div>
</div>
</div>
</div>
</section> -->
<section id="practice-areas" class="page-section about__practice-areas use-ui-light-theme " > <!-- -->
<div class="outer-container">
<div class="inner-container">
<h3 class="future-A">practice areas</h3>
<p class="mt-1">Since 2007, we’ve worked with organizations in four key sectors that shape the ideas and interactions we have with one another.</p>
</div>
</div>
<div class="outer-container mt-5">
<div class="os-row">
<div class="os-column os-span-12 os-span-6-md mb-1">
<div class="about__block" style="background-image:url(<?php echo os_path('policy.jpg', 'about') ?>)">
<div class="about__block-text">
<h3 class="future-A h3" style=" color:white;">policy & civic sector</h3>
</div>
</div>
</div>
<div class="os-column os-span-12 os-span-6-md mb-1">
<div class="about__block" style="background-image:url(<?php echo os_path('education.jpg', 'about') ?>)">
<div class="about__block-text">
<h3 class="future-A h3" style=" color:white;">education</h3>
</div>
</div>
</div>
<div class="os-column os-span-12 os-span-6-md mb-1">
<div class="about__block" style="background-image:url(<?php echo os_path('media.jpg', 'about') ?>)">
<div class="about__block-text">
<h3 class="future-A h3" style=" color:white;">media</h3>
</div>
</div>
</div>
<div class="os-column os-span-12 os-span-6-md mb-1">
<div class="about__block" style="background-image:url(<?php echo os_path('culture.jpg', 'about') ?>)">
<div class="about__block-text">
<h3 class="future-A h3" style=" color:white;">culture</h3>
</div>
</div>
</div>
</div>
</div>
</section>
<section id="capibilities" class="page-section about__capibilities use-ui-light-theme" > <!-- -->
<div class="outer-container mt-5">
<div class="inner-container">
<h3 class="future-A">capabilities</h3>
<p class="mt-1">We believe that involving design thinking to tackle complex questions can yield more dynamic, trusting, and accountable communities. Our capabilities include, but are not limited to:</p>
</div>
</div>
<div class="outer-container mt-5">
<div class="os-row">
<div class="os-column os-span-12 os-span-6-sm os-offset-1-md os-span-5-md os-offset-0-lg os-span-3-lg">
<h3 class="future-A">define</h3>
<ul class="about__column-list mt-1">
<li>Vision & goals setting</li>
<li>Brand architecture analysis</li>
<li>Policy brainstorms</li>
<li>Team structure analysis</li>
<li>Guides & how-to handbooks</li>
<li>Workshop design & facilitation</li>
<li>Community engagement</li>
</ul>
</div>
<div class="os-column os-span-12 os-span-6-sm os-span-5-md os-span-3-lg">
<h3 class="future-A">research</h3>
<ul class="about__column-list mt-1">
<li>Content, communications, & visual identity auditing</li>
<li>Stakeholder interviews</li>
<li>Journey mapping</li>
<li>User persona definition</li>
<li>Comparative analysis</li>
<li>Network mapping</li>
<li>Brand positioning</li>
</ul>
</div>
<div class="os-column os-span-12 os-span-6-sm os-offset-1-md os-span-5-md os-offset-0-lg os-span-3-lg">
<h3 class="future-A">create</h3>
<ul class="about__column-list mt-1">
<li>Visual & digital design</li>
<li>Experience & wayfinding design</li>
<li>Content strategy</li>
<li>Sitemapping</li>
<li>Information architecture</li>
<li>Messaging development</li>
<li>Brand guidelines creation</li>
</ul>
</div>
<div class="os-column os-span-12 os-span-6-sm os-span-5-md os-span-3-lg">
<h3 class="future-A">build</h3>
<ul class="about__column-list mt-1">
<li>Wireframing</li>
<li>Front-end & back-end development</li>
<li>Responsive development</li>
<li>Accessible development</li>
<li>Print & physical production oversight</li>
<li>Video production</li>
</ul>
</div>
</div>
</div>
</section>
<section id="team" class="page-section use-ui-light-theme about__team pb-5" >
<div class="outer-container mt-5">
<div class="inner-container">
<h3 class="future-A">team</h3>
<p class="mt-1">We are a civic-minded group with a flexible skill set that can solve a range of challenges.</p>
</div>
</div>
<?php
$bios= new WP_Query(
array(
'post_type' => 'bio',
'order' => 'ASC'
)
);
if ($bios->have_posts()) :
?>
<div class="outer-container mt-5">
<div class="os-row">
<?php
while ($bios->have_posts()) : $bios->the_post();
?>
<div class="os-column os-span-12 os-span-6-md mb-1">
<div class="about__block" style="position: relative; background-image:url(<?php echo get_the_post_thumbnail_url(get_the_ID(), 'large'); ?>)">
<div class="about__block-text">
<h3 class="future-A h3" style=" color:white;"><?php the_title() ; ?></h3>
<h3 class="future-A h3" style=" color:white;opacity:.4;"><?php echo get_the_excerpt() ; ?></h3>
</div>
</div>
</div>
<?php endwhile; ?>
</div>
</div>
<?php endif; ?>
<div class="outer-container mt-5">
<div class="inner-container">
<p class="mt-1">Since the start of Objective Subject, we’ve worked with some talented people. Gone, but not forgotten a few of our fellow co-workers:</p>
<ul class="list-unstyled mt-1">
<li>Aaron Carámbula <em>@carambula</em>, Facebook
</li>
<li>Emma White <em>@nodilemma</em>, Portal A
</li>
<li>Sam Gray <em>@samrgray</em>, BlenderBox
</li>
<li>Kuan Luo <em>@kuanluo</em>, Etsy / Grand St
</li>
<li>Blake Olmstead <em>@blakeolmstead</em>, Atlas Obscura
</li>
<li>Zack Seuberling <em>@zackseuberling</em>, Rumors
</li>
<li>Mark Silver <em>@markdsilver</em>, The New York Times
</li>
<li>Dan Shin <em>@dan_shin</em>, Square</li>
<li>
Houman Momtazian, Everything Type Company</li>
</ul>
</div>
</div>
<div class="outer-container">
<h3 class="future-A inner-container mt-3">Recognition</h3>
<ul class="list-unstyled clearfix mt-1 inner-container about__column-list mb-3">
<li>
<strong>Webby Awards 2015</strong>, Travel Design<br/>
<a href="http://www.nytimes.com/times-journeys/" target="_blank"><em>New York Times, Times Journeys</em></a>
</li>
<li>
<strong>German Design Award 2013</strong>, Identity Design<br/>
<a href="http://www.ap.org/company/brand" target="_blank"><em>Associated Press</em></a>
</li>
<li>
<strong>Red Dot Award 2014</strong>, Online Design<br/>
<a href="http://www.nytimes.com/times-journeys/" target="_blank"><em>New York Times, Times Journeys</em></a>
</li>
<li>
<strong>Red Dot Award 2012</strong>, Corporate Design<br/>
<a href="http://www.ap.org/company/brand" target="_blank"><em>Associated Press</em></a>
</li>
<li>
<strong>W3 Awards 2014</strong>, Gold Winner<br/>
<a href="http://www.nytimes.com/times-journeys/" target="_blank"><em>New York Times, Times Journeys</em></a>
</li>
<li>
<strong>W3 Awards 2012</strong>, Website Design<br/>
<a href="http://www.watsonadventures.com/" target="_blank"><em>Watson Adventures</em></a>
</li>
<li>
<strong>Davey Awards 2014</strong><br/>
<a href="http://www.nytimes.com/times-journeys/" target="_blank"><em>New York Times, Times Journeys</em></a>
</li>
</ul>
</div>
</section>
<?php get_footer(); ?>