unnamed.png

popin by popcentral

A Web App that is developed for the users of different mediums including traditional television, connected TV, and the Internet. “Poppin by Popcentral” is an interactive application in which viewers can watch shows from multiple platforms including iOS and Android and connect via their browser. This allows users to enjoy more content from any device with a web connection.

Tools and Technologies

Services Served

Overview

A Web App that is developed for the users of different mediums including traditional television, connected TV, and the Internet. “Poppin by Popcentral” is an interactive application in which viewers can watch shows from multiple platforms including iOS and Android and connect via their browser. This allows users to enjoy more content from any device with a web connection.

Discover

Usability Testing

Define

Research Report | Strategy Board

Design

Wireframe | Build Prototype

Testing

Test Prototype

Our Process of Design and Developement

GET BETTER RESULTS BY UPGRADING TODAY!​

Vision

The application is designed with multi-layered architecture with the flexibility of scaling to the next level through the application journey. In the initial phase, it was designed according to the best user experience. In between development stages, connecting multiple systems in real-time is done while providing efficient traceability between various systems by creating a proper communication channel through effective use of the middle layer between various systems.

Followers

Users will be able to follow other users or get followers on their profile. Sharing content between the users will strengthen the community.

User Journey

As a member of POPPIN, you will be able to watch all of Popcentral's shows on the go via mobile devices. Here are some of the features that make POPPIN different from other video-on-demand (VOD) apps.

Content

You will be able to post any text or media, ie photo or video. Your followers will be able to watch and interact with your content

Profile Creation

Sign up to POPPIN with Facebook, Twitter, or Gmail and set up your user name and display picture.

Shop

User have the option to pay through wallet or external means to shop anything on Central Market. The shop will have user friendly interface for the user to navigate easily.

Add your Wallet

After logging in, you can opt for the option "open a wallet" to be facilitated smooth and save transactions in and out of the app. This is not mandatory and users have the choice to opt for this feature.

Gaming

POPPIN is a new and exciting app that enhances the gaming experience. It allows users to buy or add games directly on the app while watching their favorite shows. There will also be some free games.

Live

You will get a Live Stream on Poppin from Popcentral TV.

Chat BOT

POPPIN is a platform that allows users to click on their TV screen during a live or pre-recorded program to submit comments and have them displayed as an overlay in the comment section. ( we are considering some changes to make the process smooth for the users)

Guide List

There will be a guide list for shows on the channel to help the users select the shows of their choice.

Polling

Your opinions are important to us so you will be allowed to participate in real-time polls ( via app )displayed on the TV. ( we are considering some changes to make the process smooth for the users)

Clips & Promos

You will be entertained with short clips, upcoming promos, and trailers of different shows that will be uploaded on the Poppins frequently.

Cash Exchange

To create a helping community, Poppins will add a feature to lend and receive cash between users through their wallets ( in USSD currency ). A recharge option will also be available.

Notifications

You will be able to express, write and share your thoughts about different shows on Popcentral TV via Poppin app. You can also share the on social media or with your friends.

Calling

Users will have the facility to call in the show directly through the app.

Participation

Viewers will be able to clock in while viewing Live stream to show their presence.

Ad Videos

 Users will be able to put their ads and promos through a video. Once videos are approved, payment will be made through the app wallet.

Reactions

Viewers will be able to point out if they like any live stream or for how long they watchd any content. Their liking will be measured on the base of duration they spent while watching any particular content.

Easy Navigation

We design Poppins app for the best user experience with an easy-to-navigate layout and functions. You will experience a smoothness with amusement.

The problem
we are trying to solve

GET BETTER RESULTS BY UPGRADING TODAY!​

Strategy board

User take many steps through many pages to choose specific shows and problem to know difference between “latest and old episodes”

Users have problem with final price to pay to subscription package and pay with by credit card

Improving our latest TV shows page experience.

Improving our latest shows page experience.

Existing users.

Registered users

Subscription Rate

Time to add additional shows.

Error rate.

Old vs New

Old vs New

Our

Challange

A great challenge for Poppins was to handle the large traffic of the viewers who wanted to have an online experience of watching shows on demand. To be able to do this with proper data usage, without stream interruptions, and bringing existing channels to the internet was a little complicated. The infrastructure of those channels wasn’t ready to be exposed to the online world.

How did we
discover the problem

GET BETTER RESULTS BY UPGRADING TODAY!​

Research

Testing Objectives

Sample

Participant

The additional show listing flow 

Proceed for payment by credit card.

Subscription upgrade using credit card method. 

Imagine that you finished your subscription plan and need to make a new subscription.

Imagine that you finished your registration and need to login.

Add additional shows.

Add extra shows using credit card method.

User Flow

We draw user flow to show the path a user take through
the product as they complete a specific task!​

Solution

Instead of managing everything on a macro level, we divide it into a micro-service architecture to be able to handle it smoothly. It helped in the flexible handling of the large sum of users.

Technically created micro substructures which are deep inter connected with the different system layers help in the
management of functions and features.

We designed a middle subcaste for the operation of communication which is being operated from the mobile app by the APIs. The App and affiliated features are only communicating through this subcaste and the other systems are coherent with the main layer.

Log-ins and analytics are managed by the middle layer and have a complete tracking system. To monitor the whole application, some filters have been installed in the layers. ( for precautionary purposes).

Content management allows the admins to control all the features of the app. We have automated the system to the best of our ability.

Different functions like the live stream, user info, conversions, and conversations are managed by CMS moderators, based on their roles and authority.

To keep data organized, we have google data studio and firebase analytics to record users’ behavior and experience on the app.

Web Screens

We made for desktop version of the application to generate ideas and iterate quickly. It gave me a direction on what was working and what wasn’t, to design a better solution.

The overall user interface design was kept minimal and clean to make sure there is a good balance of content and visuals. Here are few of the High fidelity wireframes for desktop.

web page

Mobile
Screens

We made for desktop version of the application to generate ideas and iterate quickly. It gave me a direction on what was working and what wasn’t, to design a better solution.

For user convenience I decided to create a responsive website for mobile. The overall user interface design was kept minimal and clean to make sure there is a good balance of content and visuals. Here are few of the High fidelity wireframes for  mobile.

mobile
mobilescreen
mobilescreens
mobilescreen

Admin Panel Screens

It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using ‘Content here, content here’, making it look like readable English.

web panel
web panel
web panel

The Impact from New Design

Thanks for Watching

We learned that, what matters most in solving problems involving bridging the gap between the business and its consumer, is the  communication between them. If you like this case study or have any feedbacks, you can connect with us on Our Website or Email me on [email protected]

Graphic Design

We are able to deliver the ideal web design solutions to you.

developing

We develop fast, secure and interactive websites, ensuring a great experience for web users.

Management

We do  everything from basic maintenance to content and design updates and broader online marketing strategies.

footer-logo.png

Follow us

footer-taj.png

Viewy Digital Pvt. Ltd.
Infopark TBC, JNI Stadium, Cochin, Kerala,
India, PO-682017
+91 484 233 1101
[email protected]

Viewy Digital FZ LLC
Suite 17, The Iridium Building,
Dubai, UAE – PO Box 391186
+971 4 240 0961
[email protected]

©2022 Viewy Digital All Rights Reserved.