<commit_before>---
layout: casestudy
class: bedow
permalink: /work/bedow/
title: Bedow Case Study - 14islands
name: Bedow
headline: Re-thinking design with Bedow.
description: Re-thinking design with Bedow.
color: '#F4F1E4'
hoverColor: '#F9F4E0'
logo: logo_bedow.min.svg
image: /images/work/bedow/icon-extraordinary.svg
imageClass: box__content__img--max-450
hasDarkTypography: true
priority: 4
private: true
og_image: xxx
---


{% include casestudy-header.html about="Bedow is an award winning design studio in Stockholm, Sweden. They also happen to be our neighbors. We couldn’t be more delighted to team up with an agency with such an impressive design portfolio." %}

{% include casestudy-video.html vimeoId="148325154" ratio="16_9" class="pjax-animate" %}

<section id="about" class="grid u--pad-both">
	<div class="grid__row">
{% markdown %}
## It's in the details

Thinking outside the box is something we reminds ourselves to practice. The idea of not having a typical “hamburger icon” in the site gave us a smile. Branding based on icons and typography instead of a logo? Bring it!
{% endmarkdown %}

	</div>

</section>

<section class="grid u--pad-both">
	<div class="grid__row">
{% markdown %}
## Freshing it up

The site features a customizable grid that lets them design their pages as they see fit. Lots of breathing room and flexibility to help them showcase their cases in a better way.

{% endmarkdown %}
	</div>

</section>


<section class="grid u--pad-bottom">
	<div class="grid__row">
{% markdown %}
## Technologies

