HeaderSIS.jpg

Difference between revisions of "IS480 Team wiki: 2011T1 Aperture - Midterm Wiki"

From IS480
Jump to navigation Jump to search
Line 409: Line 409:
 
Being a Project Manager, I realized that I tend to get caught up with the individual tasks, forgetting about the big picture. This caused the team to progress slowly as the schedule had tasks omitted. On hindsight, we could have better allocated our roles. I was the main person in charge of learning Angular JS. But it was difficult to juggle between coding and managing the team's schedule, and I ended up neglecting the schedule.  <br><br>
 
Being a Project Manager, I realized that I tend to get caught up with the individual tasks, forgetting about the big picture. This caused the team to progress slowly as the schedule had tasks omitted. On hindsight, we could have better allocated our roles. I was the main person in charge of learning Angular JS. But it was difficult to juggle between coding and managing the team's schedule, and I ended up neglecting the schedule.  <br><br>
 
Nonetheless, I enjoy the challenge of being a Project Manager. The lessons I learn here would be invaluable to my future career. Completing all the additional features would be a huge achievement I am looking forward to, given the difficulties and mistakes we have made. I am grateful to our supervisor and client, Chris Boesch, for his patience and time dedicated to teaching and nurturing our team.
 
Nonetheless, I enjoy the challenge of being a Project Manager. The lessons I learn here would be invaluable to my future career. Completing all the additional features would be a huge achievement I am looking forward to, given the difficulties and mistakes we have made. I am grateful to our supervisor and client, Chris Boesch, for his patience and time dedicated to teaching and nurturing our team.
 +
</div>
 
</div>
 
</div>
  
Line 415: Line 416:
 
===<span style="color: #797979; padding: 0px 30px 0px 29px;">Robert Chai</span>===
 
===<span style="color: #797979; padding: 0px 30px 0px 29px;">Robert Chai</span>===
 
<div style="border-left: #797979 solid 12px; padding: 0px 30px 0px 18px; font-family: Arial, Helvetica;">
 
<div style="border-left: #797979 solid 12px; padding: 0px 30px 0px 18px; font-family: Arial, Helvetica;">
You may include individual reflection if that make sense at this point. The team is uncooperative and did not follow my instructions.  
+
Handling all the UI views and design aspects of the project, I'm extremely excited at being given lots of freedom to experiment on designs that are functional and meaningful to the users and the audience who are keeping tabs on our wiki pages and web development. Much to being a perfectionist in the work I produce, I learnt that there were many-a-times where I have to learn to negotiate, accept or let go of certain design concepts or aspirations, in hopes of creating a better team product for our client.
 +
<br /><br />
 +
Despite the challenges we constantly faced, especially in terms of time and expertise, I think we were all very thankful to have chanced upon great innovative technologies, such as AngularJS and Pivotal Tracker, which has radically changed how efficient we produce code and see great improvements in syncing work within a dynamic team setting! Looking back at the harsh start that we all been through for the first two-and-a-half months, trying to understand the these technologies through constant failures and trial-and-errors, I guess being empowered with the new knowledge and skills, I think it was all well worth it, as we are being able to push through constantly towards the deadline; a matter that we assumed almost impossible close to two months ago.
 +
<br /><br />
 +
I'm excited by what good our project can bring to our society and can't wait to keep pushing our best to ensure that it'll all work out at the end! =)
 +
</div>
 
</div>
 
</div>
  
Line 422: Line 428:
 
<div style="border-left: #797979 solid 12px; padding: 0px 30px 0px 18px; font-family: Arial, Helvetica;">
 
<div style="border-left: #797979 solid 12px; padding: 0px 30px 0px 18px; font-family: Arial, Helvetica;">
 
You may include individual reflection if that make sense at this point. The team is uncooperative and did not follow my instructions.  
 
You may include individual reflection if that make sense at this point. The team is uncooperative and did not follow my instructions.  
 +
</div>
 
</div>
 
</div>
  
Line 428: Line 435:
 
<div style="border-left: #797979 solid 12px; padding: 0px 30px 0px 18px; font-family: Arial, Helvetica;">
 
<div style="border-left: #797979 solid 12px; padding: 0px 30px 0px 18px; font-family: Arial, Helvetica;">
 
As the Lead Developer, I get to spend time looking at the big picture of the application, and how is everything going to come together. My greatest takeaway so far has got to be learning this new way of designing an application thanks to AngularJS. Every web project I've been part of so far involves an application built on a single platform, but this is the first time I've got to do one that involves two almost independent platforms talking to each other just through REST! I've got to discover the strength of AngularJS, the benefits it brings to the user and to the server in terms of load, as well as how it can make a development team become more efficient as well. That, in itself, has been a very valuable takeaway. As the lead developer, I'm very proud of what our team has accomplished so far.
 
