0%
Project Story
Planetaplay

Project roles

  • Management
  • UX/UI Design
  • Product Ideation
  • Product Brand Identity
  • Functional Specification Design
  • Front-end development

Client

  • Payner Media

Planetaplay - video portal and OTT solution.

Product lifespan: 2008 - 2014.

Planetaplay.com (Archive.org)

Project initiation and conception

In 2008, Payner Media commissioned my company Nuvizus Communications to develop a video portal and OTT solution.

Payner Media is the most successful Bulgarian record label and production company with an adjacent TV channel Planeta. The technical and production culture in Payner Media and their desire for innovation attracted my attention.

This motivated me to experiment with design and technology towards a clear goal, dynamic audience, and popular content. In short, all the elements for the realization of an inovative product were available.

In the period described above, the increased local Internet connectivity in Bulgaria and the popularity of the Flash video format created a technical possibility for the distribution of audio and video materials.

Google’s YouTube video portal did not offer the required level of interactivity and content control.

The client had other motivating factors for the development of a standalone video portal and OTT solution:

Ability to create new UX/UI and functionality for users.

Lack of monetization in YouTube in the Bulgarian region.

Technology for integration of content to other distribution channels.

Full integration in audio, video, and meta-data into production workflows.

Planning and ideation

Consulting with experts in technical fields has given me confidence in the successful realization of my ideas.

To address the innovative challenges of the project, I gathered the technical requirements and created a map of functionality for the user experience. I gave priority to user needs in the design.

Because of the need for constant software development, design, iteration, and refinement, I chose the SDaaS model for the operation. The SDaaS work model also made it possible to expand the work team in direct proportion to the scaling of the task and future maintenance.

With the help of the client, I researched work processes aimed at organizing video and audio content and the practices for describing and categorizing meta-data into production.

From the research, I concluded that the successful path to the realization of the product must follow the MVP product development strategy. Contrary to popular belief, MVP does not mean creating a minimal product in terms of functionality. MVP is that version of a new product that allows the collection of the maximum amount of validated data and processes for users (customers) with the least effort by the product team.

Using the MVP technique requires concentrated energy to communicate to the customer, measurement, and analysis of the collected data aimed at the business discovery and user interaction.

Prototype

I assembled a team of three Java developers to produce a full-featured prototype. Based on the collected requirements and functional model, we built up a working version of the product. We used GWT to develop and change the functionality of the front-end and back-end of the application.

I used constant communication with the client and user tests to guide my decisions at this stage.

Within four months, the prototype was functional. The data collected from the tests and implementation gave me a complete set of the technical and design requirements for building the real application.

Project launch and execution

The production team for the development of the functional application started with four developers, and afterward increased to eight.

I broke up the team into two parts - Front-end and Back-end developers with a Scrum Master for each group.

In my role as a Product owner, I revised the Product Backlog with features and user stories guided by research and client requirements.

The team marked out all the features and stories in order to prioritize what tasks we will introduce to the Sprint backlog.

We choose 3 weeks sprint approach with daily scrum meetings and regular sprint reviews.
I devoted the last week of the month to user tests and preparations for the monthly demo sessions with the customer.

One of the important requirements was to have fast media playback without reloading the entire web page. Features such as saving and sharing custom playlists and user discussions also had to be implemented with a focus on execution speed. So, we opted out for a single page progressive approach.

For this purpose, I chose AJAX technology in mix with the delivery of media files via NGINX. Despite its lower popularity (in 2009) compared to lighttpd, NGINX gave us better performance after load tests. NGINX is able to serve more pages at once with a more predictable memory and is more suited to high demand situations.

For metadata management, file conversion control and back-end functionality, I opted for the MVC method with Zend Framework and Twig Template Language.

We achieved the perfect combination by assessing the critical components of the application and implementing proven and stable technologies with experimental ones.

Technology Stack

Front-end:

HTML, CSS, and JavaScript

AJAX

Flash Video Player

Apache 2

NGINX

PHP

Back-end:

PHP

PostgreSQL

Zend Framework

Twig Template Language

FFMPEG

Server Configuration:

XEN Server

XEN Hypervisor services

NFS for web servers

Debian

Project Management & Production:

Project Management - ActiveCollab

