<!-- @import "../_frame/header.kit" -->
<div class="container project-page">
  <a class="back-btn" href="index.html">&larr; Back</a>
  <div class="intro">
    <h1>Kungliga Operan
            <small>Website, 2015, At Mogul</small>
        </h1>
    <h2>Introduction</h2>
    <p>
      The Royal Opera is Sweden’s National Stage for the Opera arts. In 2015 we designed and implemented their new responsive website.
      I was responsible for most of the design and implementation throughout the project and developed content strategies,
      wireframes, style guides and frontend guidelines. The original Royal Opera graphic identity is designed by <i>Stockholm Graphics</i>      and we collaborated to transfer the design, typography and imagery to screens of all sizes.
    </p>
    <h2>Honors & Awards</h2>
    <p>Operan.se was awarded <a href="http://internetworld.idg.se/2.1006/1.677379/topp100-2017-livsstil">Best Lifestyle Site of the Year</a>      by Internetworld in Mars, 2017 and was nominated to the <a href="http://www.designpriset.se/">Swedish Design Award 2016</a></p>
    <h2>Role</h2>
    <p>Designer & lead front-end developer</p>
    <br/>
    <p><a href="http://www.operan.se/">www.operan.se</a></p>
  </div>
  <figure>
    <img src="images/operan/1.jpg" alt="operan">
  </figure>
  <figure>
    <img src="images/operan/3.jpg" alt="operan">
  </figure>
  <figure>
    <img src="images/operan/2.jpg" alt="operan">
  </figure>
  <figure>
    <img src="images/operan/4.jpg" alt="operan">
    <figcaption>We worked closely with the website editors to create a smart, responsive component library that they could use to create
      a lot of different page variations.</figcaption>
  </figure>
  <figure>
    <img src="images/operan/5.jpg" alt="operan">
    <figcaption> The new website also let the audience experience the opera at all times through Operan Play - a huge archive of playlists,
      podcasts and videos from shows played at the Opera.</figcaption>
  </figure>
  <a class="back-btn" href="index.html">&larr; Back</a>
</div>
<!-- @import "../_frame/footer.kit" -->
