We are ready to start a new project, project parameters are set, and stakeholder roles are in place. I usually follow the outline below when I start a new project. I’m not saying this is the only way to organize a web project or the gospel according to Matt, but it’s the way I organize my web design projects and works for me.
In the first phase of the development process, we call the “discovery phase” I will start a “New Project” folder; I like to use google drive and a staging server, obviously you can use SugarSync, Dropbox, your own server- whatever you like. My new project folder structure looks like this:
- New Project
- This folder will hold my information regarding the project.
- This folder and its subfolders will house all of our non-public files, logos, artwork like raw photoshop files.
- Ooh, la, la, the design playground.
- Content Audit
- Inventory and ranking of existing content.
- Content Deck
- This folder is the actual content for the new website – a document for each page of the actual site. Copy and images will be placed here for the live site. I’ve found giving clients access to this folder and allowing them to add or view their content helps move the project forward.
- This will house all of the information from the Discovery Phase; each folder will house questions, methods, links and tools I may use to craft the user experience. Over the years I have accumulated a large toolbox for solving problems, I’ve gathered a lot of good questions that help in the design process and a book that I really like on different methods for different stages of the design process is Universal Methods of Design: 100 Ways to Research Complex Problems. It doesn’t go into much detail but provides a good overview of methods and the links in the book lead to some great information.
My typical Discovery folder has the following sub folders…
- Accessibility Discovery
- Audience Discovery
- Brand Discovery
- SEO Discovery
- Speed Discovery
- Usability Discovery
- If I don’t have definite data, I’ll try to sketch a user profile as close as I can.
- Usually clickable interfaces derived from the wireframes.
- Style Guide
- This is where we will define our styles for maintaining the live site.
- User Flows
- You can lead a user to the content, but you can’t make them click. However, we will try our best to persuade them.
- This is the skeleton of our website.
- All the public web files, the actual website.
- System Files
- Any files that need to be accessed from the web but I would like to keep out of the public view, like include files, database info.