PHP/MySQL - Dynamic Websites (Content Management Systems)

Static websites are boring - they're obsolete almost as soon as they're uploaded and they tend not to get too many return visits. Dynamic web applications, by comparison, can adapt to a user and they enable web developers to give clients websites which they can manage and update themselves.

Blogs, Content Management Systems (cms) and other dynamic website engines are becoming more and more abundant and the advent of open source development means that these are often free for most users. The problem is that many of these ready-built solutions are often too complicated or too inflexible.

As a result I have over the past few years been commissioned to build a number of bespoke engines. Scripted in PHP and using a MySQL database back-end these are simple to use systems which are designed for specific tasks and yet are flexible enough to meet a client's changing needs. As each engine has developed, they have borrowed features from each other. They all share a strong web-standards compliant semantic backbone:

Generic Web Builder

Student Gateway screenshotThe Web Builder (currently in v3.06) was developed to meet the needs of non-IT literate tutors needing to update and manage information websites for their students. In addition to providing Word-like WYSIWYG inline editing of all content, each page can also be edited in a normal HTML editor if preferred. Each instance of the web-builder can be up and running in minutes by following a simple installation procedure (see run-through) and yet the management system is flexible enough to allow administrators to add/delete and re-organise the entire site structure without any knowledge of PHP or HTML. Three user levels are provided: 'admin', 'author' and 'user'. The builder also includes a theme-builder with which new css stylesheets can be created in a WYSIWYG fashion.

[view admin walk-through 6.11MB]
Demonstrates installation and editing of pages, menus and themes.

[example 1] [example 2] [example 3]

Band Content Management System

FriendlyFireMusic website screenshotThe Band CMS (currently in v3.02) was created to enable bands to manage their own promotional websites. Easy to theme due to its xhtml/css semantic design, the engine also features inline editing of all content. Easy to use upload scripts handle the loading of mp3 audio files into the radio player and a simple image editor is also provided to prepare pictures prior to inclusion into the dynamic image gallery. The latest verion has added the ability to operate the site as a multi-user community where 'stories' and comments can be added by any registered user. Three user levels are provided: 'admin', 'contributor' and 'user'. All versions also provide for the management of a fan database and allow the administrator to send mass emails to anyone signed up for updates.

[example 1] [example 2] [example 3]

Development Log Web Application

Development Log screenshotThe Dev Log (currently in v1.00), developed and designed for South Birmingham College as part of the JISC funded X4L phase2 project 'The Learning Bank2'. A simple blog-like issues and bug tracking system, the system is being used to manage the development process from alpha through to beta and release candidate phases. Each log comprises of a MySQL database with a PHP front end for viewing of the data. User are able to log-in and add an entry to the log and leave comments for bug-tracking purposes.

[demo version]

[example]

 

Examples

Friendly Fire Music

friendly fire music thumbnail 1 - click to open in a new windowfriendly fire music thumbnail 2 - click to open in a new windowfriendly fire music thumbnail 3 - click to open in a new window

Set-up for Friendly Fire Music Productions this promotional website uses version 1 of my own content management system. Both Munchbreak and Nigel Clark's websites use versions of the same engine to promote their music activities. It features a flash radio station and easy to manage gig guide. The site is updated by the label's head honcho: Robin Giorno.

[visit website] [about music cms]

Nigel Clark

nigel clark thumbnail 1 - click to open in a new windownigel clark thumbnail 2 - click to open in a new windownigel clark thumbnail 3 - click to open in a new window

Designed and built for ex-Dodgy singer-sonwriter Nigel Clark this promotional website uses the same bespoke content management system as I have used for the Munchbreak and FriendlyFireMusic. It is themed to fit in with Nigel's current marketing materials and is updated by him.

[visit website] [about music cms]

Munchbreak

munchbreak thumbnail 1 - click to open in a new windowmunchbreak thumbnail 2 - click to open in a new windowmunchbreak thumbnail 3 - click to open in a new window
munchbreak thumbnail 4 - click to open in a new windowmunchbreak thumbnail 5 - click to open in a new windowmunchbreak thumbnail 6 - click to open in a new window

Created for the Birmingham-based band Munchbreak [Jibbering Records] this promotional website uses an updated version of my own music Content Management System.

Based on the same back-end which powers the Friendly Fire Music and Nigel Clark websites, this version features a multi-user facility which enable registered users to log-in and post stories or comments. Additional functions include an easier to manage dynamic picture gallery and a native mp3 audio player.

Although the design appears almost 'flash-like' careful W3C compliant CSS and XHTML are used throughout to insure cross-platform compatibility. Even the complex javascript powered inline content editor is designed to function on mac and pc as the site is managed and updated by a number band members - each of whom has different home computing set-ups.

[visit website] [about music cms]

Development Logs

devlogs thumbnail 1 - click to open in a new window devlogs thumbnail 2 - click to open in a new window devlogs thumbnail 3 - click to open in a new window
devlogs thumbnail 4 - click to open in a new window devlogs thumbnail 5 - click to open in a new window devlogs thumbnail 6 - click to open in a new window

The development logs are being used by South Birmingham College to help them manage and track both internal and external development projects.

[view demo devlog] [about devlog engine]

[more examples my e-learning content development work]

X4L The Learning Bank Website

learningbank1 thumbnail 1 - click to open in a new window learningbank1 thumbnail 2 - click to open in a new window learningbank1 thumbnail 3 - click to open in a new window
learningbank1 thumbnail 4 - click to open in a new window learningbank1 thumbnail 5 - click to open in a new window learningbank1 thumbnail 6 - click to open in a new window

Using the web builder engine this information website was created to function as a repository for all of South Birmingham College's JISC-funded X4L research.

Easy to edit and manage by both content developers and less IT-literate project partners, the website features a search facility and a carefully thought out interface. A lot of wordy documents have to be made available and the tabbed layout as well as browsing using the left/right cursor keys (and next/back buttons) are designed to aid navigation. 

Also included is a web-based front end for a database of research data which was collected as part of a review of freely available e-learning materials in the curriculum areas of marketing and catering.

[view website] [view content review database

[more examples my e-learning content development work]

X4L The Learning Bank 2 Website

learningbank2 thumbnail 1 - click to open in a new window learningbank2 thumbnail 2 - click to open in a new window learningbank2 thumbnail 3 - click to open in a new window

Using the web builder engine this information website was created to function as a repository for all of South Birmingham College's JISC-funded X4L phase 2 research.

This follow-up to the first learning bank website demonstrates how the web builder engine can be used to easily and rapidly deploy multiple websites. The same functions are available across all instances although different passwords and access rights can be set-up. The colour scheme is easily be changed using either one of the five built options or a new one can be created in the theme-maker.

[view website

[more examples my e-learning content development work]

Student Gateways (Cross-College Information Portals)

student gateway thumbnail 1 - click to open in a new window student gateway thumbnail 2 - click to open in a new window student gateway thumbnail 3 - click to open in a new window
student gateway thumbnail 4 - click to open in a new window student gateway thumbnail 5 - click to open in a new window student gateway thumbnail 6 - click to open in a new window
student gateway thumbnail 7 - click to open in a new window student gateway thumbnail 8 - click to open in a new window student gateway thumbnail 9 - click to open in a new window

This is the project for which the web builder engine was developed. South Birmingham College's E-Learning Content Development Unit needed to create and manage as many sites as were required by each curriculum division in order to provide students with up to date information about their courses.

Planning

This need to facilitate student access to course information and learning materials for their particular subject area across all curriculum areas led not just to the web builder engine but also required extensive strategic planning og the colleges online e-learning resources:

Each Subject Gateway consists of a student website containing college and course information (such as news and diary events, course details, information about the College library and computer systems) which is shared across all gateway instances.

A link to subject specific learning materials in the College virtual learning environment (VLE) Moodle is provided at the subject and course level and an Information Directory has been designed to act as a cross-disciplinary collection of resources which functions as an information hub and a starting point for further fields of study. Its purpose is to allow students to find information related to subjects outside of their direct course of study. For example, a student on a Hair and Beauty course may be interested in setting-up their own business and might want to find information about marketing.

Technical

In addition to the inline editor which enables authorised tutors to edit content without any knowledge of HTML the dynamically generated pages are compliant with the latest disability legislation and demonstrate best practice in inclusive design, taking accessibility as a subset of usability.

[more examples my e-learning content development work]