Docstoc

Temple_Team_Project_Documentation

Document Sample
Temple_Team_Project_Documentation Powered By Docstoc
					Project Documentation
      By Temple Team




   Authors: Andrea Bainbridge
            Cladine Momongan
            Colin Weight
            Karen Mok




   Version: V1.1


     Date: 24 November 2008
                                                        Temple Team – Project Documentation



Executive Summary

This document outlines the business requirements of Sri Vakrathunda Vinayagar Temple, their
profiles and needs. It also describes the content of the proposed website for the client.

The project team will be using an existing Content Management System (CMS) called Pixie. The
requirements for both hardware and CMS are also outlined in the document.

As part of the project, the team will create an enhancement to the Pixie CMS. This enhancement
is the Photo Gallery module allowing the client to add a photo gallery page in the website.

The website design is briefly illustrated in the document including the navigation type, page
design and principles used.

A comprehensive photo gallery module user guide has been included.

This document also contains the client acceptance testing components to test the full
functionality of the photo gallery module.




                                                 Page ii of iii                         Document1
                                                     Temple Team – Project Documentation



Table of Contents
1 Introduction __________________________________________________________ 1
2 Business Requirements _________________________________________________ 2
3 User _________________________________________________________________ 3
 3.1    Profile _________________________________________________________________ 3
 3.2    Needs _________________________________________________________________ 3
 3.3    Content description ______________________________________________________ 3
4 Recommended Existing CMS system ______________________________________ 4
 4.1    Description _____________________________________________________________ 4
 4.2    Requirements ___________________________________________________________ 4
 4.3    Resources ______________________________________________________________ 4
5 CMS Requirements ____________________________________________________ 5
 5.1    Hardware ______________________________________________________________ 5
 5.2    Software and operating system requirements ________________________________ 5
6 CMS Enhancement ____________________________________________________ 6
 6.1    Feature ________________________________________________________________ 6
 6.2    Layout ________________________________________________________________ 6
 6.3    Code __________________________________________________________________ 6
7 Website Design Principles _______________________________________________ 7
8 Design Diagrams ______________________________________________________ 8
 8.1    Website Hierarchy ______________________________________________________ 8
 8.2    Page design_____________________________________________________________ 8
 8.3    Navigation design _______________________________________________________ 9
9 User Instructions for Photo Gallery Module _______________________________ 10
10 Client Acceptance Testing _____________________________________________ 16
 10.1    CMS admin interface testing ____________________________________________ 16
 10.2    CMS user interface testing ______________________________________________ 22
11 Contributions Declaration _____________________________________________ 25




                                              Page iii of iii                    Document1
                                                       Temple Team – Project Documentation




1 Introduction
The purpose of this document is to identify and analyse the business requirements of the client
for the development of their website. It also defines the design and structure of the website using
different design principles. The document states which CMS has been chosen and the
enhancement to be added and created.

This document includes the user guide for the photo gallery module that was created to satisfy
the client’s business requirements. As it was not a part of Pixie CMS originally, the user guide is
needed by the client so they can make use of its functionality.

The client acceptance testing has been performed and documented to ensure smooth handover
of the project to the client.

The intended audience of the document is the client, the tutor who serves as the project
manager and students taking up the same competency.




                                                  Page 1 of 25                           Document1
                                                       Temple Team – Project Documentation




2 Business Requirements
The Sri Vakrathunda Vinayagar Temple requires a new website that has information regarding
the day to day activities of the temple, including events, newsletters, a photo gallery function and
information on deities as well as general information on the temple for visitors to the website.

The purpose of the website is to attract new members and keep existing ones, and to spread
awareness of Hindu temples, different cultures and communities across Melbourne.

Some of the main purposes of the site are to:
 Highlight awareness of charitable deeds that the temple participates in
 Promote the canteen and its uniqueness
 Display opening times
 Provide a place where members can download the quarterly newsletter
 Show photos of recent events

Also, it is important that:
 The information on the website is accessible to all members and visitors to the temple
 The site content can be maintained and managed by members of the temple using a CMS

The purpose of choosing to use CMS to produce the website is to allow the administrators to
update it as and when required. This does not require the administrator to have any knowledge
of HTML or programming. This is in contrast to the current site, which requires the involvement
of their web designer even to make small changes.

The temple also has a long-term goal of being able to manage members using an online
database and to allow new members to sign up. Content would then be displayed based on the
users’ access rights. This is beyond the scope of this project, but these features should be able
to be implemented without much disruption to the new site.




                                                  Page 2 of 25                           Document1
                                                       Temple Team – Project Documentation




