Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Fetching contributors…

Cannot retrieve contributors at this time

106 lines (90 sloc) 5.227 kb
<?
$page_title = "Flite Case Study";
$caseStudiesTab = true;
?>
<?php include("includes/_header.php"); ?>
<style type="text/css">
.snipt-embed-meta-container { display: none; }
.snipt-embed-code { height: 370px; }
.snipt-embed-byline { display: block; }
</style>
<!-- Grid BG -->
<div id="gridBgShort" class="container hide-on-phones">
<div class="white-fade"></div>
<div class="row">
<div class="one columns"></div><div class="one columns hide-on-phones"></div><div class="one columns hide-on-phones"></div><div class="one columns hide-on-phones"></div><div class="one columns hide-on-phones"></div><div class="one columns hide-on-phones"></div><div class="one columns hide-on-phones"></div><div class="one columns hide-on-phones"></div><div class="one columns hide-on-phones"></div><div class="one columns hide-on-phones"></div><div class="one columns hide-on-phones"></div><div class="one columns hide-on-phones"></div>
</div>
</div>
<!-- /Grid BG -->
<div id="insideContainer" class="container">
<div class="row hide-on-phones">
<a href="index.php" class="back two columns hide-on-phones">&larr; Home</a>
</div>
<div class="row">
<div class="twelve columns">
<nav class="on-page hide-on-phones">
<ul>
<li><a href="case-swizzle.php">Swizzle</a></li>
<li><a href="case-soapbox.php">ZURBsoapbox</a></li>
<li><a href="case-foundation.php">Foundation</a></li>
<li><a href="case-reel.php">Reel</a></li>
<li><a href="case-zurbjobs.php">ZURBjobs</a></li>
<li class="current"><a href="case-flite.php">Flite</a></li>
</ul>
</nav>
<h1 class="light-weight">Flite</h1>
</div>
</div>
<div class="row">
<div class="eight columns">
<div class="frame"><a href="http://www.flite.com/" target="_blank"><img src="images/case-flite1.jpg"></a></div>
</div>
<div class="four columns">
<h4>Flite: Foundation Was the Way To Go</h4>
<p>When online advertising tech firm <a href="http://www.flite.com/" target="_blank">Flite</a> needed to do a redesign of its website, it knew that it had to work on any device, not just desktops. So the company looked around for a responsive framework. George Penston, VP of Product Design, had been following all that we do at ZURB and knew that the company had to take a look at Foundation to meet its needs. Foundation integrated well with SASS and Compass, something Flite has made essential to its development toolkit. While there were other frameworks out there, George said that Foundation was the way to go. </p>
<p>For the folks at Flite, Foundation had a nice, complete package with all the buttons and forms that they needed. As Andy Yang, Principal UX Designer, put it:
<blockquote>
“Getting up to speed was super easy.”
</blockquote>
Andy had Foundation up and running in a day. Then it was just a matter of building out the entire site, which took about another two weeks. </p>
</div>
</div>
<br/><br />
<div class="row">
<div class="seven columns">
<h5>Integrating Their Design with Foundation</h5>
<p>Flite started the design work on the site before deciding to use Foundation. The company had already solidified the design for their site. However, they didn’t have much trouble backing the design into Foundation’s framework. Not only that but Flite was able to integrate Foundation into its SASS+Compass workflow. George told us that was a real boon for the team.</p>
<h5>Retina Display ... No Problem</h5>
<p>Preparing for the new iPad and its retina display ahead of time, the folks at Flite added retina support for key graphical elements into their SCSS/CSS. Take a look to see how they did it: <script src="http://snipt.org/embed/vaGc7"></script> </p>
</div>
<div class="five columns">
<a href="http://www.flite.com/" target="_blank">
<img src="images/case-flite2.jpg">
</a>
<br/>
<br/>
<h5>Would Use it Again</h5>
<p>In the end, the new site looked fantastic on all devices thanks to Foundation. Flite found a new tool that easily integrates with the other tools, such as SASS and Compass, in its toolbox. And the team would use Foundation again.
<blockquote>
“Overall, I would definitely use it again for other projects” — Andy
</blockquote>
</p>
</div>
</div>
<br><br>
<div class="row">
<div class="twelve columns">
<a class="hide-on-phones nice blue button right" href="case-swizzle.php">Case Study: Swizzle &rarr;</a>
<!-- <a class="left hide-on-desktops" href="mobile.php">&larr; Mobility</a> -->
<a class="right show-on-phones" href="case-swizzle.php">Case Study: Swizzle &rarr;</a>
</div>
<br><br>
<nav class="ten columns show-on-phones">
<ul>
<li><a href="#">Documentation</a></li>
<li><a href="#">On Github</a></li>
<li><a class="nice small blue button src-download" href="files/foundation-download-<?= $version ?>.zip">Download</a></li>
</ul>
</nav>
</div>
<?php include("includes/_footer.php"); ?>
Jump to Line
Something went wrong with that request. Please try again.