As the Lead Developer, I get to spend time looking at the big picture of the application, and how is everything going to come together. My greatest takeaway so far has got to be learning this new way of designing an application thanks to AngularJS. Every web project I've been part of so far involves an application built on a single platform, but this is the first time I've got to do one that involves two almost independent platforms talking to each other just through REST! I've got to discover the strength of AngularJS, the benefits it brings to the user and to the server in terms of load, as well as how it can make a development team become more efficient as well. That, in itself, has been a very valuable takeaway. As the lead developer, I'm very proud of what our team has accomplished so far.
 +
</div>
 
</div>
 
</div>
  
Line 435: Line 443:
 
<div style="border-left: #797979 solid 12px; padding: 0px 30px 0px 18px; font-family: Arial, Helvetica;">
 
<div style="border-left: #797979 solid 12px; padding: 0px 30px 0px 18px; font-family: Arial, Helvetica;">
 
You may include individual reflection if that make sense at this point. The team is uncooperative and did not follow my instructions.  
 
You may include individual reflection if that make sense at this point. The team is uncooperative and did not follow my instructions.  
 +
</div>
 
</div>
 
</div>

Revision as of 01:42, 26 September 2011

Pivotalexpert2-aperture-midtermwiki-header-v02-700px.jpg





Project Progress Summary

Progress Description

Our team has progressed slowly but steadily since our acceptance. We encountered a major obstacle, which is the creating of a live PayPal account for Pivotal Experts. They required us to have a working live application for them to verify before they allow us to create a live PayPal account. So we had to delay our PayPal task until we can complete the basic functionalities. We are confident of getting 70% of the basic functionality live by midterm. Although this is behind the schedule we planned during proposal, which was caused by the underestimation of the duration and complexity of the tasks, we are confident of completing 70% of the additional features on top of the basic functionalities, by the end of the term.

Project Highlights

  • The previous team's code had quite a few issues. So we had to start building the application from scratch.
  • Client suggested that we explore Angular JS for our front-end views. We divided the team into 2 separate teams. The front-end team would develop the views, while the back-end team developed the models and controllers.
  • PayPal required us to have a live application before allowing us to create a live PayPal account for Pivotal Expert.
  • We met Andy Croll, a talented designer, for his feedback on the design and usability of our website.
  • Project Management
    • The front-end team took 7 weeks to learn Angular JS, which was much longer than expected.
    • We did not account and plan for a number of functionalities when we decided to build the application from scratch. In addition, The difficulties of several tasks were underestimated. In other words, we allocated too few points to tasks. This resulted in an overly-optimistic schedule. Eg. Completing basic functionalities by week 4.


Project Management

Project Status

Function / Features Status Confidence Comments
Pay through PayPal 50% 1 Require PayPal's verification before being able to create a live PayPal account
Login/logout 100% 1 Login using Janrain
View Dashboard 80% 1 Modified the design by creating tabs for news feed and project management. Client has requested that the user is able to see the amount earned or spent in Pivotal Expert
Edit Profile 100% 1 Some fields such as school and country which require verification will be completed in later use cases
Create/Edit Project 90% 1 Edit project function still in progress
View Projects 100% 1 Pagination will be in a separate use case
View Project Bids 100% 1
Create Bid 100% 1
View Workroom 100% 1 Complex view which took Robert some time to design
Write on Project Wall 100% 1 Kenneth is suggesting that new messages will be appended at the bottom instead of appearing at the top
Feedback through Get Satisfaction 100% 1 Feedback will be sent to getsatisfaction.com, instead of being stored in Pivotal Experts
Send Messages 70% 1 Functionality is nearly completed. A link will be placed near the logout link.
Accept Bid 90% 1 A message needs to be displayed to inform user that it is only the first iteration that he is paying for.
Accept/Reject Deliverable 90% 1 Will temporarily use the PayPal sandbox account for testing purposes until PayPal grants us a live account
Post Comments in Workroom 100% 1
Edit Iteration Plan 0% 1
Change Iteration Status 0% 1
Change Iteration Order 0% 1
Pagination 0% 1
Form Validation 0% 1
Search for Project 0% 1
Email Verification 0% 1
Sort/Filter Projects 0% 1
Sort/Filter Developers 0% 1
Negotiate Pay Raise 0% 1
Integrate Singpath Badges 0% 0.8
Share Project through Social Networks 0% 1
View Google Analytics 0% 1
Submit/View Return On Time 0% 1
View Pivotal Expert Analytics 0% 1
View Advertising Recommendations 0% 0.6
Suggest Schools 0% 0.9
Suggest Badges 0% 0.9
Upload documents 0% 0.9
Identify Location 0% 0.8
Compare Locations 0% 0.8

