patternlibrary/static-layouts/design-output/case_study.html
2018-09-05 18:58:00 -04:00

288 lines
12 KiB
HTML

<!doctype html>
<html lang="en-US">
<head>
<title>Case Study | Agaric</title>
<link rel="stylesheet" href="../../agaric/css/agaric.css">
</head>
<body>
<div class="is-fixed">
<nav class="navbar" id="navbar">
<div class="navbar-brand">
<a class="navbar-item" href="index.html">
<svg version="1.1" id="logo" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 95 37" style="enable-background:new 0 0 95 37;" xml:space="preserve">
<path class="logo-color" d="M13,8.8c-0.7-0.8-1.5-1.3-2.4-1.7C9.7,6.7,8.8,6.5,7.8,6.5c-2.2,0-4,0.8-5.5,2.5C0.8,10.6,0,12.7,0,15.3
c0,2.5,0.8,4.5,2.3,6.2c1.6,1.7,3.4,2.5,5.5,2.5c1,0,1.8-0.2,2.7-0.5c0.8-0.3,1.6-0.9,2.4-1.7v1.8h4.2V6.9H13V8.8z M11.9,18.8
c-0.9,0.9-1.9,1.4-3.2,1.4c-1.3,0-2.3-0.5-3.2-1.4c-0.9-0.9-1.3-2.1-1.3-3.5c0-1.4,0.4-2.6,1.3-3.5c0.8-0.9,1.9-1.4,3.2-1.4
c1.3,0,2.4,0.4,3.3,1.3c0.9,0.9,1.3,2.1,1.3,3.5C13.2,16.7,12.7,17.9,11.9,18.8z"/>
<path class="logo-color" d="M55.5,23.5V6.9h-4.2v1.8c-0.7-0.8-1.5-1.3-2.4-1.7c-0.9-0.4-1.8-0.6-2.8-0.6c-2.2,0-4,0.8-5.5,2.5
c-1.5,1.6-2.3,3.7-2.3,6.3c0,2.5,0.8,4.5,2.3,6.2c1.6,1.7,3.4,2.5,5.5,2.5c1,0,1.8-0.2,2.7-0.5c0.8-0.3,1.6-0.9,2.4-1.7v1.8H55.5z
M50.2,18.8c-0.9,0.9-1.9,1.4-3.2,1.4c-1.3,0-2.3-0.5-3.2-1.4c-0.9-0.9-1.3-2.1-1.3-3.5c0-1.4,0.4-2.6,1.3-3.5
c0.8-0.9,1.9-1.4,3.2-1.4c1.3,0,2.4,0.4,3.3,1.3c0.9,0.9,1.3,2.1,1.3,3.5C51.5,16.7,51.1,17.9,50.2,18.8z"/>
<path class="logo-color" d="M86.8,20.1c-1.5,0-2.7-0.4-3.6-1.3c-0.9-0.9-1.4-2-1.4-3.4c0-1.4,0.5-2.6,1.4-3.6c1-0.9,2.2-1.4,3.8-1.4
c0.9,0,1.6,0.1,2.2,0.4c0.6,0.3,1.3,0.7,1.9,1.4l3.5-1.9c-0.8-1.2-1.9-2.1-3.2-2.8c-1.3-0.7-2.8-1-4.4-1c-1.8,0-3.4,0.4-4.8,1.2
c-1.4,0.8-2.6,1.8-3.4,3.2c-0.8,1.3-1.2,2.8-1.2,4.4c0,2.3,0.8,4.3,2.5,6.1c1.6,1.7,3.9,2.6,6.8,2.6c3.2,0,5.7-1.2,7.5-3.5
l-3.3-2.2C90.1,19.5,88.6,20.1,86.8,20.1z"/>
<path class="logo-color" d="M34.2,5.7l-1.7,1.7c-1.1-0.6-2.4-1-3.7-1c-7.6,0-9.1,5.6-9.1,8.7c0,1.6,0.4,3.9,1.9,5.7
c-1.4,2.2-2.9,6.2-1.7,9.8c0.3,1.4,1.1,2.6,2.3,3.7c1.6,1.5,3.6,2.2,5.9,2.2c0,0,0,0,0,0c0,0,0,0,0,0c2.3,0,4.3-0.7,5.9-2.2
c1.6-1.5,2.4-3.3,2.4-5.4c0-2.2-1.4-3.2-3.3-3.2h-9.7c0.3-1.1,0.7-2.1,1.1-2.7c1.2,0.5,2.6,0.8,4.3,0.8c2.2,0,4.1-0.8,5.6-2.5
c1.5-1.6,2.3-3.7,2.3-6.2c0-2-0.5-3.7-1.4-5.1l1.7-1.7L34.2,5.7z M32.6,29.5c-0.1,0.9-0.5,1.6-1.2,2.2c-0.9,0.9-2,1.3-3.4,1.3
c0,0,0,0-0.1,0l0,0l0,0c0,0,0,0-0.1,0c-1.4,0-2.4-0.4-3.4-1.3c-0.7-0.7-1.1-1.4-1.2-2.2H32.6z M31.2,18.7c-0.9,0.9-1.9,1.4-3.2,1.4
c-1.3,0-2.4-0.5-3.2-1.4c-0.9-0.9-1.3-2.1-1.3-3.6c0-1.4,0.4-2.6,1.3-3.5c0.9-0.9,1.9-1.3,3.3-1.3c1.3,0,2.4,0.5,3.2,1.4
c0.8,0.9,1.3,2.1,1.3,3.5C32.5,16.6,32.1,17.8,31.2,18.7z"/>
<rect x="71.4" y="6.9" class="logo-color" width="4.2" height="16.6"/>
<circle class="logo-color" cx="73.5" cy="2.7" r="2.7"/>
<rect x="38.3" y="25.9" class="logo-color" width="55.6" height="3.6"/>
<rect x="0.8" y="25.9" class="logo-color" width="16.4" height="3.6"/>
<path class="logo-color" d="M58.3,6.9v16.6h4.1v-8.6c0-3.2,1-4.7,3.1-4.7c0.7,0,1.4,0.3,2.1,0.8l1.8-3.5c-1.1-0.7-2.2-1-3.2-1
c-0.8,0-1.4,0.1-2,0.4c-0.5,0.3-1.2,0.8-1.9,1.5V6.9H58.3z"/>
</svg>
</a>
<div class="navbar-burger burger" data-target="navMenuColorblack-example">
<span></span>
<span></span>
<span></span>
</div>
</div>
<div id="navbar-menu" class="navbar-menu">
<div class="navbar-end">
<a class="navbar-item " href="#" title="Services">Services</a>
<a class="navbar-item " href="#" title="Work">Work</a>
<a class="navbar-item " href="#" title="Initiatives">Initiatives</a>
<div class="navbar-item has-dropdown is-hoverable">
<a class="navbar-link is-active" href="#" title="About">About</a>
<div class="navbar-dropdown">
<a class="navbar-item is-active" href="#" title="Team">Team</a>
<a class="navbar-item " href="#" title="Events">Events</a>
</div>
</div>
<a class="navbar-item " href="#" title="Insights">Insights</a>
<a class="navbar-item " href="#" title="Contact">Contact</a>
<div class="navbar-item">
<a href="search.html" title="Search" class="navbar-item">
<span class="icon"><span class="agc agc-search"></span></span>
</a>
</div>
</div>
</div>
</nav>
</div>
<section class="hero hero-project is-cinnamon">
<div class="container">
<div class="hero-image">
<img src="../assets/img/fpo-findit-cinnamon.jpg" alt="">
</div>
<div class="hero-body">
<h1 class="title">Find it Cambridge</h1>
<h2 class="subtitle">Connecting families, youth, and caregivers with much needed resources</h2>
</div>
</div>
</section>
<section class="section" data-headerbg="light">
<div class="container">
<div class="flow content">
<div class="flow_middle">
<p class="subtitle is-mono">Introduction ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p>
<h4>The Challenge</h4>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip
ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril
delenit augue duis dolore te feugait nulla facilisi.</p>
<h4>Approach</h4>
<p>Lorem ipsum dolor sit amet, cons ectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip
ex ea commodo consequat.</p>
</div>
<div class="flow_breakout hero is-light">
<div class='carousel'>
<figure class="image">
<img src="../assets/img/fpo-fic-home.png" alt="">
<figcaption>
Lorem ipsum dolor sit amet, consectetur adipisicing elit.
</figcaption>
</figure>
<figure class="image">
<img src="../assets/img/fpo-fic-map.png" alt="">
<figcaption>
Ipsum dolor sit amet, consectetur adipisicing elit.
</figcaption>
</figure>
<figure class="image">
<img src="../assets/img/fpo-fic-page.png" alt="">
<figcaption>
Dolor sit amet, consectetur adipisicing elit.
</figcaption>
</figure>
<figure class="image">
<img src="../assets/img/fpo-fic-home.png" alt="">
<figcaption>
Sit amet, consectetur adipisicing elit.
</figcaption>
</figure>
<figure class="image">
<img src="../assets/img/fpo-fic-map.png" alt="">
<figcaption>
Ipsum dolor sit amet, consectetur adipisicing elit.
</figcaption>
</figure>
<figure class="image">
<img src="../assets/img/fpo-fic-page.png" alt="">
<figcaption>
Consectetur adipisicing elit.
</figcaption>
</figure>
</div>
</div>
<div class="flow_middle">
<h4>Results</h4>
<p>Lorem ipsum dolor sit amet, cons ectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip
ex ea commodo consequat.</p>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip
ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril
delenit augue duis dolore te feugait nulla facilisi.</p>
</div>
<div class="flow_full">
<div class="titlebar titlebar-bigborder content">
<div class="titlebar_title">
<h3 class="subtitle is-mono is-4">Project Details</h3>
</div>
</div>
<div class="columns">
<div class="column">
<p><b>Client:</b> City of Cambridge</p>
<p><b>Year:</b> 2016</p>
<p><b>Status:</b> Live (finditcambridge.org)</p>
</div>
<div class="column">
<p><b>Technologies:</b> Drupal, Python</p>
<p><b>Services:</b> Strategic consulting, design, prototyping, user testing, implementaiton, content migration</p>
</div>
<div class="column">
<p><b>Team:</b> Mauricio Dinarte, Ben Melanon, Micky Metts</p>
<p><b>Partners:</b> Code for Boston, Terravoz, TLDA</p>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="section related" data-headerbg="light">
<div class="container">
<div class="titlebar titlebar-bigborder content">
<div class="titlebar_title">
<h3 class="subtitle is-mono is-4">Updates</h3>
</div>
<div class="titlebar_links">
<a href="#">More</a>
</div>
</div>
<div class="columns">
<div class="column">
<a href="#" class="teaser">
<p class="title is-5 is-spaced">Lorem ipsum dolor sit amet, ibhdiam nonummy nibh</p>
<p class="subtitle is-6">Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>
</a>
</div>
<div class="column">
<a href="#" class="teaser">
<p class="title is-5 is-spaced">Dolor sit amet, consectetuer adipiscing elit, sed diam ibh</p>
<p class="subtitle is-6">Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>
</a>
</div>
<div class="column">
<a href="#" class="teaser">
<p class="title is-5 is-spaced">Suscipit lobortis nisl ut aliquip ex ea commodo consequat</p>
<p class="subtitle is-6">Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>
</a>
</div>
</div>
</div>
</section>
<footer class="footer" data-headerbg="light">
<div class="container">
<div class="columns">
<div class="column footer-logo is-half">
<a href="#"><span class="icon"><i class="agc agc-logo"></i></span></a>
</div>
<div class="column">
Agaric, LLC 288 Norfolk Street Cambridge, MA 02139
</div>
<div class="column">
S: <a href="#">Twitter</a>
<a href="#">Facebook</a>
<a href="#">RSS</a><br>
T: <a href="#">+1 508 283 3557</a><br>
E: <a href="#">Contact</a>
</div>
<div class="column">
Powered by <a href="#">Drupal</a>
</div>
</div>
</div>
</footer>
<div class="section hero is-dark" data-headerbg="light">
<div class="container">
Design links:
<a href="index.html">Home</a> |
<a href="work.html">Work</a> |
<a href="case_study.html">Case Study</a> |
<a href="initiatives.html">Initiatives</a> |
<a href="initiatives_initiative.html">Initiative</a> |
<a href="about_team.html">Team</a> |
<a href="about_team_member.html">Person</a> |
<a href="about_events.html">Events</a> |
<a href="about_events_event.html">Event</a> |
<a href="insights.html">Insights</a> |
<a href="insights_insight.html">Insight</a> |
<a href="bulma.html">Bulma Elements</a> |
&amp; <a href="../../styleguide/index.html">Styleguide</a>
</div>
</div>
<script src="../../agaric/js/jquery-3.2.1.min.js"></script>
<script src="../../agaric/js/ScrollMagic.min.js"></script>
<script src="../../agaric/js/slick.min.js"></script>
<script src="../../agaric/js/script.js"></script>
</body>
</html>