College Currents Design Paper

plumpbustlingInternet and Web Development

Dec 4, 2013 (4 years and 7 months ago)


College Currents Design Paper

November 1, 2010

Owen Herndon, Jake Elrod, Elizabeth Brown, Jonathan Rhodes


Deciding on where to go to college is a hard decision for many high school students. Many
factors such as cost,
courses offered, environment, and location all go into the decision making process.
Much of the time it is hard to come by an objective resource with this information. One must search
online, ask friends, call colleges, and even make expensive trips to fig
ure out which one might be the
best for them. College Currents seeks to take the hassle out of deciding where to go to college by
providing this information in a single location.

College Currents is a web site designed to show students what colleges are ac
tually like while
also allowing them to share their opinions about different colleges. Students will be able to read about
different institutions as well as listen to and watch actual lectures at those institutions. They will also be
able to comment on the

audio and video files and any blog articles in order to share their opinion with
other students. College Currents seeks to bring the college experience to students through the internet.

System Features and Scope

System Features is a we
bsite that allows high school students to research colleges that they
would like to attend. This site heavily uses personalized audio and videos as their main source of
research information. In addition to these features, visitors to the site will also b
e able to ask questions
and make comments for different articles, videos, and audio clips. We believe that these features will
help make stand out from other college research websites and be attractive to
high school students and ulti
mately draw them to the website whenever they want to research various

The system will have the following features:


Provide an effective website navigation framework and arrangement

When uses come to
the site, they will see a main page that w
ill provide three specific sections for site content.
These sections will allow users to access pages that hold similar kinds of college based
information. The kinds of information available will range from specific information about
colleges that they a
re interested in, information concerning college preparation, and general
information about the college experience.


Allow for users to access audio and video clips for researching purposes

This is main
feature of and what pulls mos
t people to the website. Users will be
able to access audio and video clips that apply to the sections of the website. Several of the
clips will apply to a specific college, with many these clips coming from the colleges


Facilitate social in
teraction through the use of a comment system

For specified articles on
the website, there will a comment system below the content that allows users to discuss
what they think about the article and ask questions. This will help aid students as they
arch and gain a better understanding about colleges and college life.


In order for to be a working and desirable website that meet’s the
sponsors’ needs, some important requirements must be met. The first requirement is to have

a hosting
solution set in place. We have decided to continue to use the internet hosting site Network Solutions to
meet the current needs of the site. The second requirement is to set up a system of hierarchy and
management. In order to keep costs and
development time low, we have decided to use a free, open
source content management system that will manage all aspects of our website. This will help the
administrators as they create more pages and add content; and this will provide a good platform for
future development. The third requirement is to create an effective and attractive template that is
targeted for high school students. A bad website template will not attract visitors, so an attractive
template is very important. One last requirement fo
r the site is to have the content and information
that is to be placed on the website. This includes the information for each page, and the audio and
video files. Without this, then will have little purpose and become ineffective for
college research.

System Description

Similar to what has been said above the purpose of the College Currents website is to provide its
target market of soon to graduate high school students whom are in the middle of making a decision of
what college to ch
oose. The goals set by the College Currents website are to provide broad amount of
information about many colleges across the United States, to present that information in a video
format, and to provide a website that suits the look and feel desired by the
ir target market. The solution
to meet these goals is to abandon their original website and build a new one that supports the features

To go more into detail about what resources are included in the system we first look at the
hosting service we

have chosen, Network Solutions. The fact that College Currents will site on a Network
Solutions server eliminates the cost of purchasing and maintaining any form of hardware. The software
used will be Joomla!, which is a free content management system. Th
is will be used to organize, change,
and edit new and old content on the website. Other software that will be used in the development will
be Photoshop for editing pictures as well as creating graphics for the website and Dreamweaver for
creating a templat

Software Integration and Platform

Player Plug

This plug
in enables the administrator to post and stream audio and video files to articles. This
in is very simple to use and is compatible with many audio and video file types. In order to
a file locally, the administrator must first upload the media file to its proper directory on the website.
Once the file is uploaded, the administrator can go into the proper article where they are streaming the
file and write a simple line of cod
e that references the file. If they are streaming a media file such as a
video from, then they simply go to the article and write a line of code that links to the

extPlorer File Management Module

This plug
in helps aid the administrat
or as they access and upload files from the website. Since Joomla’s
lacks a built
in file management system, other than a very limited one used only for media files, a quality
file management extension is essential. This extension is a very easy
use f
ile manager that allows the
administrator to access any file on the website easily and quickly. Some of the great qualities and
features of this system other than effective navigation are the ability to upload/download files, edit text
based files, and ea
sily rearrange files and directories. In order to access this file manager, all the
administrator needs to do is go up to the top menu in the Joomla backend and select extPlorer.


