Äventyret

Modular, scalable and future-friendly Chef.se

The Swedish media house/management magazine Chef (Swedish for Boss), already had a prize winning website, a number of growing media businesses and a dynamic team. But they wanted more. In an industry characterized by constant and furiously rapid change, Chef needed a partner who could help with business development and strategies in an almost ambidextrous manner, while simultaneously actually designing and building innovative media services. When Chef found Äventyret (and vice versa), it was simply a matter of stepping on the gas.

Chef is a modern media company that is responsible for the creation of the Nordic region’s largest magazine on leadership, both in digital format and in print. Each month, Chef reaches more than 300,000 executives through digital channels and 153,000 executives through the print version of the magazine.

However, it doesn’t stop there. Chef also organizes several major events every year, holding networking events for executives and constantly develop new types of editorial content and new media businesses on different platforms.

Over the last two years (before Äventyret became its digital partner), Chef was the recipient of several awards. The most recent was in March 2017, when Chef.se was awarded the accolade of being one of Sweden’s 100 best sites. So obviously, the task was super exciting for Äventyret: Why waste time on simple challenges when you have the opportunity to work with Chef and makes something that is already good, even better?

chef_desk-2560x904
New Chef.se

Summer 2016 — Sealing the collaborative deal

When Äventyret first met Chef they were looking for a digital partner rather than a new website. However, they also had a handful of bug fixes that had to be fixed for the interface of their site at the time, but the main ideas were around new functionality. We initially chose to address the needs of Chef in the following order:

  1. Fixing interface bugs in the website at the time
  2. Develop new strategies and concepts in collaboration with Chef

However, after loading/submitting the old site, we added plans. The project Website Bug Fix needed to grow in order to address the following needs:

  • Greater editorial freedom for Chef to administer its own website
  • Implementation of low-hanging fruit for conversion and user personalization
  • A refresh of the design and style
  • A module-based interface (to facilitate rapid iterations and implementations of future functions)
  • Code releases and a well-thought out work flow for developers
  • Better performance

No one wanted to divide the work into two phases any longer (bug fix and concept/strategy work) as we initially thought. Instead, it was reasonable to collaborate on development and concept work in a series of projects and iterations, where the launch of the new Chef.se website was the first in line.

Fall 2016 — Free range vision

Äventyret and Chef used the fall season to draw up and plan the Chef.se of the future. Chef had many clear ideas and questions about new features. Äventyret placed no restrictions on the work so that it would be able to build in a first launch. Instead, we placed value on understanding what would be reasonable in two-three iterations, irrespective of budget and initial aspects of time. There were several advantages to this:

  • Some features were taking advantage of other features from the perspective of implementation. If several features required similar solutions, we may choose to add features earlier or postpone the addition of related features.
  • This would make it possible to plan sub-projects, versions and iterations.
  • The project gets a clear visionary direction, irrespective of whether all means are in place to implement all ideas at once. The first iterations of a product or service are the most important, as these form the foundations. Some extra time must be taken, while the smartest features can spice up the foundation work later. But keeping the buzz alive in the work group required the vision of the full product from the start.
chef-ws-1
Content Workshop with Chef, fall 2016.

The deliverables above were all from prototypes in Html+Css+Js, Invision-click-through-outline-prototypes, old school raster images and wireframes. Together, they would provide a vision of interaction principles, communication concepts and form styles for the new Chef. se.

The best thing is to challenge yourself and your beliefs, to step out into the unknown. For a long time, Chef has been at the leading digital edge of the magazine market, and we place high-level requirements on those with whom we work. In Äventyret, we have ourselves a freakishly strong digital partner that not only gets the situation, but also dares to challenge. We are only at the beginning of our shared journey and look forward to the next stages.  

— Calle Fleur, Digital Content Manager, Chef

Spring 2017 — Growing pains, a.k.a., the “Scope Document”

In order to be able to launch a new site at the end of May, we needed to take a step back from the brainstorming meeting in March and outline and reflect on how to prioritize the new features. Technical planning had been started in parallel with development of the vision and now required a defined scope.

