OFLC - Info for Students

Office of Film & Literature Classification - information for students (2010)

OFLC students - homepage

Website: censor.org.nz (site has since been redesigned) - view screenshots

Size: 5 Dreamweaver template pages for a 100+ page website

Government status: Government Agency

My professional status: independent web designer/developer

Website client: Office of Film & Literature Classification

Dates: August 2009 - January 2010, with ongoing support after delivery

Categories: Scoping/pitching/quoting, Client liaison, Project manager, IA & UX, Website designer, Front-end developer, Govt web standards tester, Writing for the web, Content-loader, CSS-based layout, jQuery/JavaScript, e-govt/WCAG compliance, Dreamweaver templates, Government websites, Medium sites

Brief: the OFLC wanted a new website aimed at students doing projects on censorship in New Zealand. I was invited to pitch for the project as I had built the original OFLC website as an employee at Shift, and we had developed a good working relationship since then.

The website needed to be accessible, e-govt compliant, and the design had to appeal to young people. The OFLC team wanted a Dreamweaver-templated site, as this is what they already used for the main OFLC site.

My responsibilities included:

  • Writing and negotiating the proposal for the website fixed-price contract
  • Creation and refinement of the information architecture and site schematics, including template wireframes and sitemap
  • Project management and ongoing liaison with the OFLC team in order to achieve all their aims for the site, and to work through a range of technical and implementation issues with them
  • Project management including the development of design/development timelines within a programme of work and ensuring that I achieved all my project milestones in a timely fashion
  • Ongoing project management once I had designed, built and integrated the website in response to client requests for new pages and help with content-loading the Dreamweaver templates I had supplied
  • Development of a website brand, including graphics and colour palette
  • Design of the site - including look & feel, graphics, and navigation - initially by providing two completely different designs and then by refining and extending the OFLC's preferred design
  • Development of a set of 5 templates in CSS and HTML 4.01 Transitional, from which I created a set of Dreamweaver templates which the OFLC web team would use
  • Hand-coding in HTML 4.01 Transitional to a very high level of accessibility, aiming to incorporate as many WCAG 2.0 AA requirements as possible
  • Incorporating dynamic graphical effects using jQuery for a range of elements including accessible transcripts for the video clips
  • Programming the jQuery to provide progressive enhancement while still allowing complete accessibility for those users with JavaScript disabled
  • Extensive testing of the site at all stages of the development process, ensuring complete consistency across the following browsers and platforms:
    • PC Vista: Internet Explorer IE7, IE8; Firefox 3.5
    • PC WindowsXP: Internet Explorer IE6, IE7, IE8; Firefox 3.0, 3.5, Opera 10
    • Mac OSX 10.4: Safari 4.0
    • Mac OSX 10.5: Firefox 3.5, Opera 10, Safari 4.0
  • The creation of a sitewide CSS print stylesheet - tested in IE6, IE7, IE8, Firefox, Opera and Safari
  • Ensuring that every template had been validated using the W3C Markup Validation Service and that it conformed to HTML 4.01 Transitional requirements
  • Building the initial 50-page skeleton site using my Dreamweaver templates and content-loading examples of each page type so that the OFLC web team had examples to work from as they content-loaded the rest of the website
  • Integration, styling and testing of the Atomz search engine so that the site is fully searchable by visitors
  • Running a series of development workshops with the OFLC web team staff in order to train them how to use the Dreamweaver templates and how to code various elements correctly, together with ongoing support for the web team as they content-loaded the site
  • Ongoing liaison with the OFLC web team, to ensure that the new templates were working as expected, and to provide additional HTML, CSS and content graphics as required
  • A final QA check of the entire website before go-live, plus a session with the web team where we worked together to fix the issues I had identified in my QA report, ensuring that the site was absolutely perfect before it was put online.

I really enjoyed this project, and worked on it from start to finish with the OFLC web team, who are very nice people. It's always fun for me to be able to work on all aspects of the web design and development process - it's how we used to work when I first started in the industry, and it's very satisfying to be able to use my range of skills in this way.

I think it's always interesting to see how much content a client adds to a website once I've delivered it. I think it shows how well the site is working for the client, as well as the level of commitment they feel. The OFLC team doubled the size of the site between the time I delivered the working skeleton and the go-live day - and the information on the site was really accessible - and very interesting. A great read!

Other OFLC website projects