To provide a commenting system for College Currents, we have imp
lemented a free Joomla
extension called JComments. JComments is a widely used extension for Joomla and there exists a great
deal of support online for any issues that site administrators might have while using the extension. The
main reason we have chosen
JComments is because the number of features it has. Some of the features
include (but are not limited to):

Allows turning on/off the comment system for categories, single material as well as for
static material.

Allows automatically to publish the comment
s for existent users' groups.

Setup the edit/delete rights for existent users' groups.

Informs the administrator about new comments.

Allows users to be informed about new comments.

Possibility to edit comments from front

Possibility to display commen
ts page by page and custom view of page numbers

Setup the comments display order. (the last comment in the beginning or otherwise in
the end of the list)

Supports the BBCode with possibility to setup the access rights to tags for different
s' groups.

Supports "hot" keys to send comments or insert BBCode tags.

Usage of AJAX technology allows to add, delete and edit comments without page

Allows to show the comment adding rules to some users' groups.

Supports RSS
feeds for comments
on any material or for all comments.

Supports the template system to customize the view.

Possibility to show and check the "Website address" and "Email" fields in edit form.

A simple filter of unquotable words.

Supports the search within comments by help
of search mambot.

So JComments allows for a very dynamic commenting system that can easily be controlled and is highly
customizable, making it the best choice for College Currents.


RokAjaxSearch is a free extension for Joomla that we have i
mplemented on College Currents.
RokAjaxSearch's main feature is that it provides real
time searching throughout the entire site. It does
this through Joomla's search engine that is already built in. The RokAjaxSearch search bar provides a
clean look and fe
el for searching and is fairly fast. Also, if the article is not shown on the real
time search
bar, RokAjaxSearch provides a fall
back through the traditional Joomla search. It's simple design and
ease of use makes it ideal for searching throughout College


Joomla Content Management System (CMS)

Content management systems are necessary today in order to have a good, modern
website. On top of this, these systems help organize the website information and streamline the
functions of creatin
g a website and adding content to it. Essentially, whenever the administrator
performs any changes to the website, they will use Joomla to perform these tasks. The standard Joomla
CMS with no extensions is quite simple but has the necessary functions for
a simple website. However,
when administrators want to add other capabilities and functions, they will want to add extensions such
as plug
ins and modules. Since College Currents requires video, searching, and the ability for posting
comments, we have ad
ded the appropriate extensions for these functionalities. In fact, Joomla and it’s
extensions are dependent upon each other in order to work properly and give College Currents the right
kinds of content and features.

Network Solutions

Network Solutions
is the hosting provider for College Currents. With their 99.99% uptime they
provide quality hosting and the guarantee that College Currents will always be online. Network
Solutions' powerful back
end gives College Currents' administrators the means to easi
ly and effectively
manage the site. Site administrators can easy change where the site's domain names point to in the site
and easily upload files onto the site without any restraints on file size. The File Manager allows for
administrators to set permissi
ons for files on the site for not only users but also the pages themselves.
The unlimited package that College Currents runs on provides unlimited bandwidth and unlimited
storage for the site. All of these features make Network Solutions the perfect host f
or College Currents.


When designing the College Currents site, our main goal was to create a site that was appealing
to their demographic, college
bound high school students, and that was easy to navigate. The overall
look of the site was design
to resemble current social media sites, such as Twitter and Tumblr, and was
inspired by the iPhone interface and application icons. The use of rounded rectangles to contain the
header, navigation, body, and footer gives the site a sleek, modern feeling. Th
e icons for College
Current’s three main navigational categories were created to resemble iPhone application icons through
the use of flat vector graphics and a rounded opaque overlay that makes the icon look reflective and as
if it were a three
l object.

The font for the site, Myriad Pro, was chosen because of its association with Apple as its
corporate font. In addition, as a sans serif, it is more easily read on a computer screen even at small
point sizes. When discussing potential color schem
es with the sponsor, they requested that the colors
used for the site be unrelated to any individual college or institution in order to avoid appearing to show
partiality to one school over another. Keeping that in mind, the colors selected were hues of gr
een, teal,
navy, and chartreuse, which work well together because of their relationship as analogous colors. They
give the site a light and inviting feel without looking childish or overwhelming bright. The layout of the
site encourages ease of navigation
through its prominent top navigation bar and a search box placed in
the header. From anywhere in the site, users can jump to the different categories of videos or search for
something new.

