top of page

Responsive design for customer services

Working on a number of responsive design projects for Sky Digital, focussing on the customer relations areas of the website - Sky customer login area and the Contact Sky area.

Sky customer login area tasks included:

  • Re-purposing an important customer-focussed section of to be fully responsive and more personalised.

  • Improving existing journeys, interactions and messaging based around the results of A/B user testing.


  • Reducing customer churn by putting the spotlight on the value of the Sky package based on user research and testing.

  • Reducing Helpline calls by rethinking existing ‘broken’ journeys.

  • Improving the messaging and notifications formats, as well as providing the customers with responsively designed and accessible UI solutions.

Contact Sky area tasks included:

  • Designing a fully responsive website solution for the customer contact area of

  • Based around the existing Sky contact centre set-up, the improved signposting, interactions and functionality across devices were directly based on user lab testing results and best practice.


  • The customer contact volumes increased with far less fall-off rates than before and customers expressed satisfaction at the clarity of information.

  • The delivery of this project was also a first among industry competitors.

  • There was a hard fight against the ‘dark patterns’ being proposed by the business and based on user testing my team manage to mitigate against a lot of this regressive practice.



Project dates:

Oct 2012 to May 2014


• Interaction design

• UI design


This was the customer’s package page, displaying what they were paying for.

We discovered through research that customers rarely knew where to find their account number, so we displayed this in a prominent position.


This page showed customers the services as part of the package that were available to them at no extra cost.

Research showed that many customers were not aware of these services that were available to them. The package ‘completeness’ bar at the top showed in a glance how many of these services were being used.

This is an example of the the work done on the touch gestures for mobile.


The Contact section comprised of a decision tree for customers to select the area they wished to get help for.

The shape of the content was based on the large quantity of Sky services as well as research to discover the most request areas of customer frustration. The focus of this design was to always show the last section that had been selected to give context to the user request.

This was an earlier sketch to start working out the content flow from the mobile size perspective.


This is the mobile view. The 3 column decision tree was split up into 3 distinct screens.


This is the tablet view. The content labels accounted for a small reduction in width to maintain the 3 columns.


This was the desktop design.

bottom of page