Äventyret produced a specification of what should and could be managed before June, on the basis of the earlier offer made and development of the vision. Chef and Äventyret revised the specs together on two separate occasions prior to sign off. With this behind us, it meant that the project could take a new turn and head to Production!

Cause and effect

In parallel with a new website, Chef, Äventyret and Odyssey planned the management of the Chef user data. The goal: Chef will collect all customer data in a master database, which will provide even better customer service in all points of contact between Chef and its subscribers.

chef-ws-2
Paper is a superior prototype material!  A large part of the base concept for chef.se was the design of modules that can be combined editorially, in all possible combinations. Here, we tested the modules on an article page in a jigsaw format to ensure a perfect fit.
chef_artikelsida2-e1498737287111
The corresponding article page a couple of iterations later. Now in html/css/js (populated via WordPress).

The launch 31st May 2017

The new website was launched with the following new features:

  • More efficient sign-up flow for account creation and purchasing products
  • Stable development flow in which it is easy for developers to iterate, hand over and monitor coding work.
  • It will be easy for Chef to leave Äventyret (if Chef so wishes). The code base is easy to take over and is not staff/agency-dependent in the same manner as it was previously. Chef now has editorial options for the creation of content without having to ask Äventyret for help, which is a benefit for both Chef and Äventyret. Example: CV School, where Äventyret was asked to create a movie list page, but instead we developed a system enabling the creation of lists and content population in the manner desired.
  • Easy to set up measurement points yourself
  • Dedicated events site
  • Easy to set up campaign sites
  • Communicating and personalized paywalls
  • New advertising format
  • Layout-agnostic modules make it easy to create templates based on content.
  • Revitalized form

Each of the points above have been well worth implementing, but the biggest gain from the launch is that overall, the points above provide a good base for the iteration of new sub-projects, to efficiently drive and reflect Chef’s digital development.

 

chef_ipad
Log in mode on the new Chef.se has many more options to make relevant purchases thanks to personalization.

Technical solution

Summary of the technology that made the new Chef.se possible:

  • Herokus Pocus: Äventyret’s own boilerplate and deployment solution for WordPress with Git and Heroku as the linchpins.
  • Development, staging and production environments on Heroku.
  • Composer: To guarantee the same development environment, we wanted to release all plugins and WordPress versions via composer (and therefore, Git).
  • Jaws DB: The database solution that we eventually chose for Heroku.
  • Comet Cache Pro: Cache-plugin with support for SALT and logged in users.
  • Proprietary plugin for Apsis and Titeldata. For example, Chef manages it subscriber versions and offers via Titeldata. To sync with Chef.se, we need to retrieve the current offers from Titeldata in WordPress admin, for Chef to choose when they want to communicate these. The plugins also manage the paywall logic.
  • Auth0: SSO with support for WordPress. The solution was used for a long time, but was dropped as it caused trouble for the most important Chef.se sign-up flow with Titeldata.
  • Network sites for richer event pages
  • ACF Pro: Dynamic content fields and repeaters make it easy for Chef to create layouts for the interface of the building blocks itself that we had planned together. The building blocks can be thought of as like a Lego kit – they are constructed so as to fit together, irrespective of order. The contact largely determines which module will be used.
  • Formable: A proprietary product by Äventyret for building and distributing forms. Cloud-based solution.
  • Amazon S3: To manage media on Heroku. The images are managed in the Chef theme with the proprietary Äventyret plugin Make it Srcset to support the srcset attribute sizes and be able to manage images outside the_content() and the_post_thumbmail().
  • We use Cloudflare as CDN.
  • Migration plan for old content: The site was moved from a stationary server to Heroku, where all deployments create new instances. This also places requirements on the managed of uploaded media. All content is stored on Heroku in an external database. With WordPress, it is usual for the files to be stored on the local server, and so the solution was also on the previous Chef site version. The solution was to relocate all media to a CDN. Unfortunately, it is harder to update the content that links to this media in thousands of posts and many years of published content. For old media, we used a simple URL rewrite rule (.htaccess), which forwards requests (301 redirects) to the newly migrated media library in the Chef CDN.
  • Amazon proxy: For getting the IP number for Heroku. When we pointed CNAME at Heroku, the Chef DNS provider had not provided support for pointing to only one name. After a tricky patch, we solved the problem in this way.
  • Profile Cloud: A tracker service from Apsis that resolves personalization for users that are not logged in, and connects data for users that are still not logged to their accounts once they create one. Configured by Odyssey.
  • Global menus via switch_to_blog(): We thought about using the WordPress rest-API for this, but it was easier to do a comparison to site a user was on, change blogs, echo the global menu and then switch back. It can be done in this way as the menu on the main site is always inherited by network sites.

