CSC301 – Introduction to Software Engineering

Project Overview
This course is an introduction to agile development methods, appropriate for medium sized teams and rapidly moving projects. Basic software development infrastructure; requirements elicitation and tracking; estimation and prioritization; teamwork skills; basic UML; design patterns and refactoring; security, discussion of ethical issues and professional responsibility.

Technologies used
In this course, Subversion was an important tool for version control and checking out code. Javascript was the scripting language used in this course. Dr Project was the project management system. In addition, JSCoverage gave code coverage, while Firebug was the primary debugging tool and JSUnit was a valuable testing tool.

Responsibilities and Roles
I worked with three of my CS peers (who were picked at random by the professor) as a group. My responsibilities were mainly helping my other group members write the Javascript code for this project.
I was the primary coder for the final design.

Project Details
Goal: The goal of this course is to develop a family tree viewer using Javascript that runs on Mozilla’s canvas element. There are no restrictions to what external libraries we use as long as we credit all the owners of those libraries.

Stage two – writing a GUI toolkit library

Our family tree viewer in stage two
Our family tree viewer in stage two

Since stage one of our viewer was just making up the personas, user stories and basic GUI framework, stage two is where we started implementing things by writing out the code to draw the nodes. We have a test family here, showing the basic relationships of marriage and having kids. We have males and females as distinct colors.

Showing pan,zoom,drag and mini-canvas
Showing pan,zoom,drag and mini-canvas

Here we show the functionality we implemented, being able to drag nodes around, pan around the canvas, using the zoom buttons and having the mini-map mimic our actions. This functionality provides for a more smoother, Web 2.0-like feel ala Google Maps. The user can drag nodes freely and the max zoom distance is capped so that the user cannot zoom too far in.

Stage three – testing, debugging and reading from external file

Showing a blank canvas initially
Showing a blank canvas initially

Here is where our layout develops. We read from an external JS file which allows us to populate our objects. After the user searches for a person, the function will automatically draw the nodes and relationships closest to that person. We intend to have a function to add nodes to the external file so that the family tree can grow as the user adds more members.

Showing our test suite
Showing our test suite

We test our layout functions with a variety of test suites to make sure our algorithm and design patterns passes each test. Each test suite is located inside its own external js file. Each other team in the course also submits their own test case which we use to make sure that almost all situations can be covered.

Final stage- Impressing the Professor
The final stage involved swapping code with other teams and having to design a final family tree viewer application to impress the professor. In the end, we decided to have the layout be more Web 2.0-like with simple and intuitive controls.

Layout and Legend with search, zoom/pan and tree selection

The features we decided to have were adding family members, searching for family members, storing and selecting different trees, zoom/pan controls, photo support and information editing support.

Controls with info pane, photo pane and add member panes

Github Repo


9 responses to “CSC301 – Introduction to Software Engineering”

  1. new mexico golf lessons Avatar

    My relatives every time say that I am killing my time here at
    web, however I know I am getting familiarity daily by reading such pleasant content.

  2. Avatar

    wonderful points altogether, you just received a new
    reader. What would you suggest in regards to your put
    up that you simply made a few days in the past?
    Any positive?

  3. Sushi Bar Avatar

    Hello there, just became alert to your blog through Google, and found that it is really informative.
    I am going to watch out for brussels. I will be grateful if you continue this
    in future. Lots of people will be benefited from your writing.

  4. Avatar

    My developer is trying to persuade me to move to .net from PHP.
    I have always disliked the idea because of the costs.

    But he’s tryiong none the less. I’ve been using WordPress on various websites for about a year and am concerned about switching to another platform.

    I have heard great things about Is there a way I can transfer
    all my wordpress posts into it? Any help would be really appreciated!

  5. Avatar

    If you find a consultant that’s affiliated with one or only a couple merchant service providers, or if one provider compensates them significantly more than others, there’s a good chance that they’ll be biased. There are different ways to set up this kind of service. Always look for buyer referrals, buzz about the merchant on blogs, forums, business newsletters and publications.

  6. Avatar

    I do not know if it’s just me or if perhaps everybody else experiencing issues with your website. It appears like some of the written text within your content are running off the screen. Can someone else please comment and let me know if this is happening to them as well? This may be a issue with my browser because I’ve
    had this happen before. Kudos

  7. 24 hr appliance repairs Avatar

    Heya administrator, I just wanted to give you a quick heads up that your Website link: http://www. is being flagged as a potentially malicious blog in my browser firefox.
    I would highly recommend having someone look into
    it. You could very well lose a lot of readers due to this
    problem. Very best of Luck.

  8. Erik Avatar

    Have you ever considered writing an ebook or guest authoring on other websites?
    I have a blog based upon on the same information
    you discuss and would really like to have you share some stories/information.
    I know my readers would enjoy your work. If you are even remotely interested, feel free to shoot me
    an email.

  9. gaming motherboards 2014 Avatar

    A hoover is the most effective of cleansing tools; it can also be the higher-priced.

    You will find various kinds of hoover with several different characteristics.
    So before you buy a top rated vacuum-cleaner be sure you know what type of vacuum
    is best on your needs.

    Determing the best vacuum-cleaner might be confusing.
    To simply help make issues clearer you should know what
    the different types of hoover are, what the main qualities
    you’re able to find on a vacuum cleaner, and need you variety of floors you’re going to be
    utilizing a vacuum cleaner on.

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.