Upon archiving stuff in my old hard drive, I encountered my equally old (circa 2004) template of Project Folder. Over those years in designing websites, I’ve personally developed a system for organizing project files.

Project Folder v1.0

This particular Project Folder was structured as such:

• Project Folder: renamed to the [Project Name]
  • Archive: screenshots, document files, research resources, miscellany
  • HTML: the front-end stuff like HTML, CSS, media assets
  • Source: the source files like Photoshop, Illustrator files
  • Templates: image mock-ups in JPEG, PNG

Fast forward to 2008 – I was at the Chikka office for a Senior UI Designer interview. One of the questions I was asked was how I organized my design and development files or if I did. I proudly discussed Project Folder v1.0 since I developed it myself.

Project Folder v2.0

When I joined the team at Chikka, I learned to use a similar system (which was used by developers) and from what I remember, it was patterned after repositories.

• Project Folder: renamed to the [Project Name]
  • comps: contains wireframes, studies, mock-ups, design artifacts, and any file ready to be sent out for approval
  • docs: contains documents from product developers such as Business Rules, Use Cases, screenshots, pegs, font files
  • dev: contains HTML/CSS/JS files
    • branches: contains the temporary/experimental development files
    • trunk: contains the latest version of the development files
  • raw: contains the source files of artworks, graphics (PSD, AI, PNG)

This approach was way better and more appropriate in a web development setting so I also adapted it to my freelance work.

Shortly after, mobile became a “thing”. Suddenly, from a couple of platforms, Pandora’s box was wide open. Our team needed to adapt – first, in the file management level.

Project Folder v3.0

The significant change I made was simply an addition of another folder to categorize the platform type the project fell under. For example:

• Project Folder
  • Android
    • comps
    • docs
    • dev
    • raw
  • iPhone
  • Web

For you designers and developers out there, do you have a similar approach? How does your file management system vary from project to project?