PHD – Director 3 web app

Front-end design and development

Core dashboard screen

PHD Network is a world-leading media communications agency who work with top brands to plan and position their advertising. Director 3 is the core app used throughout PHD's global network to plan and evaluate their media campaigns. The previous VB.NET version suffered from a number of usability and speed issues partly due to it being tied to a proprietary Windows OS app. Working alongside Agile MediaWare – who took care of the project management and back-end development – I redesigned and developed Director's front-end, moving it to a user-friendly, lightweight and globally-accessible web-based platform.

Media Plan Builder

Director is a very data intensive application and at times the amount of data to be displayed is staggering. This particular screen shows the Media Planner, which at any given time could have 35+ columns and 100s of rows, all of which being editable, sortable and filterable. Yahoo's YUI DataTables is used throughout Director because of its flexibility and performance.

Media Plan Builder – column filter

Being one of Director's core screens, displaying all table columns for all users at once just wasn't practical, as every user has their own needs. I designed a column filter that allows users to customise columns based on a particular column group, or manually, and then save these choices for future use.

Document Manager

Users can use this screen to find, edit and upload documents within the repository. The default YUI DataTables build was modified to include custom icons and styles to help recreate an OS folder interface.

Wireframe

One of the many wireframes produced in the initial design stages.