Responsive at it’s core. The site uses Wordpress with a custom content architecture and our own [theme boilerplate](https://github.com/14islands/fourteen).

{% endmarkdown %}

	</div>

	<div class="grid__row--wide-content casestudy__technology-list u--pad-top--half">
		<a class="casestudy__technology-item" href="https://wordpress.org/">
			 {% include svgs/technology-logos/logo_wordpress.min.svg %}
			 <h3 class="casestudy__technology-title">Wordpress</h3>
			 <p class="casestudy__technology-description">Content management.</p>
		</a><!-- Remove spacing
		--><a class="casestudy__technology-item" href="http://www.advancedcustomfields.com/">
			 {% include svgs/technology-logos/logo_acf.min.svg %}
			 <h3 class="casestudy__technology-title">Advanced Custom Fields</h3>
			 <p class="casestudy__technology-description">Multible content types for WordPress.</p>
		</a><!-- Remove spacing
		--><a class="casestudy__technology-item" href="https://www.mapbox.com/">
			 {% include svgs/technology-logos/logo_mapbox.min.svg %}
			 <h3 class="casestudy__technology-title">Mapbox</h3>
			 <p class="casestudy__technology-description">Custom designed map.</p>
		</a><!-- Remove spacing
		--><a class="casestudy__technology-item" href="http://miguel-perez.github.io/smoothState.js/">
			 {% include svgs/technology-logos/logo_github.min.svg %}
			 <h3 class="casestudy__technology-title">smoothState</h3>
			 <p class="casestudy__technology-description">Smooth page transitions.</p>
		</a><!-- Remove spacing
		--><a class="casestudy__technology-item" href="https://greensock.com/">
			 {% include svgs/technology-logos/logo_greensock.min.svg %}
			 <h3 class="casestudy__technology-title">GreenSock</h3>
			 <p class="casestudy__technology-description">Animation Library.</p>
		</a><!-- Remove spacing
		--><a class="casestudy__technology-item" href="https://responsive.io/">
			 {% include svgs/technology-logos/logo_responsive-io.min.svg %}
			 <h3 class="casestudy__technology-title">responsive.io</h3>
			 <p class="casestudy__technology-description">Responsive Images as a service.</p>
		</a><!-- Remove spacing
		--><a class="casestudy__technology-item" href="http://stylus-lang.com/">
			 {% include svgs/technology-logos/logo_sass.min.svg %}
			 <h3 class="casestudy__technology-title">Stylus</h3>
			 <p class="casestudy__technology-description">CSS pre-processing.</p>
		</a><!-- Remove spacing
		--><a class="casestudy__technology-item" href="https://babeljs.io/">
			 {% include svgs/technology-logos/logo_github.min.svg %}
			 <h3 class="casestudy__technology-title">Babel</h3>
			 <p class="casestudy__technology-description">Compiles future JavaScript.</p>
		</a><!-- Remove spacing
		--><a class="casestudy__technology-item" href="http://modernizr.com/">
			 {% include svgs/technology-logos/logo_modernizr.min.svg %}
			 <h3 class="casestudy__technology-title">Modernizr</h3>
			 <p class="casestudy__technology-description">Browser and device feature detection.</p>
		</a><!-- Remove spacing
		--><a class="casestudy__technology-item" href="http://jquery.com/">
			 {% include svgs/technology-logos/logo_jquery.min.svg %}
			 <h3  class="casestudy__technology-title">jQuery</h3>
			 <p class="casestudy__technology-description">DOM manipulation and more.</p>
		</a><!-- Remove spacing
		--><a class="casestudy__technology-item" href="https://github.com/14islands/component-loader">
			 {% include svgs/technology-logos/logo_github.min.svg %}
			 <h3 class="casestudy__technology-title">Component Loader</h3>
			 <p class="casestudy__technology-description">Simple JavaScript components.</p>
		</a>
		</div>

</section>

{% include casestudy-quote.html quote="We are very impressed to have worked with 14islands. The result is exactly what we envisoned and more - I hope to get to work with them again." author-image-src="/images/work/montgomery/rm-large.jpg" author-name="<NAME>" author-job-title="Chief Investment Officer at Montinvest.com" %}

<section class="grid u--pad-both">
	<div class="grid__row">
		{% markdown %}

## Conclusion

The sinergy in projects like this is an important factor for the outcome and we are happy with the result. Thank you Bedow for the opportunity and for sharing your design perspective with us.

{% include casestudy-button.html site-url="http://bedow.se/" %}

Want to work with us? [Get in touch](/contact/)

{% endmarkdown %}
	</div>
</section>
<commit_msg>bedow: copy changes<commit_after>---
layout: casestudy
class: bedow
permalink: /work/bedow/
title: Bedow Case Study - 14islands
name: Bedow
headline: Re-thinking design with Bedow.
description: Re-thinking design with Bedow.
color: '#F4F1E4'
hoverColor: '#F9F4E0'
logo: logo_bedow.min.svg
image: /images/work/bedow/bedow-illustration.svg
imageClass: box__content__img--max-450
hasDarkTypography: true
priority: 4
private: true
og_image: xxx
---


{% include casestudy-header.html about="Bedow is an award winning design studio in Stockholm, Sweden. They also happen to be our neighbors. We couldn’t be more delighted to team up with an agency with such an impressive design portfolio." %}

{% include casestudy-video.html vimeoId="170581276" ratio="16_9" class="pjax-animate" %}

<section class="grid u--pad-both">
	<div class="grid__row">
{% markdown %}
## New design

Bedow is known for it's [creative ideas](http://bedow.se/work) and their new website couldn't be any different. They presented us with an idea they had for their next website version where we felt on-board from the start.
{% endmarkdown %}
	</div>

</section>

{% include casestudy-responsive.html url="/images/work/bedow/iphone6-full-page.jpg" parallax=true parallaxOffset="-0.6" parallaxDirection="vertical" %}

<section class="grid u--pad-both">
	<div class="grid__row">
{% markdown %}
## Freshing it up

The site features a customizable grid that lets them design their pages as they see fit. Lots of breathing room and flexibility to help them showcase their cases in a better way.

{% endmarkdown %}
	</div>

</section>

<section id="about" class="grid u--pad-both">
	<div class="grid__row">
{% markdown %}
## It's in the details

Thinking outside the box is something we reminds ourselves to practice. The idea of not having a typical “hamburger icon” in the site gave us a smile. Branding based on icons and typography instead of a logo? Bring it!
{% endmarkdown %}

	</div>

</section>

<section class="grid u--pad-both u-bg-bright">
	<div class="grid__row">
{% markdown %}
## Neighboring

The fact that we are [neighbors](https://14islands.com/contact/) made good face-to-face communication prominent. Quick catch-ups also allowed us taking some decisions ["in the browser"](https://speakerdeck.com/14islands/responsive-web-design-recap?slide=70) - making it an agile and open-minded process.

{% endmarkdown %}
	</div>

	{% include wide-content-image.html src="/images/work/bedow/14islands-Bedow-meeting-bw.jpg" alt="Bedow visiting 14islands HQ" margin="top" ratio="16_9" %}

</section>

<section class="grid u--pad-both">
	<div class="grid__row">
{% markdown %}
## Technologies

Responsive at it’s core. The site uses Wordpress with a custom content architecture and our own [theme boilerplate](https://github.com/14islands/fourteen).

{% endmarkdown %}

	</div>

	<div class="grid__row--wide-content casestudy__technology-list u--pad-top--half">
		<a class="casestudy__technology-item" href="https://wordpress.org/">
			 {% include svgs/technology-logos/logo_wordpress.min.svg %}
			 <h3 class="casestudy__technology-title">Wordpress</h3>
			 <p class="casestudy__technology-description">Content management.</p>
		</a><!-- Remove spacing
		--><a class="casestudy__technology-item" href="http://www.advancedcustomfields.com/">
			 {% include svgs/technology-logos/logo_acf.min.svg %}
			 <h3 class="casestudy__technology-title">Advanced Custom Fields</h3>
			 <p class="casestudy__technology-description">Multible content types for WordPress.</p>
		</a><!-- Remove spacing
		--><a class="casestudy__technology-item" href="https://www.npmjs.com/">
			 {% include svgs/technology-logos/logo_npm.min.svg %}
			 <h3 class="casestudy__technology-title">NPM</h3>
			 <p class="casestudy__technology-description">Package manager for JavaScript.</p>
		</a><!-- Remove spacing
		--><a class="casestudy__technology-item" href="http://miguel-perez.github.io/smoothState.js/">
			 {% include svgs/technology-logos/logo_github.min.svg %}
			 <h3 class="casestudy__technology-title">smoothState</h3>
			 <p class="casestudy__technology-description">Smooth page transitions.</p>
		</a><!-- Remove spacing
		--><a class="casestudy__technology-item" href="https://greensock.com/">
			 {% include svgs/technology-logos/logo_greensock.min.svg %}
			 <h3 class="casestudy__technology-title">GreenSock</h3>
			 <p class="casestudy__technology-description">Animation Library.</p>
		</a><!-- Remove spacing
		--><a class="casestudy__technology-item" href="https://responsive.io/">
			 {% include svgs/technology-logos/logo_responsive-io.min.svg %}
			 <h3 class="casestudy__technology-title">responsive.io</h3>
			 <p class="casestudy__technology-description">Responsive Images as a service.</p>
		</a><!-- Remove spacing
		--><a class="casestudy__technology-item" href="http://stylus-lang.com/">
			 {% include svgs/technology-logos/logo_stylus.min.svg %}
			 <h3 class="casestudy__technology-title">Stylus</h3>
			 <p class="casestudy__technology-description">CSS pre-processing.</p>
		</a><!-- Remove spacing
		--><a class="casestudy__technology-item" href="https://babeljs.io/">
			 {% include svgs/technology-logos/logo_github.min.svg %}
			 <h3 class="casestudy__technology-title">Babel</h3>
			 <p class="casestudy__technology-description">Compiles future JavaScript.</p>
		</a><!-- Remove spacing
		--><a class="casestudy__technology-item" href="http://modernizr.com/">
			 {% include svgs/technology-logos/logo_modernizr.min.svg %}
			 <h3 class="casestudy__technology-title">Modernizr</h3>
			 <p class="casestudy__technology-description">Browser and device feature detection.</p>
		</a><!-- Remove spacing
		--><a class="casestudy__technology-item" href="http://jquery.com/">
			 {% include svgs/technology-logos/logo_jquery.min.svg %}
			 <h3  class="casestudy__technology-title">jQuery</h3>
			 <p class="casestudy__technology-description">DOM manipulation and more.</p>
		</a><!-- Remove spacing
		--><a class="casestudy__technology-item" href="https://github.com/14islands/component-loader">
			 {% include svgs/technology-logos/logo_github.min.svg %}
			 <h3 class="casestudy__technology-title">Component Loader</h3>
			 <p class="casestudy__technology-description">Simple JavaScript components.</p>
		</a><!-- Remove spacing
		--><a class="casestudy__technology-item" href="https://github.com/14islands/fourteen">
			 {% include svgs/technology-logos/logo_github.min.svg %}
			 <h3 class="casestudy__technology-title">Fourteen</h3>
			 <p class="casestudy__technology-description">Minimalistic Wordpress boilerplate theme.</p>
		</a>
		</div>

</section>

{% include casestudy-quote.html quote="We are very impressed to have worked with 14islands. The result is exactly what we envisoned and more - I hope to get to work with them again." author-image-src="/images/work/bedow/bedow_Perniclas_Bedow.jpg" author-name="<NAME>" author-job-title="Creative Director" %}

<section class="grid u--pad-both">
	<div class="grid__row">
		{% markdown %}

## Conclusion

The sinergy in projects like this is an important factor for the outcome and we are happy with the result. Thank you Bedow for the opportunity and for sharing your design perspective with us.

{% include casestudy-button.html site-url="http://bedow.se/" %}

Want to work with us? [Get in touch](/contact/)

{% endmarkdown %}
	</div>
</section>

{'fraction_non_alphanumeric': 0.14704779053192288, 'fraction_numerical': 0.009303023482631855, 'mean_word_length': 4.636363636363637, 'pattern_counts': {'":': 0, '<': 208, '<?xml version=': 0, '>': 208, 'https://': 17, 'lorem ipsum': 0, 'www.': 4, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '2632578', 'n_tokens_mistral': 4818, 'n_tokens_neox': 4169, 'n_words': 1042}