Future projects:

In addition to the project using master data and SSO, during late summer Äventyret built a location advertising hub through Salesforce. The location advertisements are an important business for Chef. They need to build and administer the in and out flows themselves for these. The service provides other (sites) with a curated, categorized flow to integrate into its services. In addition, Chef.se will integrate this flow on its site, for example on Ledarna.

kanban-2560x1838
Äventyret will close the Chef project at the end of May 2017.
si
The Swedish Institute conducts public diplomacy on behalf of Sweden, promoting the exchange of culture, education and research between Sweden and the world. Äventyret is the Swedish Institute’s partner for innovation and service design. www.si.se
visitsweden
VisitSweden is the national tourism organization responsible for promoting Sweden as a travel destination globally. Äventyret conducts strategy and concept development projects for VisitSweden, including trend monitoring and business intelligence. www.visitsweden.com
samsung
Samsung is a pioneer in virtual reality hardware, building the first consumer VR headset, the Gear VR. Via our partner 360Cities, Samsung commissioned an app for the Gear VR. We developed “360Stories”, which allows photographers to create immersive stories from their panoramas. www.samsung.com
aktivbo
AktivBo provides housing and real estate companies with business management materials for the purpose of creating better housing, a better work environment and more satisfied owners. Äventyret is partner to AktivBo for digital service design for the Swedish and German markets. www.aktivbo.com
almega1
Almega is a service company organization and the largest group within the Confederation of Swedish Enterprise. Äventyret is Almega’s strategic partner for digital innovation, communication and service design. www.almega.se
boob
Boob creates sustainable pregnancy and breastfeeding clothes for mothers worldwide. Äventyret is Boob’s partner for the concept and design of digital services. Together with Boob we developed their e-commerce site www.boobdesign.com
chef_logo1
Chef creates the largest leadership magazine in the Nordic region and operates a number of successful digital media businesses. Äventyret has been Chef’s preferred digital partner since 2016. www.chef.se
lrf1
LRF Media is a Swedish publishing house, focusing on the countryside and the green sector. Äventyret has been developing strategy, concept and design for a number of LRF Media’s digital strategic investments since 2015. www.lrfmedia.se | www.land.se
onepix
Onepix is the most popular clinical image management system in Scandinavia, and is currently used in more than 7,000 treatment rooms throughout the Scandinavian region. In 2016, Äventyret produced interaction and interface designs (as well as new graphics profiles) for the new version of Onepix. www.onepix.se
qvalia-3
Qvalia helps its customers optimize their financial flows. Äventyret is Qvalia’s partner for service design; together we are building digital products and services that are revolutionizing how corporate payments work. www.qvalia.com
sami
SAMI is a financial association (non-profit) that represents practitioners who play and sing on recorded works. Members are artists and musicians. Customers are companies and businesses that play their music. Äventyret has worked on service design for SAMI since 2016. www.sami.se
sunfleet
Sunfleet is Volvo’s car sharing service in Sweden. Äventyret developed multiple iterations of a digital prototype for Sunfleet, aimed at a more efficient booking experience. www.sunfleet.com
txcn-logo
Telenor Connexion designs, develops and operates business solutions for connected products and services. Äventyret is the global partner of Telenor Connexions for digital communication. www.telenorconnexion.com
tis_logo
Tourism in Skåne (TiS) is the official marketing and development company for the region of Skåne. During 2015-2016, Äventyret worked on digitalization strategies together with TiS. www.tourisminskane.com
ukk_logo
Uppsala Konsert & Kongress (UKK) is a cultural center in Uppsala. Äventyret has been preferred digital partner to UKK since 2016. www.ukk.se