The TV4 Group is Scandinavia’s leading commercial TV provider, with a turnover of more than SEK 6 billion.
To create a strategy, concept and design for the responsive website, TV4.se.
A customer-centric process through which we survey viewers’ commitment before, during and after watching.
A steady increase in viewers, premium costumers and advertising revenue.
New platforms, new commercial conditions and new user behavior. These were all factors that were making the site TV4.se outlive its usefulness. TV4 approached us in order to define an entirely new digital presence.
“We need your creative process.”
The objectives of the new TV4.se were to:
And the vision was clear:
“TV4.se should become Sweden’s best website!”
There were many question marks. We began by creating a foundation on which the concept could stand.
The TV industry is a business characterized by intense competition. What could we do to help TV4 stand out?
The Daytona team had read about and personally experienced new user behaviors. We would sit with our smartphones in front of the TV, following twitter feeds about Melodifestivalen (the Swedish qualifier to the Eurovision Song Contest) and Agenda (a current affairs show), and realized this was a new and interesting phenomenon. But what was the true nature of this behavior? Which shows were various viewers committed to? What was the nature of this commitment and how widespread was it? And how could TV4’s advertising business benefit from this? These were some of the questions we needed to answer.
In our strategy work, we examined:
Since the framework for the transformation of TV4.se was still rather undefined, we decided to conduct a survey covering a wide range of issues. Consequently, our research used a broad spectrum of qualitative and quantitative surveying methods.
How does TV4’s digital editorial staff work to support the shows and reach target audiences? We identified processes and observed many good examples.
What comprises TV4’s digital advertising revenue streams and which emerging opportunities should the group ideally capitalize on? We reviewed the business models and their relationship to TV4 Play Premium.
We utilized buddy groups to gain a broad entry to our user surveys. We identified the attitudes, behavior and needs of different kinds of TV viewers.
We used web analysis to survey current viewer behavior. When in the day and when during the week were they interested in watching TV and how did they locate their content?
We read through a considerable amount of industry reports, expert blogs and other information in order to survey the new trends in user behavior.
Together, Daytona and TV4 reviewed the direction taken by other, primarily international, media players. What should we aspire to in terms of commerce and experience?
We surveyed discussions about television in various social media channels to gain an idea of what was being discussed, how it was discussed and who was participating in the discussion.
One of the most important insights was that viewer commitment was highly show-specific. The audience watching the talent show Idol had entirely different needs than those who watched Solsidan (a popular Swedish comedy series).
Nevertheless, we were able to identify several emerging changes in viewer behavior, the new commercial playing field and external trends. Our observations included:
The digital advertising formats were undergoing rapid development, particularly when it came to animated solutions. Native advertising and t-commerce were just two examples. In a responsive environment, TV4.se should be able to capitalize on new opportunities arising from such developments.
Viewer interest followed a clear pattern of loyalty to scheduled shows. TV4.se should reflect this interest pattern by supporting different types of behavior at different times of the day and different days of the week.
Different viewers had different needs and behavior. We shortlisted our customer insights into four user types that we catered to in our design work. This proved very helpful when time came to prioritize certain content and functions. Identifying the user types was also helpful to the editorial staff when it came to the site’s content management.
Our user surveys confirmed the picture indicated by foreign reports: second-screen behavior was prevalent in Sweden too. It was clear that TV4.se should be a platform for forward-leaning interaction and commitment—while TV4 Play should be the venue for watching television.
Using a simple side-structure, we allowed viewers to navigate the site in different ways: through schedule, alphabetical listing or search.
Based on the viewers’ respective needs, we created a system through which we could classify TV4’s different shows. There were many common denominators, as well as major differences. The service had to be modular in order to adapt to the different software platforms.
How we made the complex simple.
Our design solution had to resolve a number of important issues. For instance, the service must:
We used an iterative and user-centric process, focused on the needs of our different user categories and tested our designs on real-life users. We also divided the design work into steps and began by creating the service’s most important view: the landing page presenting all the shows. Our plan was to implement this well and create momentum for the rest of the service.
User results were analyzed, resulting in new insights and methods for resolving problems and creating new solutions.
We design a prototype based on what we know. At the onset of the project, the prototype comprised some simple sketches on paper, but the level of detail gradually increased and by the end of the project, the prototype consisted of complete interface scripts.
The design prototype was thoroughly tested on real-life users.
Viewer interest was naturally closely associated with themes that characterize the world of television: shows, individuals and subjects (such as cookery and sports). Inspired by major media sites such as the Guardian, the New York Times and particularly the BBC, we structured the service based on these objects, rather than on pages, article streams or other more traditional niches. There were many advantages to this approach and we could write an entire essay about it – but others have already others have already done this.
In addition, we supplied four different methods of navigation
The first thing we did was to decide on a basic layout and guidelines directing the flow of content and functions depending on screen sizes. To test the functionality of the framework, we developed a simple, clickable prototype in HTML.
Although major portions of the service were specific to the certain shows, there were many functions that needed to be available throughout the service. We set up guidelines for their respective placement.
Using a simple prototype, we were able to explore various routes to a functional responsive framework. The efforts to guarantee the site’s flexibility were particularly challenging due to the fixed advertising template sizes we had to adhere to.
Although the service was to be modularly built to support various types of platforms, there were also considerable common denominators that were applicable to all the platforms. And there were numerous functions that belonged to the service’s framework.
We noted that the concept of “time” (before, during and after) was important to viewers. Consequently, we placed a time line in the middle of the show guide, a stream that contained everything to do with the shows in reverse chronological order.
One of the main objectives of the service was to increase video clip views. We found a concept for reducing the friction in watching “one more clip.” The concept is based on a compact view, containing many clips, while maintaining the viewer’s context.
Viewer interest in a show is greatest immediately prior to, during and after it is broadcast on TV. We assisted viewers in finding their shows using a mini schedule at the top of every view.
Viewer interest is essentially associated with the actual broadcast on traditional TV. Consequently, the schedule is an important navigation tool and a central component of the service.
There was a fantastic opportunity to create added value for the customers if TV4.se could offer a more personalized and social experience. In order to implement such a solution, we needed to identify the respective viewers using the service – ideally by providing individual accounts that worked across all the TV4 platforms.
We created a scalable and modular concept for how TV4 could enhance the TV experience for viewers who were using their smartphones, tablet devices or computers while watching television.
It is natural for design work to build on the core of a service and to move outward from there. At TV4.se, the show guide was of paramount importance. It was the place to which TV4 wanted to direct viewers (for the sake of advertisement sales) and it was where we could best capture viewer commitment. Consequently, we chose to begin with this view.
From there, we designed the service’s other pages through an iterative process.
When we began working, we knew that the site design should highlight both content and ads. Furthermore, the design solution had to allow for individual shows to take up more space. In turn, those show individual show all had their own design elements.
To find our way and obtain a shared vision of the visual concept that we needed to create, we conducted a series of exercises with the product owners and TV4’s Head of Branding.
Based on the slider control, we created two different drafts for the style. Although they appear to be fairly similar on the surface, the rendering was distinctly different.
For a uniform expression, we setup a library of graphic components at an early stage.
The end result was a design that flexibly adapted itself to suit the viewer’s technical conditions. The service is built on three layout renderings: one for the desktop, one for tablet devices and one for smartphones.
Click on the image to zoom.
In 2013, we created a second-screen rendering together with TV4, in the form of a single-page responsive Internet application. The left menu comprises six apps. Additional apps may be created and added depending on the software platform used.
This app contains a stream of selected content such as polls, votes, slide shows, etc.
Editorially selected tweets about the show from viewers and show participants.
Behind-the-scenes images from Instagram.
Real-time chat for viewers.
Information on how to cast a vote during the show.
Linear TV broadcasts.
Sweden’s best website
The pilot launch covered the 2012 Hockey World Championship. The full service was launched in June the same year. Since, the consumption of video clips has increased steadily, resulting in record revenues from animated ads.
TV4.se also won the InternetWorld’s Top 100 in 2012, winning both the entertainment and overall categories. Thus, we officially succeeded in achieving our project’s vision of creating Sweden’s best website.
“Over the past few years, Daytona has played a significant and vital role in TV4’s journey towards digital platforms. Daytona has jointly developed concepts and designs for our digital television services, and helped us in making daring and wise decisions, while consistently keeping the viewer in focus.”
“TV4 is an expert at linking television content with web content. /.../ [TV4] establishes a presence that matches and occasionally exceeds their ambitions and offering of scheduled shows.”
“In a sector characterized by radical changes arising from digitization, one operator is now shining brighter than the others.”
— In addition to our close collaboration with TV4, I want to highlight the meticulous user surveys we conducted at the preliminary strategy phase of the project. We truly familiarized ourselves with the viewers and their needs.
— This was one of our very first responsive projects and we learned a great deal. In hindsight, we should have hastened our scripting process – the design stage was slightly too static.
— That we succeeded in creating a service that essentially lived up to all the objectives. We increased our stock of animated ads and defeated our arch-rival, SVT in the Top 100 list.