My Sky Mobile App

My Sky App animations

Bringing Native Features, Animations and Transitions to the Sky’s Customer Service app, the My Sky App, in order to elevate the customer experience and increase key metrics.

Discovering opportunities and Prioritisation of features for Native Animations and Transitions. This involved a discovery process with stakeholders and customers to gain understanding of customer decisions regarding Sky TV and Sky Mobile products.

We ran customer and stakeholder workshops to gather ideas, knowledge share and to gather business requirements and after rapid-prototyping, we tested a variety of concepts with Figma and Protopie prototypes both remotely on Userzoom and in face to face sessions.

The outcome was that three main areas were prioritised for animation and transitions:

1. iOS and Android TV advertised ‘Piggybank’ animation for Sky Mobile Phone contracts. This was to promote the feature which allows customers to roll data from ‘Piggybank’ of unused data to any SIM on your account (average customer has multiple family members SIM cards on the same Sky contract). Thing feature massively increased the usability of the feature and saw a huge uptick in key metrics as well as allowing the feature to be promoted on TV and web video adverts.

Animation_Steps
Animation steps flow for developers (in Figma Dev Mode)
Animation timing diagram for developers (in Figma Dev Mode)

2. Animation on Hub pages for TV Contracts and transition to deeper screens within the app. Consistent elements allowing the transition to focus user attention on the relevant areas and increase the key metrics for the screen.

3. Custom Overlays for simple transition to elevate main promotions movies and sport assets for Sky Sports and Sky Cinema mirroring a transition used by Apple in the Native App Store.

Miro_Ideas_Grouping
Miro workshop ideas grouping

Also brought some Native iOS and Android features to the app such as iOS Widgets and Shortcuts: