by Stuart Ridgway, Original Music for Film and Television
Introduction
Converting a static website to a dynamic, database-driven one requires the developer to strip the original site down to its core purpose. The new goals for the site must be clearly defined while maintaining what is still relevant from the old site. As the developer is implementing the database-driven side of the code the opportunity to update the look, flow and efficiency of the site presents itself. It is here where s/he must determine what content should be built into each page and what should be pulled from the database only when the page is called. Just because you can generate a page dynamically doesn’t mean you should.
Pyramid Digital Productions, Inc. is a composition facility in Arlington, Virginia that provides original music for film and television producers. Before its makeover, pyramidmusic.com was Pyramid’s static website consisting of four parent pages and fifty pop-up or “daughter” pages. The content of the parent pages consisted mostly of text, providing prospective clients with information about Pyramid’s mission, its clients, and its services as well as links to several music examples. Each daughter page contained the description and the audio file for a single music example. There were also daughter pages that demonstrated several methods of encoding audio files for the Internet as well as pages for copyright notices, privacy statements, and contact information.
Pyramid’s site needed to be streamlined. To do so, new databases would need to be built, PHP code and MySQL commands would need to be embedded into the HTML, text would have to be simplified, and new graphics would have to be created. Incidentally, PHP and MySQL were chosen to access the databases because they are free resources that have been well proven. PHP is invisible when reading a page’s source code via the browser. Consequently, the names and passwords for the databases are hidden from casual viewers
The Dilemmas And The Opportunities
There were two apparent dilemmas with the original site, because of its old model, when presenting the various page elements. First, while the layout of the website was logical, it was inherently redundant. For instance, the parent page, “Original Music Composing,” listed many music examples which had links to each example’s associated daughter page. Some of the content on that page was repeated in the daughter pages. If that daughter page was also called from the “Clients” page, the same information was also used.
Second, each daughter page had the exact same design and navigation. To maintain the consistency of the website the music example’s title, associated project name, description, file size and file name were arranged in a systematic manner. Identical links to Pyramid’s copyright notice and other music examples were also accessible.
Because of these two problems, it was very cumbersome to update the site in an efficient and accurate manner. Any addition, change or removal of a music example had to be reflected on the parent pages and its daughter page as well as any navigation to that page. Any update to the layout of a daughter page had to be reflected in all of them. As a result, new music examples from current projects were rarely displayed on the site. Frequent visitors did not see just how active and productive Pyramid was and still is.
The entire website had not been updated in several years. Consequently, current trends in graphic design, animation and multimedia presentation were not reflected. With the need to create a more ergonomic site came the opportunity redesign the entire layout. With these two goals in mind, pyramidmusic.com was rebuilt from the ground up.
Condense The Content
The original web pages contained too much text. Also, there were too many links within the text that bounced the viewer all over the site. As a result, there was no clear direction as to how a prospective client should navigate. The first two requirements, then, were to determine what information was necessary and how that information should be revealed.
Four key elements were identified: Tell prospective clients what Pyramid is; present audio and video examples; give testimonials to Pyramid’s good work; and tell viewers how they too can obtain original music for their productions. These elements easily lent themselves to four unique pages. Thus, the model of the original site could still be used: Four parent pages (Home, Music, Clients, Contact) linked to relevant daughter pages.
The new “Home” page should describe to prospective clients what Pyramid is as well as provide the layout of the site. The new “Music” page should provide links to audio and video examples. The new “Clients” page should display client references and testimonials. And the new “Contact” page should give clear direction as to how to hire Pyramid.
The site’s text was further reduced by eliminating references to past services such as audio editing and encoding. Links to old news items and content not vital to selling Pyramid’s primary services were also removed. The newly available real estate on each page permitted the use of new graphics that guided the user through the site and eliminated even more text.
Most clients that hire Pyramid are film and video producers. With the removal of so much text it was tempting to create a Flash driven website with many visually exciting elements. Ultimately that proved to be counter to the goals of the website. Instead, using standard HTML, Javascript, PHP and MySQL proved to be the most efficient and effective way of delivering Pyramid’s messages.
Call To Action
The primary goal of the website is to have a prospective client watch several videos and listen to the accompanying music that Pyramid created. The viewer then hires Pyramid by calling or emailing. The secondary goal is to provide references and testimonials from past clients. The last goal is to provide links to copyright, privacy notices, and other recommended sites.
As the entry into the site, the new Home page needs to immediately deliver Pyramid’s primary messages. In addition to linking viewers to music and video players, it provides contact information and any other required links. Most of the text was moved to the Home page allowing the other pages to be more streamlined.
Since demonstrating Pyramid’s music is foremost, two new daughter pages with audio players were created in addition to the new Music page. The first daughter page contains a jukebox that plays music without accompanying video. This page was made available throughout the site. A simple “Jukebox” graphic was created and placed in the upper left hand corner of each parent page and was linked to the new daughter page.
The second daughter page contains music from Pyramid’s recent significant projects. Five “News” images were created using vibrant stills from each new video. In order to maintain the streamlined look of the site, the images were layered over each other then revealed one at a time. Most clients will reach the website via the Home or Music pages. Accordingly, the five “News” images were placed below the “Jukebox” on these two parent pages. Each image links to a dedicated daughter page that also plays music without the accompanying video.
The Music page was then devoted to providing music that did have accompanying video. Nine noteworthy videos were identified by the 
distinctiveness of the music, the genre of the video (interstitials, long-form films, promotional videos) and the reputation of the client. Since most of the text had been moved to the Home page, there was plenty of room to create graphic links to each of the nine video. Two intriguing images from each video were used to build mouse-over buttons which linked to a daughter page containing the video player. In addition to adding color and interest to the page, it became very clear what action the viewer should take.
The Clients page was built as a simple list of clients with links to their websites. Instead of the “News” images that were created for the Home and Music page, testimonials from several clients are cited. To 
add some interest to the page, a different testimonial is displayed each time the user reloads the page. This solves the problem of having too many testimonials and not enough space to showcase all of them.
Rather than create a parent Contact page, which contained little content, a smaller daughter page was built. The daughter page describes several methods for contacting Pyramid. Each parent page has several distinct links directing the user to this daughter page as well as the phone number and an email link to Pyramid.
Building The Database
The content required to create the daughter pages was consistent for each music example and each video file. Accordingly, three databases were built: one for the Jukebox music files, one for the News music files, and one for the Video files. Each database contains information about the files including, the file’s name, its location, a description, a title, its associated images and a unique ID.
To make editing the content trouble-free, several password protected “back-end” pages were built specifically for managing the databases. The site administrator can easily view a database, add, delete or change the information and save it. The back-end pages do all of the analysis and error correction required to keep the information in the proper format. Consequently, fewer mistakes, such as incorrect file names, are introduced into the web pages and to the viewers.
The information for each music example is only entered into the database once. The site administrator makes any updates to a music or video example in a single place saving a tremendous amount of time. No matter how many times the website needs that content, it is exactly the same. Therefore, the viewer sees and hears the same consistent message without deviation.
For example, when the Music page is called, the web browser acquires information from the Video database. Using this information, the right images are displayed on the page with their accompanying titles and the correct daughter page is opened when clicked. Removing a dated video and adding a new one requires a simple change to the database and no changes to the Music page.
Delivering The Music
The new design of the website now required daughter pages to be built for the Jukebox, the music for the News items, and the Video examples. Instead of building a unique page for each of these music/video files (26 of them) only three were made: Jukebox.php, AudioExamples.php and MovieExamples.php. Each daughter page then accesses its corresponding database, gathers the information for the specific file, and builds the page dynamically.
Twelve music tracks need to be accessed by the Jukebox. When the user clicks the Jukebox icon, the single Jukebox daughter page is opened and a random number from one to twelve is selected. Using this number, PHP code sends MySQL commands to the Jukebox database. MySQL then returns the file name, its title, its location and information about the music. The daughter page then uses this content to dynamically build the page.
Pyramid’s old site depended upon the browser to deliver the MP3 music file. Unfortunately, this did not allow for accurate control over the layout of the MP3 Player. It also allowed for viewers to download the music files onto their computers creating copy protection problems.
By storing the name of the files in the database as opposed to within the HTML, it’s more difficult for the viewer to find the location of the actual audio file. This makes it much harder for the viewer to use a file-grabbing program to steal the music.
Even though MP3 files are no longer the best way to deliver music on the Internet, they are the most common. Therefore, the format of the music examples did not change their form from the original site. However, a new, simple Flash Music Player was created. The design of the Player works precisely with the layout of the page. The Player also prevents viewers from downloading the music file; they can listen to the music but they cannot save it.
The volume for each audio file fades in at the beginning of the music track and fades out at the end. This makes for a less obtrusive introduction to the music in case the viewer does not have privacy. Also, this makes the music less desirable to steal: when editing music for video, a “tight” beginning and end is essential.
The daughter pages for the News items and the Video examples also follow this design very closely. The only difference is what information is accessed from the databases and how it’s laid out. Also, a new Flash Video Player was built to deliver the video examples within the design of the page.
Conclusion
What had started as a simple idea (dynamically deliver music examples on Pyramid’s website) became the impetus for building a much more robust, ergonomic and unambiguous marketing tool. In order to incorporate data-driven content into the site, the design and purpose of the site had to be very clear. The required data had to be identified and easily revised, and the message that the data supported had to be consistent.
By streamlining the site and adding dynamic content, the number of web pages was reduced by almost 80%. The amount of time now required to update the site was reduced by at least 75%. The number of links a viewer needs to click to hear music was reduced to one. Consequently, it is much easier for a prospective client to hear what s/he likes and hire Pyramid. Since there is no additional cost to publish the site, time was the only investment required. Five weeks were required to rebuild the entire site and the accompanying databases. Measured against the above savings the investment was well worth it.
Stuart Ridgway 