When converting the paper prototype to a Joomla template, the firs
t step was to write the
necessary html and css code to create the header, navigation, body, and footer of the page in Adobe
Dreamweaver. To build the rounded rectangles used throughout the site, it was necessary to create
images for each of the corners in
Adobe Photoshop, a raster
based design program, by dividing a circle
into quadrants. A different set of corners had to be made for each rectangle so that the background of
the image would match the color of the background on which the rounded rectangle was

placed. The
navigation icons and about us icon were created in Adobe Illustrator, a vector
based design program, to
ensure that they kept their smooth edges even at large sizes and then saved as jpg images. The entire
site was then saved as a php file bec
ause Joomla requires that file references be made in php.


also has specific requirements on what needs to be included in their templates. One of
the most important parts was the document details xml file. This file lists everything that is needed in
the template including folders, image files, css files, and tem
plate positions. These positions tell Joomla
where content can be added and structure the page. It was also necessary to include information in the
css specific to each position to create a uniformed look across the site. It is not required to use every
sition on every page, but including the design aspects in the css rather than the html reduces the
amount of code that is required during the creation of each page and ensures that the positions will look
the same on every page. Currently, six different po
sitions are included in the template, one in the
header, and the rest in the body. The body is divided into two columns with a left sidebar and a main
content section. It also includes a top section above the sidebar and content and two footer sections
ow it.

Implementation Strategy

Whenever a company in today's business world looks to install a new system over an old they
have four paths to choose to do so.

The four options
that may be chosen as an implementation strategy
are Phased, Pilot, Parallel, and Direct Implementation.

Each has its own strengths and weaknesses that
we had to weigh as we developed a implementation strategy of our own. To be able to identify the
gths and weaknesses of each strategy we had to understand how each worked.

The first type of implementation strategy we discussed was phased implementation. The reason
it is named phased is because this strategy consist of multiple stages or phases as the

new system will
replace the old system one step at a time. This type of strategy is a double edged sword as the biggest

for this type of strategy is the extra time to allow users to adopt to the new system as it is
gradually introduced over a long

period of time. At the same time its biggest downfall is exposed as
complicated problems can arise as the new systems may conflict with the old, making this strategy
result is complexity and confusion among users. Because of these issues this type of stra
tegy sits in the
medium risk category of the types of implementation system. A big deciding factor on what strategy we
were to use was the time factor. The College Currents Team chose to pass on this type of
implementation strategy as we lacked the manpowe
r to achieve implementation within our timeframe
using this strategy.

The other strategy that is also categorized as medium risk is the pilot implementation strategy.
Pilot implementation is normally used by large companies that have multiple branches. Wh
en using a
pilot implementation strategy a company will test the new system in the branch of the company. The
branch that possesses the new system will then be observed and monitored. This is done to gain higher
up approval that the system will work and t
he cost is justified to install the new sys
tem in the rest of the
company. This type of stra
y is rated medium risk because you are using part of the company as a
guinea pig. Thus putting part of the company at possible risk of failure. We chose not to u
se a pilot
implementation strategy mainly due to the size of our project and company that we are working for
being relatively small.

The safest implementation strategy is a parallel implementation strategy. The word parallel is
referred to two objects tha
t run alongside each other that will never intersect. When referring to IT
systems the word parallel means both the old and the new system will remain live.
The reason this is the
safest and least risky of the four strategies is because the old system serv
es as a safety net if the new
system were to fail. The upside is the company would be able to continue on with its business if the new
system fails. The downside is that the company is having to pump out the dollars to keep two systems
online. This type of

strategy was an option for us, however we try and keep the cost down of our
sponsor so we opted for the fourth option of implementation strategies, which is direct implementation.

Direct implementation is what fit our bill the best. How direct implementa
tion works is a clean
break off of the old system while snapping the new system back in place. The old system is more or less
scraped and the whole weight of the project falls upon the new system working, and it working better
than the old. This was our ma
in goal for this project was doing away with the current website our
sponsor had up while creating a
new one that met expectations that the old had not. The other selling
point of direct implementation is that is the fastest and cheapest way to implement a

new system. The
fact that we had a very limited time of three months to

the site as well as

a minimal budget for
this project direct implementation was the best choice for this project.



Appendix A


Appendix B


Appendix C


Appendix D


Appendix E


Appendix F


Appendix G


Appendix H

Gantt Chart

Appendix A





Appendix C


Appendix D


Appendix E



Appendix F


Appendix G


Appendix H

Gantt Chart




Dr. Don Geddes



Catherine Sevier