Project Schedule (Planned vs Actual)

Planned Project Schedule

LINK Planned Project Schedule Page
3.. Project Management
3.1.. Planned Project Schedule
3.1.1.. Planned Project Timeline
3.1.2.. Planned Project Iteration Breakdown

Actual Project Schedule

LINK Project Management - Actual Schedule Page
3.. Project Management
3.2.. Actual Project Schedule
3.2.1.. Actual Project Iteration Breakdown

Project Metrics

Summary of analysis for the metrics collected. You may refer to another page for the details about the metrics and how it is collected.

Project Risks

Risk Analysis

LINK Project Inception Phase Page
3.. Progress Summary
3.4.. Risk Management
3.4.1.. Risk Analysis - Project Inception Phase
LINK Project Elaboration Phase Page
3.. Progress Summary
3.4.. Risk Management
3.4.2.. Risk Analysis - Project Elaboration Phase
LINK Project Construction Phase Page
3.. Progress Summary
3.4.. Risk Management
3.4.3.. Risk Analysis - Project Construction Phase

Technical Complexity

  • Utilizing two different programming platforms - AngularJS (on HTML, Javascript and CSS) for the views, and Python for the models and controllers. Many of us did not have any background in either of the platforms, and it took us a while to understand the basics. As most of us were interning as developers during the summer holidays, our learning progress was slow as we had other programming languages to learn during that time as well.
  • AngularJS, a new cutting-edge Javascript framework currently being developed made the learning curve steeper. Their documentation is not entirely completed and it is difficult to find solutions to problems online, as the Angular Community is still small. We had to post our questions on the Angular discussions in Google Groups. Building an application using AngularJS also broke many web-development norms: With AngularJS, the entire application could be designed to hardly rely on an application server. This means that the front-end developers and designers must begin thinking about things like routing controllers, something that traditionally was dependent on an application server.
  • Implementing PayPal payments required us to not only understand the PayPal API, but required us to get clearance from PayPal before being able to use it in our application. Since this API was going to involve money, getting that clearance was not as simple as just filling out a form. Also, the payment process we're using is the delayed-chain-payment, which is not a common type of PayPal transaction.
  • Developing an application that uses mainly REST was challenging. Although we were taught about the REST architecture in our previous module, we had no experience developing an entire application that relies on REST. We also had to learn to design JSON responses, not just how to create the responses from the back-end, but also how to take the data from the response and use it on the front-end. We also had to learn how to write a REST server on Google App Engine.
  • Figuring out how to deal with sessions was also a complicated process due to the following:
    • We were using a third-party service, Janrain, to handle log-ins. This means our system had to be able to retrieve a key from Janrain, then generate user instances and sessions.
    • We had to be able to tell the front-end AngularJS application, which does not rely on the back-end application in any way apart from REST responses and requests, about these sessions.
    • We had to find a way to ensure that people weren't able to abuse the site by sending their own REST responses and requests to our Python back-end.

Quality of Product

Quality Achieved

We've achieved a very unique design with this application. The application itself has two major components. The front-end component is written entirely upon the AngularJS framework, a Javascript framework that allows the use of the MVC concept on nothing other than HTML, CSS and Javascript, while the back-end component is written entirely on Python, and provides a REST server for the front-end Angular component to get and put data.

The Front-End's responsibility is to control the different views a user can access depending on the URL, and controls how the data is presented to the user. It's architecture is designed to have its own MVC component. The views are essentially a whole set of HTML templates, while the controllers are a set of JavaScript functions that route the templates and data based on the URL, and the data retrieved from the Python server. The Models are objects created from the JSON responses received from the Python server which the front-end controllers and views can use to decide where to route, and to display.

We have also designed the front-end component to run entirely off a single HTML file, using our AngularJS controllers to dynamically change portions of this HTML file. This means that the entire website loads almost just once. Except on a few occasions, the user is capable of navigating through the application without ever seeing the page reload. This also means many components such as the JavaScript files and the CSS stylesheets only have to be downloaded by the browser once. This results in a significantly snappier performance for the user, as well as reduced bandwidth costs for our client.

The Back-End's responsibility is to control the business logic of the application. It too has been elegantly redesigned to be easily maintainable and extendable. The back-end's architecture includes it's own Models and Controllers. Our Models are Google App Engine Datastore Objects. We have four main controllers. The first is a RESTful controller that provides all the REST actions that the front-end is capable of calling to retrieve data. The second is a POST controller that provides the REST actions that the front-end submits data to. The third is a Janrain controller that controls the log-ins as well as the sessions. And finally, we have a PayPal controller that communicates with PayPal during payment actions.