3 User
3.1 Profile
The end users of the site are most likely to be Hindus who are members of the temple or
potential members of the temple. We should also consider members of the general public who
are interested in Indian culture and the Hindu religion, and may like to attend some events or
visit the temple and its canteen.

Intermediate User: The administrator of the site’s content. The person responsible for updating
the website is unlikely to have experience with HTML and/or programming, and so the CMS
must be simple enough for a non-technical user to be able to get around.


3.2 Needs

Members and non-members will need to access information on the temple such as events and
times, available services, background information on the religion and history of the temple itself.

Intermediate User: Will require a manual that will show them how to update the website.


3.3 Content description
The main body of the content will be provided by the administrators under each of the headings
provided by the navigation pane, e.g. Events, Newsletter. The existing site is to be used as a
guide for which pages we should create (http://www.melbournevinayagar.org.au/).

The overall aim of the content is to encourage people to attend the temple and find out more
information.




                                                  Page 3 of 25                           Document1
                                                        Temple Team – Project Documentation




4 Recommended Existing CMS system
4.1 Description

Pixie is an open source content management system written in PHP.

Websites created with Pixie separate the style of the site from the contents. The style of the site
is controlled by Cascading Style Sheet (CSS). Custom themes can be created with the blank
theme template or by modifying existing themes. Each CSS file is heavily commented to
improve usability.

The site contents, including the site structure and information on individual web pages, are
stored in a single MySQL database for each website.

Modules and plug-ins are extra components for adding functionalities to a basic website.
Examples include events, links, contacts and RSS plug-in.

Installation instructions are available on the Pixie website. A user guide (pdf format) is also
available which describes how to use Pixie.


4.2 Requirements

      PHP version 4.3.0 and above
      MySQL version 4.0 and above
      JavaScript enabled browser
      Linux/Unix web server for full functionality (Windows platform may not support all
       features)
      FTP for file transfer


4.3 Resources
Pixie can be downloaded from: http://www.getpixie.co.uk/
Google Group: http://groups.google.com/group/pixie-cms




                                                  Page 4 of 25                           Document1
                                                          Temple Team – Project Documentation




5 CMS Requirements
5.1 Hardware
The website is to be hosted on the Swinburne cit3 server. The specifications of the server are as
follows:

   Processor                          Intel(R) Pentium(R) 4 CPU 1.60GH
   Memory                             1Gb RAM
   Hard disks                         /dev/sda 500Gb
                                      /dev/sdb 80Gb



5.2 Software and operating system requirements
   Operating system                   Linux
   Distribution                       Fedora Core 7
   Linux kernel version               2.6.23.17-88
   PHP version                        5.2.6
   PHP Modules installed               php-pear-1.5.0-3
                                       php-bcmath-5.2.6-2.fc7
                                       php-pdo-5.2.6-2.fc7
                                       php-mysql-5.2.6-2.fc7
                                       php-xml-5.2.6-2.fc7
                                       php-debuginfo-5.0.5-2.1
                                       php-pear-ole-0.5-2.2.fc4
                                       php-mcrypt-5.0.5-1
                                       php-imap-5.2.6-2.fc7
                                       php-devel-5.2.6-2.fc7
                                       php-gd-5.2.6-2.fc7
                                       php-5.2.6-2.fc7
                                       php-pear-excel-0.8-1.2.fc4
                                       php-mbstring-5.2.6-2.fc7
                                       php-ldap-5.2.6-2.fc7
                                       php-common-5.2.6-2.fc7
                                       php-cli-5.2.6-2.fc7
   Web servers                         Apache, lighttpd
   Apache version                      2.2.8
   Databases                           MySQL, postgresql
   MySQL version                       5.0.45-6




                                                  Page 5 of 25                        Document1
                                                       Temple Team – Project Documentation



6 CMS Enhancement
6.1 Feature
We have decided to add the functionality for users to create and maintain a photo gallery within
Pixie, as this is currently not catered for and is a highly desired function for the website.

6.2 Layout
We will add a new module called galleries.php (with associated file galleries_functions.php).
This controls the administration and the viewing of the galleries.

6.3 Code
When the administrator adds a new photo gallery using the Pixie admin mode, they will specify a
source folder, which contains an images folder and a thumbs folder. The objective is to get the
user to upload the main images via FTP to the source folder, and for the CMS to create the
thumbs the first time the gallery is viewed.

When the web user clicks on Photo Galleries, the code will loop through all available gallery ids
in the MySQL database, and then display links to the galleries on the page, with a short
description. When the user clicks on the link, the code will examine the relevant thumbs folder. It
will then display each thumbnail image, and create a link on each to the corresponding file in the
images folder using a loop. When the thumb is clicked, the image will open in a light box style
view. There is no real limit to the number of galleries the administrator can create.




                                                  Page 6 of 25                          Document1
                                                          Temple Team – Project Documentation




7 Website Design Principles
To keep in line with the cultural styles and the style of the temple itself, the use of colour is quite
important. The layout needs to be uncluttered, as we want the users to be able to see the
content immediately without any distractions, such as flashing ads, or links to other, less
relevant, content.

We will take photos of various elements of the temple itself, which we can then use either as
graphics in the site layout, or just as inspiration for colour choices. This will help create a visual
link between the web site and the physical temple itself.

While the use of interesting and stylish fonts would be desirable, we need to make sure that all
fonts used are safe for use on the web.




                                                    Page 7 of 25                            Document1
                             Temple Team – Project Documentation




8 Design Diagrams
8.1 Website Hierarchy




8.2 Page design




                        Page 8 of 25                    Document1
                                                        Temple Team – Project Documentation




8.3 Navigation design

A horizontal top bar navigation has been chosen. While generally this would not be the first
choice for a CMS based web site, the client has been fairly clear that they really only need a
limited number of pages. The main entries they will make will be on the Events and Photo
Galleries pages. The team feels this navigation style will be the least cluttered and will allow for
a decent width in the content area.




                                                   Page 9 of 25                           Document1
                                                          Temple Team – Project Documentation



9 User Instructions for Photo Gallery Module

For the photo gallery module to work, the following files and folder were added to the original
Pixie CMS source code. Please check that these essential files are present in their desired
locations.

file/folder                                                            Location
galleries.php                                                         \admin\modules\

galleries_functions.php                                               \admin\modules\
lightbox (folder containing 3                                         \
subfolders)

If re-installation of Pixie from scratch is required, ensure that the photo gallery module is also
manually added. All components required for the photo gallery enhancement are enclosed in a
zip file available for download from the temple team homepage
(http://cit3.ldl.swin.edu.au/~temple/). Simply extract the zip file into the directory in which Pixie is
installed.

Step-by step guide to add a photo gallery to a Pixie website:

1. Log in to Pixie admin as a user with administrative rights.
2. Click on the Settings tab near the top right corner of the screen.
3. Under the Create a new page section, choose Module/Plug-in for the Page Type.




                                           Screenshot 8.1

4. Click on the Create page button.

5. The next Screen will show a list of modules or plug-ins to choose from, select Photo Gallery.



                                                    Page 10 of 25                           Document1
                                                        Temple Team – Project Documentation




                                          Screenshot 8.2

6. Then click on the Install button at the bottom of the page.

7. Go back to Settings tab and select Settings for the Photo Gallery page. Scroll down and
change the “In Navigation” to Yes, then click on Update.




                                          Screenshot 8.3




                                                  Page 11 of 25                      Document1
                                                       Temple Team – Project Documentation




                                         Screenshot 8.4

8. Go the Publish tab (next to Settings) and select the Photo Gallery icon.




                                         Screenshot 8.5




                                                 Page 12 of 25                    Document1
                                                       Temple Team – Project Documentation


9. Click on the green button named Add new Photo Gallery entry.




                                          Screenshot 8.6

10. Fill in all 4 fields and then save. Try to choose a name for the source folder that relates to
the title, and use all lowercase letters and no spaces. Make a note of the name you have given
to the folder, as this is the folder you will put your images into in the next two steps.




                                          Screenshot 8.7




                                                  Page 13 of 25                          Document1
                                                       Temple Team – Project Documentation


11. On your computer’s hard disk, create a folder with the name of the sourcefolder specified in
the previous step (it must be identical). Create a subfolder within this new folder with the name
“images”. Place all photos to be used for the gallery in the images subfolder.

12. Using an FTP program, upload the whole source folder from your computer into
\files\galleries\ on the server.

13. Clicking on View Site will show that the Photo Gallery now appears in the navigation bar of
the website.




                                         Screenshot 8.8

14. Clicking on View next to an album will show the thumbnail images of the photos.




                                         Screenshot 8.9


                                                 Page 14 of 25                         Document1
                                                        Temple Team – Project Documentation



15. Clicking on a thumbnail image will show the full size photo in a light box style display.




                                          Screenshot 8.10

16. For additional albums, repeat Steps 8 to 12.




                                                   Page 15 of 25                          Document1
                                                 Temple Team – Project Documentation




10 Client Acceptance Testing
10.1 CMS admin interface testing




                                                             1



                                                                     3

                       2




                                    Screenshot 9.1

                Add New Gallery Testing components                       Date     Initial
  1. Does the Photo Gallery show in the Pages section when Publish
     tab is clicked? (Screenshot 9.1 Step 1)
  2. Does the Photo Gallery details section show when the Photo
     Gallery page is clicked? (Screenshot 9.1 Step 2)
  3. Does the Add new Photo Gallery entry button show when Photo
     Gallery page is clicked? (Screenshot 9.1 Step 3)




                                            Page 16 of 25                       Document1
            Temple Team – Project Documentation




Screenshot 9.2




          Error message!




Screenshot 9.3




       Page 17 of 25                   Document1
                                                Temple Team – Project Documentation




                                             Save message!




                                            New gallery details



                                   Screenshot 9.4

      Adding New Gallery Details Testing Components                  Date    Initials
1. When the Add New Gallery Entry button is clicked, is Screenshot
   9.2 presented to the user with empty fields?
2. When the Save button is clicked and a mandatory field is left
   blank:
   - Is the user presented with an error message? (Screenshot
       9.3)
   - Is the photo gallery not created? (i.e. no new details are
       listed)
3. When the Save button is clicked and all fields are filled in:
   - Is the user presented with a success message? (Screenshot
       9.4)
   - Are the new gallery details listed?




                                           Page 18 of 25                    Document1
            Temple Team – Project Documentation




Screenshot 9.5




Screenshot 9.6




       Page 19 of 25                   Document1
                                                 Temple Team – Project Documentation




                                                  Saved updates message!




                                            Details updated


                                    Screenshot 9.7

            Edit Gallery Details Testing Components                     Date    Initials
1. When Edit is clicked (Screenshot 9.5), is Screenshot 9.6 presented
   to the user with the existing gallery details in the fields?
2. When the Update button is clicked and a mandatory field is left
   blank:
   - Is the user presented with an error message? (Screenshot 9.3)
   - Is the photo gallery not edited? (i.e. no change in the details)
3. When the Update button is clicked and all fields are filled in:
   - Is the user presented with a success message? (Screenshot
       9.7)
   - Are the gallery details edited?




                                           Page 20 of 25                       Document1
                                               Temple Team – Project Documentation




                                   Screenshot 9.8




                                               Deleted successfully!




                            Gallery removed!


                                   Screenshot 9.9

             Delete Gallery Testing Components                         Date    Initials
1. When Delete is clicked, does a confirm message dialog show?
   (Screenshot 9.8)
2. When OK button is clicked,
   - Is the user presented with the Successfully deleted entry
      message? (Screenshot 9.9)
   - Has the photo gallery been removed from the list?
3. When Cancel is clicked, did the dialog disappear and nothing
   changed?


                                          Page 21 of 25                       Document1
                                        Temple Team – Project Documentation


10.2 CMS user interface testing




                            Screenshot 9.10




                            Screenshot 9.11




                                   Page 22 of 25                   Document1
            Temple Team – Project Documentation




Screenshot 9.12




Screenshot 9.13



       Page 23 of 25                   Document1
                                                    Temple Team – Project Documentation




                 View Gallery Testing Components                         Date    Initials
1.   When Photo Gallery is clicked (Screenshot 9.10), is the user
     presented with the Photo gallery page? (Screenshot 9.11)
2.   When the View hyperlink is clicked (Screenshot 9.11), are the
     gallery thumbnails displayed? (Screenshot 9.12)
3.   When a thumbnail is clicked, does the full sized image of that
     thumbnail show? (Screenshot 9.13)
4.   When the Close button of the image is clicked, does the full size
     image close and the thumbnail page is displayed again?




                                              Page 24 of 25                     Document1
                                                       Temple Team – Project Documentation




11 Contributions Declaration
The signatures below certify that the project, based upon the requirements identified for the
Hindu Temple Website Project has been completed and the following team members
contributed as specified


Team Leader – Colin Weight




Signature ………………………… Date ……/……/….. % contribution to Project ……….
          Signature Required



Team Member – Andrea Bainbridge




Signature ………………………… Date ……/……/….. % contribution to Project ……….
          Signature Required



Team Member – Karen Mok




Signature ………………………… Date ……/……/….. % contribution to Project ……….
          Signature Required



Team Member - Cladine Momongan




Signature ………………………… Date ……/……/….. % contribution to Project ……….
          Signature Required




                                                 Page 25 of 25                         Document1

				
DOCUMENT INFO
Shared By:
Categories:
Tags:
Stats:
views:7
posted:9/23/2012
language:Unknown
pages:28