Development of a media rich website deals with matrix of technology. In the case of CRC Jianian, their previous website was a distributed website. The music tracks were on one server, the website and database on other servers.
The new site was developed and hosted on another service provider, Media Temple. Certain members of the production team needed access to each server. They had access only if they were qualified to deal with the technology that was installed in each server environment
The following is a diagram of what we were dealing with as we started that project. The info for each field was added as we updated applications and set access privileges.
WIREFRAME / SITE MAP
While the back-end issues are resolved, decisions are made about design, content, budgeting, and resources. At each stage, client approvals are mandatory to stay on schedule.
A wireframe and sitemap are created which shows pages, navigation and special applications are noted. The sitemap below shows the music catalog components on the left and company links on the right.
USER EXPERIENCE – UX
Once the client approves the sitemap, the design process focuses on User Experience, a hot topic among new media professionals and recruiters.
Question: How does a sitemap like the one shown above turn into a website as seen in a browser? The answer comes with initially figuring out the User Experience.
As explained on a wiki: In the web world, User Experience is sometimes conflated with usability, information architecture (IA), and user interface (UI) design, all of which are components of it.
The heart of CRC Jianian (China Records Corporation) is a database of over 20,000 tracks by Chinese recording artists. We updated the music catalog browser to a three-column minimalist style with track samples. Search tools provided for genre, track, and artist info. The track details page provides the music sample and direct link to the retail outlet to purchase or license the song.
After the website design is approved, images are sliced up, then the design and layout is married to the coding. The following image shows the pixel measurements of tables, cells, and images of the home page for CRC Jianian.
DISTRIBUTED WEBSITE – LOAD BALANCE