This architecture has helped us achieve the ability to very neatly see where data flows out from and where data will flow into. This helps the front-end AngularJS team be able to introduce new sections onto the application concurrently with the back-end Python team.

In terms of the deliverable to the client, besides successfully rebuilding the application on AngularJS, we have also completely redesigned the look and feel of the application with a much more pleasant colour scheme and a much more logical UI. We've also introduced the Dashboard, a functionality that brings together all of the user's activities in a single place to allow the user to quickly view all his workrooms, projects, bids and messages. This dashboard did not exist in the original application. The new design also makes it easy for new users to know where to start, while providing frequent users with a design that let's them jump to their work quickly from anywhere in the application. At the same time, the way projects and bids work has been completely changed by the request of the client, and these changes are reflected in the application's new business logic.

Intermediate Deliverables

There should be some evidence of work in progress.

S/N Stage Specification Modules
1. Project Management Minutes <<minutes repository>>
Metrics <<Velocity metrics>>, <<Bug metrics>>
2. Requirements List of functionalities <<priority list>>
3. Analysis Use case <<Use Case Diagram>>, <<Use Case Description>>
4. Testing UAT test plan In Progress


Not all parts of the deliverables are necessary but the evidence should be convincing of the progress. Try to include design deliverables that shows the quality of your project.

Deployment

Pivotal Expert is hosted on Google App Engine. As such, the deployment process is simplified significantly. For our development and testing, we've set up a development server online at dev.pivotalexpert.com. This development server allows everyone including our client and our UAT users to access it from the Internet at any point of time.

Our deployment process begins with the lead developer pulling the latest code from both the Front-end as well as the Back-end GitHub repository. Because of the way the application has been designed, integration is as simple as copying a single folder from the front-end code into the back-end code. This back-end code is then tested locally. Once all the tests are complete, the code is then deployed through the Google App Engine Launcher, ready to be tested by everyone online.

At this point, anyone can access our development server using their Facebook and Google account at dev.pivotalexpert.com.

Testing

Describe the testing done on your system. For example, the number of UAT, tester profile, test cases, survey results, issue tracker, bug reports, etc.

Reflection

Mark Chen

Being a Project Manager, I realized that I tend to get caught up with the individual tasks, forgetting about the big picture. This caused the team to progress slowly as the schedule had tasks omitted. On hindsight, we could have better allocated our roles. I was the main person in charge of learning Angular JS. But it was difficult to juggle between coding and managing the team's schedule, and I ended up neglecting the schedule.

Nonetheless, I enjoy the challenge of being a Project Manager. The lessons I learn here would be invaluable to my future career. Completing all the additional features would be a huge achievement I am looking forward to, given the difficulties and mistakes we have made. I am grateful to our supervisor and client, Chris Boesch, for his patience and time dedicated to teaching and nurturing our team.

Robert Chai

Handling all the UI views and design aspects of the project, I'm extremely excited at being given lots of freedom to experiment on designs that are functional and meaningful to the users and the audience who are keeping tabs on our wiki pages and web development. Much to being a perfectionist in the work I produce, I learnt that there were many-a-times where I have to learn to negotiate, accept or let go of certain design concepts or aspirations, in hopes of creating a better team product for our client.

Despite the challenges we constantly faced, especially in terms of time and expertise, I think we were all very thankful to have chanced upon great innovative technologies, such as AngularJS and Pivotal Tracker, which has radically changed how efficient we produce code and see great improvements in syncing work within a dynamic team setting! Looking back at the harsh start that we all been through for the first two-and-a-half months, trying to understand the these technologies through constant failures and trial-and-errors, I guess being empowered with the new knowledge and skills, I think it was all well worth it, as we are being able to push through constantly towards the deadline; a matter that we assumed almost impossible close to two months ago.

I'm excited by what good our project can bring to our society and can't wait to keep pushing our best to ensure that it'll all work out at the end! =)

Kenneth Kok

You may include individual reflection if that make sense at this point. The team is uncooperative and did not follow my instructions.

Daniel Tsou

As the Lead Developer, I get to spend time looking at the big picture of the application, and how is everything going to come together. My greatest takeaway so far has got to be learning this new way of designing an application thanks to AngularJS. Every web project I've been part of so far involves an application built on a single platform, but this is the first time I've got to do one that involves two almost independent platforms talking to each other just through REST! I've got to discover the strength of AngularJS, the benefits it brings to the user and to the server in terms of load, as well as how it can make a development team become more efficient as well. That, in itself, has been a very valuable takeaway. As the lead developer, I'm very proud of what our team has accomplished so far.

Raymond Chua

You may include individual reflection if that make sense at this point. The team is uncooperative and did not follow my instructions.