Scrum

Version Control - SVN

Rsync

Release life cycle

Pre-alpha:

After intense development for a year and a half, the pre-alpha version of Planetaplay was ready. We uploaded the existing video library through automation and converted only released videos through the website’s back-end. At this stage, the focus was on optimizing and completing the back-end functionality for metadata control.

Alpha:

Stage focused on basic front-end functionality, including search, sorting results, playback optimization and loading time.

Beta:

Optimization and user tests in small cycles. Implementation of new functionality: user registration and profiles, custom playlist, user sharing, comments, comment moderation and user related logic.

Release candidate:

Widgets for the most viewed videos, top 10 ranking based on TV assessments and new videos tab - exclusive premiere. We created random grid with thumbnails for audio and video files. RSS parser with data from TV channel website and a front-end widget. Integration of advertising management system and custom web statistics and analysis. Optimization and user tests.

General Availability:

On November 10, 2009, the functional version of Planetaplay was online.

Back-end Functionality Mind Maps

Additional Web-services

Subsequently, we created two additional services as part of Planetaplay.

Planetapartner (Archive.org) - platform for integration of content to other distribution channels.

Back-end with full control over web-embedding and access to Planetaplay Video API for IPTV partners of the client.

Front-end with registration application for partnership, customer profiles, and statistics.

Planetaface - micro-social network with unified login and user profiles for all Payner Media web-sites.

For the back-end development of these services I chose a combo of Python Framework - Django with PostgreSQL as a database.

Brand Identity

I always start my design process by sketching on a paper or digitally. This technique is indispensable in the process of creation of an unique visual language and brand differentiation.

From the constructed UX study, the User Persona's measured in the age group 14-25 years.
I created a custom font for Planetplay that reflects this primary audience ideas of modernity and value.

The outline of the font is sans-serif with a fixed width stem, teardrop-shaped bowl and eye elements and overall influence from the lines of the logo. The resulting shape represents the idea of playfulness and affection.

I used the produced font for other brands of the client - Planetaface, Payner Radio, Planetapartner and Paynerstore. “Planeta” in Bulgarian is “Planet” in English, so I represented this association with an ellipse encapsulating the play button shape.

For brand colors, I decided on a combination that represents luxury experience - Light Burgundy and version of a Beige - Light Cosmic latte.

Note: Luxury experience is a common theme in pop culture represented by the content of Payner Media.

User Interface

I used Adobe Fireworks to build a pixel perfect design and focused overall feel of the interface more on a compact application side than on a standard web page.

I arranged the layout into two areas horizontally. The area of ​​the video player has enhanced contrast for central focusing of the user’s eye, while the area for handling results and playlist operations has intermediate contrast.

The search box has a significant functional priority and logically stands out against the content interaction buttons. I gave strong contrast to the playlist tab bars and the custom scroll-bar for results area.

Because of the compactness of the interface, I included animated tooltips to each functional and information element.

For the needs of front-end implementation, I built a UI library and a design system. I implemented the color scheme from the Planetaplay brand documentation with a mix of gray-scale tones.

I split tested my design decisions with the help of the client team and enthusiastic users.

Conclusions

Planetaplay was an immense success for Payner Media. For the period of its existence the service had gained more than half a million registered users, 875000 hours of video playback and 4858135 shared playlists.

Note: The population of Bulgaria is approximately seven million, with over three million internet users in the product’s lifetime. Data from Internetlivestats.com.

Added value for the client was brought by integrating Planetaplay to the website and production workflow of Planeta TV. To the significance of the project also contributed possibility for the promotion of events and new content and statistical evaluation of the consumer reaction.

For me personally, the project was an important challenge.

During the period of development of Planetaplay I improved my technical skills and knowledge, built solid experience in managing a team under pressure; developed my communication and presentation skills; strengthened my habits for documentation and administration.

The net effect of this experience is that I became a better Product Designer and Manager.
My approach to product building has improved and as a result I have achieved a new level of expertise.

The professionalism and the spirit of entrepreneurship in INFOQ and Hackernews communities contributed immensely to my technological and production culture. The investment in exploration and implementation of new technologies has given me confidence in my professional abilities.

As a result, I can produce quality and add value to any team or client project.

Back To Top