GT 141 Project

A. Background

For this project, you will create a website and a native mobile app for “client” You will turn in the final web-site and a native app for Android (.apk). You are NOT responsible for creating an iOS (.api) version.

You may work alone or in a team.

Production Procedure

1. Select a topic for your mobile app

2. Create Teams

a. Assemble into teams

b. Create membership contract

i. Expectations for team membership (attendance, communications, etc.)

ii. Establish group online work space (Basecamp, Huddle, etc.)

3. Create 1-page mock-up and put it on BlackBoard for feedback
Put you 1-page mock-up on BlackBoard for feedback from your instructor and classmates. Your mock-up may be created in any way that you feel is appropriate.

4. Establish scope and functional specifications for your project
Define a scope and set of functional specifications for your project. Use B (Functional Requirements Sample) as a guide for the amount of work required. Be sure to target the requirements and scope to your specific project.

5. Modify your 1-page mock-up
Modify your mock-up using the feedback you received via BlackBoard.

6. Create the web-site (mobile app).
Create the full website that adheres to the mock-up and includes all of the technical aspects detailed below (see technical requirements)

7. Package the app into an Android app (.apk) using Adobe PhoneGap build
Put your files into a folder and then zip them (.zip – not .7zip). and use PhoneGap build to build your app into a native android app. Note: (1) You can use PhoneGap Build for free for building 1-app at a time, (2) your folder should have an index.html page as the “start” of your app, and (3) all of the media for your app should be contained inside of your .zip folder.


8. Fix any issues
Fix any problems expressed by the TA.

9. Turn in project

B. Functional Requirements Sample

1. The site must include a minimum of 7 content pages.

2. The site must validate against against any of the STRICT DTD [XHTML 1.1 STRICT, HTML5].

a. If any of the pages fail to validate, you will loose two letter grades.

3. The site must include a starting “home” page with the filename being “index.html”

4. The site and app must be responsive

a. You may do this via any mechanism you feel is appropriate, including but not limited to Bootstrap, MediaQueries, etc.

5. The site must include both intrasite and extrasite links.

a. At least one content page should utilize a link that sends the user somewhere in the same document.

6. The HTML on each page, should markup the content semantically.

7. The site must include at least one form, containing at least 5 form elements.

a. JavaScript or HTML 5 (CSS3) should be used to validate the forms fields to make sure that none are left blank.

b. The form should target an appropriate PHP/ASP/JSP page on your server

8. The site must be aesthetically pleasing and should display an effective navigation scheme.

9. The site must contain at least one PNG, one JPG, and one GIF graphic

10. The site must be efficiently and effectively designed (as far as download times are concerned, also arrangement of back-end/file structure)

11. The site should be properly sized for a mobile device.

12. The site must be packaged into a native mobile app using PhoneGap

a. It is ok to create 2 deliverables from the same codebase

CSS Requirements

13. Accommodate devices of different sizes via Media Queries, JavaScript, etc.

14. All formatting must be done with CSS.

15. All layout, must be done with CSS.

16. Links must be created a styled list of unordered items or a styled definition list.

17. Must have at least 1 DIV that has been floated

18. Must use the clear property at least 1 time

19. Must use box model properties (border, margin, padding, etc.)

20. Must use multiple CSS selector (IDs, classes, etc.)

21. Must use background, image, table, and text css properties.

JavaScript Requirements or HTML5/CSS3

22. Must have at least 1 set of buttons that uses JavaScript to do rollovers OR use HTML5/CSS3 hover to do a rollover.

23. Must use JavaScript to check the fields in a form are not blank OR use HTML5/CSS3 to make sure the form fields are not left blank.

Hosting Requirement

24. Must be set-up and hosted on a LAMP or LEMP commercial VPS.

25. Must implement HTTPS

26. Must have properly configured domain name and DNS

C. Deliverables:

To turn-in your final project, (1) create a zip file with the structure below. Note that your zip file should be named [YourLastName] My project 1 would be named In addition, you should upload your project to your server.

Structure of the zip file:


/Documents/[YourPreproduction.pdf]           (This is the file that you created for your pre-production)



/WWW/CSS/[Your CSS files]

/WWW/JS/[Your JavaScript files]

D. Grading:



100 pts

Technical implementation [See List in Section B] and Debugging

Your ability to implement the technical aspects of this project and debug your project.

25 pts

Just In Time Assignments
These will be assigned as the project progresses. It will include things like (a) setting up your server, (b) writing training documentation, (c) creating pitch videos, (d) etc. Expect these to be assigned throughout the course of the project.

25 pt

Quality Testing and Validating Project

25 pt

Production Documentation

Functional Specification, User Acceptance Test, etc.

25 pt

Client Management

You must fully understand any code that you elect to put into your project well enough to (1) debug your own project, and (2) be able to explain it technical terms when asking for guidance. Failure to do will result in a letter grade drop on the project.