May 7, 2009

Managing a web development project

There are many types of websites, as well as sizes and complexity. At the beginning, most of my creations were constructed ‘on the fly’, without much planning – in the end, a ‘news’ module is not scary enough to need a project.

But recently I’ve started working on more ambitious jobs (like http://climaps.com), and feeling the need of a strongly defined method to apply to web applications design. Some tools are almost mandatory, like Use Case Diagrams which become really helpful in order to translate what every user can do into ACL‘s, methods, controllers, etc; or like modeling tools to graphically represent the application’s database.

But the best way – according to my experience – to successfully manage a web project is following a detailed planning. Determining what the steps are and what order should they be executed in, is a good starting point to know were exactly we are on each development stage.

Thus, I want to clarify that I’m not talking about software, applications or techniques to effectively manage big web projects; I don’t have this experience to talk about. Instead, I’m referring to the main steps I’ve followed in the past to handle the web projects I’ve worked on, steps which have proved to be effective. This article does not describe a rule but a personal way of doing things, and I’ll be glad to know your thoughts about it. What tools do you use to build your websites? Comments are welcome 🙂

The following diagram shows an overview of the entire process:

Web project management flow

Web project management flow

Chronological steps to follow

  1. Business: Analysis of requirements
  2. Business: Get data model
  3. Database: Design
    • get to 3FN and study going beyond
  4. Database: Implementation
    • select a database engine
    • determine storage engine
    • develop triggers, views, and additional features
    • develop maintenance and backup scripts
  5. Database: Life time (*)
    • design plan for durability
    • implement and estimate performance
    • develop triggers, views, and additional features
    • design libraries to make it transparent for the application
  6. Application: Use Case Diagrams
    • represent different user profiles
    • review with client
  7. PHP: Develop initial system (*)
    • choose a framework
    • set up initial libraries and systems
    • design template’s system
    • unitary tests system
  8. PHP: Core develop for all functionalities
    • programming all functions needed for cases of use
    • generation of a initial HTML view
  9. PHP: Tests and bug fixing
    • use unitary tests
    • use functional tests
  10. HTML: Finish structure
    • use semantic code
    • define attributes for accessibility
    • run Hera, eXaminator, w3c and other tools and make adjustments
  11. CSS: Definition (*)
    • design a CSS files structured system
    • start filling with some initial design
    • run W3C CSS test
  12. Design: External outsource (*)
    • slice design in usable blocks
    • apply design through HTML images and CSS
  13. Standards compliance: Tests and adjustments
    • multi platform: check browsers compliance: check IE, Firefox, safari
    • run again W3C tests for HTML and CSS
    • run again Hera, eXaminator and other accessibility checks
    • layout adjustments
  14. Ajax: Analysis of requirements
    • cases of use diagram, with different user profiles
    • determine functionalities to be available
  15. Ajax: Setting up (*)
    • determining a framework to work with
    • establishing folder distribution
    • determine unitary and functional tests systems
  16. Ajax: Implementation
    • develop all functionalities
    • add necessary PHP back ends in XML / HTML format
  17. Ajax: Test
    • apply test cases
    • make adjustments
  18. Summary: Final review
    • presentation of website to client
    • getting feedback
    • taking notes for a new wheel’s spin

Note: sections marked with (*) can be avoided when adding new modules to a previously developed application.