Final Project Wireframes

Final Project

So sorry for the delay, but here is the link to my final project:

CIS 303 Referral Center
You can check it out with
email: test@test.com
password: test

This site is still very much under development.
I've put in a lot of time, but in the end its going to be a pretty big venture.
The main idea is for it to be an online referral system for behavior issues in my school. My principal saw something similar on another website, and asked me to try and produce it for us.

Right now, only a few options are available.
1) The main page (this is the admin main) has a drop down where new/pending referrals can be viewed. JQuery was used for the drop down effect.
2) Users and Students can be added, though editing has not been set up yet. I created the highlight and select script using JQuery, eventually these will cause the form on the right to fill in with that users data, allowing for updating and editing. I am also looking to put in a bulk import for adding students.
3) New Referrals can be written and the referral history can be viewed. I used the JQuery UI Calendar widget to be able to have the calendar pop up when selecting a date.

Things I still need to do:
1) Allow for consequences to be assigned for referrals.
2) Make it look a whole lot prettier.
3) Editing functions
4) Create the teacher page, where teachers can write referrals and view student histories.
5) Code all the error messages, I probably should have put these in while coding, but I was a little shortsighted and wanted to make sure everything was working.

Wireframes and Information flows to follow.

Final Project Wireframes

Here are some very bare bones preliminary wire frames for my final project. My end goal is to create an online student information database for teachers. A large part of my current job is processing data and making it accessible for teachers, my hope is that this site will accomplish both of these things.

The main page of the website will mainly be a log-in point.
It will also have product information for people who do not already have accounts. This will include a screen cast demo of the site,
for schools interested in using this resource.









Class Roster Page
I still need to layout some of the pages in between the login and this one. However this section is what I'm most interested in accomplishing at this point. This page will be a class roster page, which will include the students ID#, Name, Age and gender.
This will mainly be a way to get a quick view of the students in the class, as well as a waypoint towards more specific student information. By clicking on the student id# or name, the user will be sent to the students card, which contains all of their important information. I may also try to include some more academic information, likely via tabs, for this roster overview. As for now though, I'd like it to be mainly a waypoint.


Student Info Card
The main idea here was to basically create something of a baseball card for each student. This would be an example of what this card would look like. Basic information is displayed around a tabbed container. This tabbed container will display subject specific information. This information will eventually be inputted by the students teacher. For most classes, the collection of this data is something that we already have set up in the school. I will have to create an interface for teachers to upload this to the site.

Class 9 Assignment

Heres the link to my finished class 9 assignment.
The Blog has functioning comments, loaded through AJAX. It's also got some cool fade in and slide animations courtesy of JQuery.

The Blogosphere:

Blog Homework

Here is my blogging website


The main page looks like this:



I put in a right nav which allows for a couple of different options.
1) People can navigate through and look at any previous posts. Clicking on that link opens just that individual post in the main window
2) People can look at only their own posts by clicking on the view MY posts button.
3) Not in the right nav, but by clicking on any of the usernames, people can look at posts from just that user.

Image Upload Site

Here it is.

The site is pretty much up and running, though pretty bare bones in terms of appearance. I'm gonna work on making it look a little prettier before Saturday.

I played around with some Javascript to add some more functionality.
You can look at only your own pictures, or all the pictures on the site. I pretty much used the same hide/show stuff we did for the class 6 assignment.

I also put a logout and welcome on the top.

Class 6 Homework

Here are my two files for the class 6 homework:

Class 6 Homework

Class 6 Advanced

They look exactly the same, but I guess thats the point.

The second link loads the information from a tab-delimitated text file.

Here's the code I used to load the info from a document:


I struggled and eventually had to just manually tell the code how many entries to put in. I probably could use for each or loops of some sort to be able to populate the array better, but I got tired and just wanted to make sure it could work at all.