Center for Business and Social Analytics ___________________________________
ITM 444 Website Project
Final Report
11/28/2016
Robert Bens
Marc Bellemare Tyler Falcoff Alex Nicoski Kelly Skarritt
Cover Letter
1
This report summarizes the work of the project team on the Center for Business
and Social Analytics website redesign. The project was brought to the Information Technology Project Management course (ITM 444), which serves as the capstone course for the Information Technology Minor at Michigan State University. This project is the combination of our team’s skills as developed by Michigan State University’s programs. Within this report, you will find the summary of the project to redesign CBSA’s previous website in order to provide users with a more interactive experience along with database to allow users explore and connect with others in their area of study.
The team worked a total of 261 hours, averaging 52.2 hours per team member
on this project. Using the average salary for entry level web developers and an information technology project manager (provided by www.payscale.com), this project is valued at $5,958. Team CBSA is pleased to deliver this project at no cost to the Center for Business and Social Analytics as a part of the capstone course of the Information Technology Minor at Michigan State University.
The entire team, Robert Bens, Marc Bellemare, Tyler Falcoff, Alex Nicoski, and
Kelly Skarritt greatly appreciates the opportunity to work with Dr. Brian Pentland and the Center for Business and Social Analytics. Each one of us has substantially learned more about websites and databases throughout the course of this project. We would like to thank Dr. Brian Pentland and the others a part of the Center for Business and Social Analytics for investing their time into this project and our team, and we are pleased to present this finished product.
Signed, Team CBSA
Tyler Falcoff Marc Bellemare Robert Bens Alex Nicoski Kelly Skarritt Project Manager Back-End Developer Back-End Developer Front-End Developer Front-End Developer
Invoice
2
CBSA Project Team Center for Business and Social Analytics
INVOICE #001 DATE: 12/4/2016
TO: FOR: Dr. Brian Pentland Website Redesign Project
DESCRIPTION HOURS RATE AMOUNT
Tyler Falcoff, Project Manager 54 $26 $1,404
Kelly Skarritt, Front-End Developer 50 $22 $1,100
Alex Nicoski, Front-End Developer 50 $22 $1,100
Robert Bens, Back-End Developer 57 $22 $1,254
Marc Bellemare, Back-End Developer 50 $22 $1,100
TOTAL: $5,958
Table of Contents Executive summary……………………………………………………………….…………….4 Goal…………………………………………………………………………………...….4
3
Who We Are………………………………………………………………………….….4 What We Did………………………………………………………………………....….4 Team Contact Information…………………………………………………………………..….5 Statement of work……………………………………………………………………………....6 Purpose……………………………………………………………………………..……7 Scope……………………………………………………………………………....…….7 Project Deliverables…………………………………………………………………….7
Goals and Objectives……………………………………………………………….….8 Cost and Schedule Estimates……………………………………………………....…9 Stakeholders………………………………………………………………………….....9
Chain of Command…………………………………………………………………....10 Benefit and Risk Evaluation…………………………………………………..………11 Assumptions and Constraints……………………………………………………...…11 Communication Plan……………………………………………………………..……12 Sign Off………………………………………………………………………………....13
Website documentation…………………………………………………………………....….14 Site map…………………………………………………………………..…………….14 context diagram…………………………………………………………….………….14 Data Flow Diagram…………………………………………………………………….15 Source-file/web-page matrix……………………………………………………….…15 All digital assets (e.g., images)…………………………………………………….…16 Create a Profile User Manual…………………………………...……………………19 Adding Additional Logo Images…………………………………...…………………20
Server Documentation ……………………………………………………………………...21 About…………………………………………………………………………………....21 Setting Up the Server……………………………………………………………….…21 Create a Key Pair for SSH Access and FileZilla Access…………..……...21 Security……………………………………………………………………...….22 Creating the EC2 Instance…………………………………………....………23 Tomcat7…………………………………………..………………………….....23 Installing………………………………………………………………...23 Configuring Tomcat7 Manager……………………………………….24 Database Management……………………………………………………………….25 Installing MySQL……………………………………………………………….25 Creating the Database………………………………………………………...25 Importing/Exporting…………………………………………………………... 25 Generating a War File…………………………………………………………………27 Accessing the Server………………………………………………………………….27
Terminal…………………………………………………………………….......27 FileZilla………………………………………………………………………….27
Summary………………………………………………………………………………………..33
Executive Summary Goal
4
The goal of this project was to produce a website that helps connect Michigan State University faculty from diverse disciplinary departments to increase the flow of information, enable potential collaborations, and support the CBSA mission. Who We Are Our team consists of four Michigan State University ungraduates in the Information Technology Minor.
● Tyler Falcoff is a Supply Chain Management Senior from Bloomfield, Michigan, who served as the project manager on the team.
● Kelly Skarritt is a Media and Information senior from Walled Lake, Michigan, who served as one of the two front-end developers on the team.
● Alex Nicoski is a Media and Information senior from Grand Rapids, Michigan, who served as one of the two front-end developers on the team.
● Robert Bens is a Media and Information senior from Taylor, Michigan, who served as one of the two back-end developers on the team.
● Marc Bellemare is a Computer Science and Engineering senior from Plymouth, Michigan, who served as one of the two back-end developers on the team.
What We Did The CBSA project team redesigned the original website for the Center for Business and Social Analytics and added a database created by Dr. Josh Introne in order to help faculty from different departments connect. We added new content to the website and also created an interactive logo that rotates pictures of CBSA faculty.
Team Contact Information Robert Bens - Developer, Back-End
Email: [email protected]
5
Marc Bellemare - Developer, Back-End
Email: [email protected]
Tyler Falcoff - Chief, Project Manager
Email: [email protected]
Alex Nicoski - Developer, Front-End
Email: [email protected]
Kelly Skarritt - Developer, Front-End
Email: [email protected]
Statement of Work Team CBSA: Robert Bens
Marc Bellemare
6
Tyler Falcoff
Alex Nicoski
Kelly Skarritt
Statement of Work
for
Center for Business and Social Analytics
MSU
Composed for: Dr. Brian Pentland
Project Start Date: September 27, 2016
Project End Date: December 6, 2016
Purpose
To produce a website that helps connect MSU students and faculty from diverse
disciplinary departments to increase the flow of information, enable potential
collaborations, and support the CBSA mission.
7
Scope
The Center for Business and Social Analytics (CBSA) Team will work closely with the
stakeholders to provide a final website that will connect both students and faculty from
across campus. The redesign of the CBSA website will be done by working closely with
our client, Dr. Brian Pentland. We will implement a practical tool that will intuitively
connect students and faculty outside of their departments in order to grow the number
of interdisciplinary connections and encourage collaborative work through the CBSA.
Based on stakeholder feedback and input we will restructure the CBSA website
to reflect the new intended purpose of the website. Additional content and functionality
may also be added based on further conversation with the client and the primary
stakeholders from the CBSA. Following the completion of the CBSA website, we will
provide documentation of the website’s structure and design so that it can be easily
updated and maintained in the future.
Project Deliverables
The updated version of the CBSA website will act as a gateway for faculty and students
to search for new areas of study and collaborate with other members of the MSU
community outside of their respective departments. Therefore, this project necessitates
the following deliverables:
1. Website design that follows MSU guidelines
2. Redesign the flow of information within the site
3. Integrated website requirements including the CBSA logo, calendar and social
media
8
4. Designed ScholarMap according to functional, visual and content requirements
5. Integrated ScholarMap with CBSA website
6. Contact/email signup
7. Additional content (hyperlinks and videos)
Goals and Objectives
To develop a product that helps accelerate research to understand and predict
social, economic, business and government processes. The major goal of this
project is to have the new CBSA website up and running by December 6th. The
objective of the website is to provide an information platform that researchers
can refer to for interdepartmental expertise and collaborations. Implementing a
visual network provides an alternative to departmental silos and may spark
serendipitous encounters and collaborations. Stakeholders with an affinity to
delve into one area will have the opportunity to expand their social capital,
accelerate, and expand the scope of their research.
Cost and Schedule Estimates
1. Schedule meeting with Josh (prototype of grails application) - October 17th
2. Website design prototype (CBSA logo, calendar of events & social media) -
October 24th
3. Functional ScholarMap prototype - November 7th
4. Final ScholarMap design and content - November 14th
9
5. Final website (with ScholarMap) - November 18th
6. Complete website testing - November 21
7. Code freeze - November 22nd
The expectation from this project is to have the website live by December 6th.
Development will happen regularly throughout and updates will be given to the client
weekly. Estimated cost savings will be for an approximate 400 hours of development
time billed at $59 per hour totaling $23,600.
Stakeholders
● Dr. Brian Pentland
● Josh Introne
● Dr. Constantinos Coursaris
○ Professor
● Faculty & Staff
● Student Organizations
Chain of Command
Phase Robert Marc Tyler Alex Kelly
Initiate R I A P R
Plan & Chart A A P A A
Develop F.E I I I A P
Develop B.E P A I I A
10
Launch P I A A R
Testing I A A I P
Training I I P A R
Documentation
R P A I I
P = Primary A = Assigned R = Review Required I = Input Required S = Signature
Required
Benefit and Risk Evaluation
Type of Risk Jeopardy Description of Risk Expectation of Risk (1 to 5)
Impact of Risk
(1 to 5)
Severity of Risk
(ex * im)
Contingency Plan of Action
Broadness of Scope
Not meet clients needs
Client is unsure of of some specific requirements
5 5 25 Have constant communication with client on what is expected
11
Communication with Josh Introne and faculty
Some aspects of the project could not be completed
Reliance on others besides the team and the client could result in delayed schedule
4 4 16 Not include faculty aspects of project in the project deliverables
Inexperienced Team
Quality of project Reliance on students who have never worked together before
3 5 15 Consult resources to better understand technological issues
Unexpected Schedule Changes
Not meeting project deadlines
Unplanned issues with the schedule
2 4 8 Change the meeting times or add more meetings in order to finish on time
Assumptions and Constraints
We assume that our work will be up to standard and will be completed on time. We also
assume that the website that will be completed will be compliant with the MSU
Accessibility and Usability Standards. The largest constraint for this project is time,
given that we only have roughly two months to complete the project.
Communication Plan
We will meet every Monday and Tuesday between 6PM and 9PM unless discussed
otherwise. Weekly timesheets and memos will be turned in on Sunday evenings.
Communication among the members of our group will happen primarily on GroupMe
12
and email. Communication with the client will be through email. Responses are
expected within 48 hours, and we will extend the same courtesy. The documents used
for the project will be shared and handled in the way most proper to the file type. Our
group consists of 5 members whose roles will vary throughout because of the broad
project scope. The roles of each member of our group are listed below:
Robert Bens - Developer, Back-End Email: [email protected] Marc Bellemare - Developer, Back-End Email: [email protected] Tyler Falcoff - Chief, Project Manager Email: [email protected] Alex Nicoski - Developer, Front-End Email: [email protected] Kelly Skarritt - Developer, Front-End Email: [email protected] Team Sign Off
Signature:___________________________________
Date:___________________
Signature:___________________________________
Date:___________________
Signature:___________________________________
Date:___________________
Signature:___________________________________
Date:___________________
Signature:___________________________________
Date:___________________
13
Client Approval
Signature:___________________________________
Date:___________________
Website Documentation Site Map - CBSA
Site Map - ScholarMap
14
Context Diagram
Data Flow Diagram
15
Source-File/Web-Page Matrix About Us index.html Seed Grant Program seed-grant.html Free Lunch lunch.html Annual Conference conference.html Campus Resources resources.html ---------------------------------------------------------------------------------------------------- Site CSS screen.css Site JavaScript index.js ---------------------------------------------------------------------------------------------------- Search Icon (on all pages) icon-search.png MSU Masthead (all) masthead-helmet-white.png MSU Wordmark (all) msu-wordmark-white-221x47.png Digital Assets
16
17
18
Create a Profile User Manual The following is a user manual created by Dr. Brian Pentland, intended for the use of CBSA members.
Center for Business and Social Analytics Michigan State University
November 15, 2016 One way that the Center for Business and Social Analytics helps build connections between researchers is through our new web site. We are using an web application called ScholarMap, developed by Professor Joshua Introne (MSU Department of Media and Information). To be affiliated with CBSA, please fill out a profile. There are three basic steps. Step 1. Start a new profile.
2. Fill in your details and photo.
19
3. Add some interests: methods, areas, venues and theories. This section is potentially the most work. Your interests are used to make connections in the network. The more interests you include the better. Roughly speaking: · Methods = research methods, models, statistical tools, etc. · Area = subject matter or application areas · Venue = conferences or professional associations · Theory = whatever you want to put... For each interest, you will be prompted to add descriptions and references, but you can simply decline. Perhaps we can add them later. No worries.
All set! Adding Additional Logo Images
20
First, each image needs to have the dimensions 210x292. It may be better to crop some of the image out before resizing to 210x292. Next, you should go to the images folder for the website. This is the path to it (assuming you are in the main ScholarMap folder) ScholarMap/grails-app/assets/cbsa/images/CBSA
The folder called CBSA in the images folder contains all of the actual images. Each image is labeled by the letter following by the next available number. Add any new images here following the same format. The rest of the editing will be done in the javascript file which is at ScholarMap/grails-app/assets/cbsa/js/index.js If you were to add a new C image, it would have to be called c-8 since the highest previous image is c-7. Then, you would need to open the javascript file and add it to the array of C images and also increase the number of random images being selected. *This will also require making a new war file - See server area for details
Server Documentation
21
About Currently the site is live on our server at http://ec2-52-15-139-233.us-east-2.compute.amazonaws.com:8080/ScholarMap/ The server is an EC2 instance created using Amazon Web Services https://aws.amazon.com/. In order to run the Grails application, Tomcat will need to be installed. Further information can be found at http://tomcat.apache.org/ Setting Up the Server Create a Key Pair for SSH Access and FileZilla Access
Before we actually launch the EC2 instance, it will be beneficial to create Key Pair for SSH access and FileZilla access.
Go to the EC2 Console
Click on Key Pairs
Click on the Create Key Pair button – Enter a Key Pair Name to be used for the SSH access. We will use this Key Pair name when we create the EC2 instance.
22
Security Setup
By default, the new instance won’t be accessible. Change the default Security Group to make selected services available from the outside.
From the EC2 Console select Security Groups
Select the security group named default from the list of security groups
In the bottom pane choose the Inbound tab
For the Create a new rule choose the service you want to add and click the Add Rule button. For this post, enable: SSH, HTTP, MYSQL, and port 8080.
23
Creating the EC2 Instance – Go to the EC2 console – Click the Launch Instance button – On the next screen choose the Quick Launch Wizard – Select the Key Pair you created in the previous step and the Amazon Linux AMI and then click Continue – On the next screen click Edit Details so that we can change some of the default options. – Click the Termination Projection checkbox to turn it on and enter an Instance Name – Click the Security Settings section and choose default for the security group – Click Save Details – Click Launch to start the new instance Tomcat7 Installing To install Tomcat7 on an Amazon Linux AMI server, SSH into the server and run *See section on how to SSH into the server sudo yum install tomcat7 tomcat7-webapps mcat7-docs-webapp tomcat7-admin-webapps
sudo service tomcat7 start
You should now be able to browse to your Tomcat server at http://ec2-52-15-139-233.us-
east-2.compute.amazonaws.com:8080
*Note: Setup may differ for an MSU server. Configuring Tomcat7 Manager Navigate to the Tomcat7 tomcat-users.xml file and edit it with the text editor vi
24
sudo vi /etc/tomcat7/tomcat-users.xml
Uncomment the following block of code:
You should now be able to navigate to the tomcat manager with the username “admin” and the password “adminadmin”
Database Management Installing MySQL SSH into the server and run:
25
sudo yum install mysql-server
sudo service mysqld start
sudo chkconfig mysqld on
mysqladmin -u root password 'yourpass'
Creating the Database After MySQL has been installed, enter mysql -u root -p
And enter ‘pass’ as the password, then run
create database csst_v3;
The database will automatically be filled when the grails application is ran. Importing/Exporting The easiest way to update the database is by accessing it using MySQL workbench. The download for the workbench is at http://www.mysql.com/products/workbench/ To connect to the MySQL server through MySQL Workbench, add a new connection by clicking on the + at the top of the screen and use the following settings:
26
Once inside the workbench you can now export/import data to/from your local machine to backup data with the tabs Data Export or Data Import on the left side of the screen. Generating a War File In the top level folder of the grails application, generate the war file by entering this command into the terminal grails war The best way to add the War file to the server is by using FileZilla. First, connect to the server *See Accessing the server - FileZilla Navigate to the root folder by clicking on the /. It will look like below:
27
Next, navigate to /var/lib/tomcat7/webapps/ - This is where you will put your War file. After the war file has been uploaded, from the terminal enter sudo service tomcat7 stop sudo service tomcat7 start The site should not be live at ec2-52-15-139-233.us-east-2.compute.amazonaws.com/ScholarMap Accessing the server - Terminal To access the server from the terminal, run: ssh -i “/path/to/CBSA-Grails-2.pem" [email protected]
Accessing the Server - FileZilla The FileZilla client is a great way to access the files on the server. Using the client, you are able to add, remove, and update any files which makes changing the website much easier. The download for the client can be found at https://filezilla-project.org/download.php?type=client and more information about FileZilla can be found at https://filezilla-project.org/ Once the installation for the client finishes, FileZilla should either ask if you want to open it or automatically open. If it does not open, open it. Now the client will need to be configured in order to connect to the server.
28
Steps: 1. With FileZilla open, go to Edit -> Settings (Windows). On a Mac go to FileZilla -> settings which looks like
2. Click the SFTP tab under Connections which will look like:
3. Click Add key file. Here you will add the security file for the Amazon Web Server. I have mine saved in my downloads in a folder called cbsa. Yours can be saved anywhere.
29
4. The panel should now look like this. Click Ok.
5. Next, go to File -> Site Manager (This is the same on Mac and Windows).
30
6. Click on New Site towards the bottom left corner. This will create a new site entry that you can call anything. I called mine cbsa.
7. Add the following settings to the this new site: Host: http://ec2-52-15-139-233.us-east-2.compute.amazonaws.com Protocol: SFTP Logon Type: Normal User: ec2-user Password will be blank
31
After that you can either press OK or Connect. To connect to the site at a later time, simply navigate back to the Site Manager. Your site will be saved and you can connect to it. If it is your first time connecting to the server, this may pop up. Simply press Ok or Check the always trust box and then press Ok.
8. A successful connection will look like this. I mentioned which side is the server and which side is my local computer, since that part will look different and have your local files.
32
*Note: Those steps were for an Amazon web server that uses the security file. MSU servers may not use the same security system.
Summary
33
Again, we, the CBSA team, would like to thank Dr. Brian Pentland and the faculty
of the Center for Business and Social Analytics for the opportunity to work on this project throughout the semester.
Hostnamectl set-hostname cbsa.msu.edu /usr/lib/jvm/java-1.7.0-oracle-1.7.0.131-1jpp.1.el7_3.x86_64
Top Related