Kinoland

- CASE OF STUDY -

Kinoland is a Progressive Web Application (PWA) created for the chain of cinemas. 

What is Kinoland

Kinoland is a Progressive Web Application (PWA) created for the chain of cinemas. The app is intended to make the user experience smooth and friendly while tickets purchasing.

The Project

Business situation

When the client contacted us to get the solution, he asked for a native application for his project. We recommended to change the conception to PWA because:

  • cost of native app development and distribution is supposed to be higher;
  • native app’s poor conversion and friction;
  • rise of user engagement in web applications;
  • opportunity to build the app for both PC and smartphones;
  • it can work offline or on slow networks;
  • it doesn’t require a full installation.
Challenge

The Client came without Software Requirements Specification prepared, and insisted on starting working on the project without it. Such approach entailed the following:

  • drafting of technical descriptions took more time than expected;
  • accurate estimation couldn't be provided;
  • testing and approval processes were protracted doe to absence of specs. 

Being a non-technical person, the Client:

  • wasn't aware of the details of the development lifecycle;
  • needed to be instructed in all development and testing stages.

There was an additional workload for the Team due to:

  • the project manager needed more time to compile, approve the transmission the technical tasks to the designer on two languages (English and Russian), aa the designer is English-speaking (Uruguay), and the Client is Russian-speaking;
  • the back-end developer on the Сlient side wasn’t enough qualified and needed assistance of our developers. As a result, the development of some features needed more time and involvement of the developers than expected
Technical challenge
  • sliders and other dynamic elements start working only when Angular is completely uploaded;
SSR without Angular Universal
  • Angular project building takes a lot of time, especially when the project “gets bigger”;
  • Angular Universal covers the project-size problem but needs more powerful server to omit page loading issues;
  • Angular development causes a lack of SEO transparency;
  • interactive animations and sliders “slow down” the page uploading speed.
Work process

After discussing the requirements we were ready to start the whole working process. First of all the team extremely needed to:

  • organize a development process;
  • keep in touch with a part of a team from client’s side;
  • take over calls with Client;
  • perform business analysis.

The Solution

Before proposing solution to the Client we analyzed the project needs from features and technology perspectives, estimated a ballpark number. After that, we sent a proposal that completely satisfied the Client's needs. Next, we carried out a whole complex of works on project management, business analysis, frontend, backend development and testing.

Now we:

  • work closely with our Client to keep improving the product
  • develop new features for the Kinoland PWA
Daria Lvovich
QA Engineer
Cecilia Rodriguez Silva
UI/UX Designer
Maksym Teslenko
DevOps Engineer
Alexander Pogrebnjak
Frontend Developer
Daria Holovnina
Project Manager, BA
Sergey Samoylov
Angular Developer

Technologies

  • Angular
  • HTML, JS, CSS
  • Angular Universal on Node.js
  • .Net

Goals Achieved

ResultsResults
Results
Results
  • Kinoland Angular PWA is SEO-friendly thanks to using Angular Universal 
SSR with Angular Universal
  • The PWA was developed with a modest budget and saved up to 75% of the costs of a native app (both development and maintenance). 
  • Kinoland PWA enabled users with various devices use the app simply and smoothly.
  • The app has a user-friendly UX design in the movie style.
  • Loading time of Kinoland  increased in 2-3 times which takes responsive and web stores on. 
  • The Kinoland app has reasonable user experience on both desktop and mobile devices.
  • The app takes up 80-90% less storage than usual ones. 
  • Kinoland PWA has faster loading time, therefore reduces server load. The Kinoland is guaranteed not to crash or slow down when traffic is getting intensive.

Kinoland Features

I am big and I am a banner
  • Big banner on the Home Page with premier - film. User is able to choose cinema schedule right on this banner  and buy tickets in a few clicks. 
  • Pre-sale option banner which allows putting emphasis on specific movie.
  • Video trailer banner which facilitates of user’s interest increasing towards specific film. 
Cool things which help you to choose “right” movie quickly and simply
  • Schedule both for particular cinemas and movies which include calendar and time options. User can easily search both for specific movie session OR session in particular cinema. 
  • "Prices start from" XX label which is shown while hovering the time of the film session. 
  • Movie release labels which allow user to have an ability to be the first who is going to watch this movie or not to miss last chance to watch it.
Here is some stuff on Home Page...
  • There are 3 blocks with films: Now Showing, Coming Soon, Pre-sale tickets.
  • News block about latest promotions and events .
Promo codes
Usual promo codes
Bonus balance
Every time user buys a ticket for money, special bonuses are awarded to Bonus Balance. Once user has enough bonuses - he can buy tickets for it.
Login/Registration
User can simply login to app just via putting his phone number in the field 1 and enter sent code in the field 2 after. If he misses… not a big deal, there are several attempts to do it!
Code word
If a user wants to buy tickets right in cinema for bonuses he is able to do it using code - word. He can indicate his code- word in the User Profile
Tickets Return
If user’s plans have been changed recently, he is able to return tickets via User Profile
Barcodes
In a mobile version there is an ability to scan barcodes of the tickets
Halls seats scheme
It does not matter what device you use, seats scheme is shown fully and clearly even for biggest hall
News
Latest news, promotions and events are gathered together on one page
PWA for chain cinemas
DEVELOPED WITH
Angular Angular Universal
TO HIGHLIGHT
Smooth and friendly UX
undefined
This website uses cookies to improve your experience. We'll assume you're ok with this, but you can opt-out if you wish. Read More