I market myself as a Freelance .NET Developer specializing in Community Server, but sometimes you wouldn’t know it by the amount of time I spend in Photoshop. Photoshop chops are very valuable for freelancers like myself who need to do it all for our clients. Quite honestly, I’d be quite happy to stay in Visual Studio all day long, but I can’t do my work without keeping Photoshop constantly open for one task or another.
In thinking about a presentation topic for New England Code Camp 8, the Photoshop-based .NET work I did yesterday has stuck in my head as a valuable aid for .NET developers to facilitate agile development. With strong Photoshop skills, not only web pages can be quickly presented and client approved, but business processes can be formulated as well. This is what I’ll be demonstrating at Code Camp 8 in “Photoshop Chops for Agile .NET Development” using real project specs and phased submissions of a single Photoshop image.
Below is an example of how Photoshop designs and feedback from a client over the course of a day saved possibly weeks of hit-and-miss development. The Community Server-based Business Application I’ve been building has moved to Time Management, so using a project description outline from my client I started laying out pages in Photoshop, working within Community Server’s native functionality to meet those specs. Remember, the images are entirely Photoshop mockups extracted from a single layered image, but they will look exactly like the final product.
The first task is creating a job-specific submenu to various management functions for that project. (I’ll be blogging on how to do this for real in Chameleon soon.) But for now, lets whip up the job management submenu.
Okay, I like the submenu. Now, the Time Management piece for that job should be in a tabbed area by day of the week, with the selected day highlighted. Each day should appear in a tab, with employees entering their time as well as project managers being able to enter time for staff. How are we going to support editing, deleting and adding new records?
What’s the entry form going to look like?
Well, I like the Community Server modal windows architecture. Let’s see what the client thinks.
Nope, I don’t like that. I want it all inline. Oh, and everyone assigned to the project for that day will be displayed in the grid. So I’d like to see how multiple staff will be handled.
We can do that with a new Photoshop Layer Set, adding four or five new users and show how the inline edit and new item forms will display (like the CS Censorship Page in functionality.) Got it.
Great! Now we need one more thing, a weekly summary report. It needs to be printable and should include only that week’s summary for the individual employee.
Perfect. Why isn’t the background dark like before?
That’s because you stipulated in the project description that users will want to print the weekly summary. We’re going to be opening a new browser window instead of the modal window as we did before. Printing contents of a modal window is ugly and we don’t want to go there.
Okay, that’s everything! Build it!
In the Code Camp 8 session we’ll be covering how to structure Photoshop images that can be reused and easily extended. We’ll also be demonstrating lots of good old fashioned Photoshop tips on layering, transparency, keyboard shortcuts, masking and more.
It will be interesting to see if there’s any interest in this topic at New England Code Camp 8 and if anyone shows up, but I think it’s a valuable topic. Aw heck, I’ll probably get scheduled the same time as a Richard Hale Shaw presentation, so it won’t matter anyway.
See you at Code Camp 8!