Portfolio Details


  • Title: Knowledge
  • Categories: .NET, Bespoke Development, EPiServer, IT System Integration, Rebranding and Design, Website Development
  • Company: The Chartered Institute of Procurement and Supply
  • Year: 2015


CIPS had a bank of content known as ‘Knowledge’ which they wanted to integrate into an area on their website for both members of the institute and non-members. This project involved redesigning the main navigation menu and to introducing a set of page templates into the EPiSERVER CMS.

The following requirements were requested by CIPS for this project:

  • Apply new wireframes and revised design to new page templates.
  • Add a revised taxonomy structure.
  • Improve navigation structure (introduction of a mega-navigation).
  • Apply the revised homepage design.
  • Create a selection of new page types to accommodate the knowledge content.

PSP was provided with a top-level specification from the client including wireframes for this project on which project costings, development and testing timescales were calculated. The PSP team worked to developed the new pages, and where required enhanced existing pages to provide an improved user experience.

Mega Navigation
As part of this project CIPS wanted to improve their current standard menu dropdown.  To do this they wanted to introduce mega navigation - a popular format for websites. With mega navigation the visitor options are widened and this makes searching and following a path to information quicker and easier. The new design introduced a menu with five columns allowing visitor to see items move under the corresponding heading.

Carousel Control
The CIPS website had a standard carousel control on the homepage where the images went to the edge of the content. One of the elements of this project was to upgrade the carousel control on the CIPS homepage to fill the whole screen for greater impact when users navigate to the homepage.

New Page Types
A new listing page was required and as this contained a large amount of information to show it was a challenging area. Working with the wireframes, which utilised an accordion control the client already had on their website, the information was broken down into sections and allowed a summary to be shown, with the ability to expand and see more. This functionality saves space on the page and reduces the need for the lengthy information and content heavy pages.

As part of this project a Concept page type was designed. This page type is used to provide the full Knowledge content about a concept, which covers Benchmarking to Global Supply Chains. Some concepts have information which is available to CIPS members only and some to both members and non-members. This controlled access to information required, PSP built in the functionality to set specific areas of the page to be member only. 

The page allowed a Member area to be created where members have access to content to help them with their CPD (continued professional development) and allowed members to download study material; CIPS also provide useful links for Members.  The Knowledge area allows Members to view related content from around the CIPS website, including books, events, training courses and more.

Taxonomy is a website tool which organises content.  Using the existing taxonomy structure already created by the client, new tags were introduced for the Knowledge content. Within each page type, content editors could now tag it with certain items enabling ‘related content.’ In the design of the concept page for the Knowledge area three boxes were included. These boxes pull through related content from other pages in the Knowledge area and around the CIPS website. This is driven by the taxonomy tags set on the page in the EPiSERVER CMS.


Social Media