Sage Pay

Robert Castelo — Thu, 03 Apr 2014 10:20:19 +0000

Sage Pay is one of the world’s most trusted payment solutions providers.

Our brief was to create a platform which could be used to build and maintain a website for each of the countries Sage Pay operates in, supporting existing customers and promoting Sage Pay services in those countries.

Background

Sage Pay has earned a reputation for security and good service. From startups to major brands, fifty thousand business of all sizes relly on Sage Pay to succesfully processes customer payments.

Sage Pay approched Code Positive to re-build the main corporate platform from which all Sage Pay country websites are built and maintained. The objectives were to present fresh new branding and make it possible for Sage Pay customers, partners, and developers to more quickly find solutions and information.

Code Positive provided consultancy, project planning, project management, development, and on-going support for the project.

Drupal was used to implemented the project, and hosting was provided by Acquia.

Site Highlights

Marketing

The Payment Solutions section features visually rich explanations of the advantages of Sage Pay products, step-by-step guides on how to switch to Sage Pay, and information for statups and corporates. Each page has a clear call to action to connect the visitor to the sage Pay sales team.

The Partner and Developer section of the site provides information on becoming a partner, and helps partners and developers find developer resources and information about 3rd party integrations. Similar to the Solutions section, navigation is visually driven and there is a good balance of imagery and content on the pages with strong call to actions in the form of buttons, teasers with icons and customer logos linked to case studies.

Customer and partner case studies highlight how different Sage Pay solutions have solved problems and met the needs of customers and partners - two different audiences for Sage Pay. The case studies grab the attention of the reader with quotes and logos from prominent customers and partners. Case studies are promoted throughout the site with case study carousels and lists of linked logo thumbnails.

Support

The support section makes it quick and easy for Sage Pay’s various audiences to find the help that they need.

It features support articles on various topics, integration guides explaing how Sage Pay products can be used with other applications, online shoppers FAQ for anyone making payments through Sage Pay services, and contact details for 24/7 support services through which clients and partners can get more information.

Also available in the support section are logo downloads that can be added to a website to show it’s using Sage Pay services, a beta testing programme registration, a glossary with definitions of termnology used on the site, and explanations of error codes and their suggested solutions.

One of the most important features of the site is the system monitor which provides up to the moment information on the status of Sage Pay services.

The support section has a search facility, including the option to search specifically in error codes so that integrators can quickly diagnose problems and find solutions.

The Sage Pay forum is hosted externaly on Stack Overflow. which has excellent tools for technical support and a large and active developer community.

Content Strategy

The client’s brief had two almost contradictory requirements for the site’s content strategy:

Flexibility to add a completely different mix of content to each page
Rigidlly defined content fields that would guide staff in entering content

A flexible content system would enable the marketing department to create whatever message was appropriate for each page. Rigid content fields would maintain consistency across the site, and allow content parts to be re-used on other pages, or hidden on mobile devices.

We squared this circle by analyzing the content that would be added to the site and found common repeating patterns, we then implemented each of the patterns as component types that could be added to any page in any order. Options were also added so the client could control the position and styling of each component as it was created.

We met this challenge by analysing the planned site content to find common repeating patterns. We then built a component for each of these patterns, that could be used to add structured content to any page in any order. The components included flexible configuration options that empowered Sage Pay to control the layout, styling and order of the content as it is added to a page.

Most of the components were developed to have a one-to-one relationship with the page they would be added to, and we also provided a few components that could be re-used on multiple pages.

After a few weeks of use, feedback from the client enabled us to refine the user interface of the component system, to provide a system that is flexible, powerful, and easy to use.

Tokens

One of the challenges was to make it easy for Sage Pay to manage and maintain lots of pieces of information, like telephone numbers and prices, across multiple pages.

To solve this problem, we implemented a token system that enable the client to use place holder tokens anywhere in their copy, which are automatically filled in with information before being displayed on the web page.

The client can easily create new tokens as required, and updating the information associated with a token updates the information across the website.

Media Management

The website makes extensive use of images, videos, and downloadable documents as part of it’s marketing and support features.

We used Media module to implement a media management system that enables the client to add media to the site’s asset library, re-use them across multiple pages, and track which pages each asset is used on.

The system also allows the client to update a media asset, such as a new image of a product, and have the site display the new version everywhere it used the old version.

Drupal Contributions

Node View Mode

Provides a field that can be used to select a view mode on each node.

Node View Mode

The Results

The site has exceeded the client’s expectations for flexibility and ease of use in adding content. Sage Pay’s marketing and support teams are excited about the positive feedback from customers, developers and partners.

Drupal Consulting

Drupal Development

Drupal Maintenance