Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

Design

Malorie E Souser
Malorie E Souser
7,503 Points

Why use photoshop when CSS3 is so dynamic?

I've noticed that many people are asking this question (on various web forums) and I wanted to get the Treehouse Community's opinion on the matter.

CSS3 can do a lot more than it's previous iterations, such as gradients and curved edges, so why use photoshop beyond creating a logo or content?

I've read that in the past designers/developers have used photoshop to create mockups of sites for clients, and then tried to recreate them using CSS however there were still differences. These differences would lead clients to ask "why doesn't the end result look like the mock up?"

Any insights into this would be greatly appreciated.

Thanks for your time.

3 Answers

Hi Malorie,

You have an intriguing question, CSS3 has improve a lot throughout the years. Unfortunately with all the new features added and adjusted everyday CSS3 can only be render properly on newer browsers. Thus some clients and their audience might have incompatible browser support making the website not render properly.

Photoshop and Sketch are great tools to visualize your concepts faster. Specially when talking to a client, they might have random changes which you can do quickly if you know the programs pretty well. Dealing with adjusting code at this initial stage can be time consuming. You would have to setup various repositories for the different adjustments which can lead you to look through the same code multiple times making your risk of mistakes higher. Clients usually want fast and efficient in order to achieve this goal you have to develop a plan before you develop a website.

This is a brief explanation on how I view the process. First, you wouldn't built a house with just an idea in your head. You would first get the blueprints ready and approve before building the house. This step would be the wireframe stage for me which will lay the content in a simple form. After the blueprints of the house have been approve the color and design phase are next. This is the second step for photoshop comps to show color, character and dynamics of the layout. Once everything is approve, it can start coming together building and adding character to the house. This is the last phase developing the website and testing it making sure you convey the story that your client wants to share with their target audience.

You mention that some people have gotten the opposite of what was design in photoshop. I feel that the steps that I have share could narrow down the drastic difference between the comps and the website that has been develop. You always want to set your self up for success, and never the opposite.

Best

jason chan
jason chan
31,009 Points

Photoshop is for color correction, coloring pictures, compositing, fixing images, liquify tool. Actually photoshop is very good tool. It also straightens out pictures. It also makes pictures smaller like smaller jpg format.

You can do that all in javascript, but thats like 1000lines of code or even more.

It makes pictures from blah to beautiful. Been doing photoshop more than 5 years.

So photoshop is for photography basically. Before that photographers would use the old school development methods and filters that would take hours for shots to develop. Now since it's all digital is all layers and filter techniques.

Malorie E Souser
Malorie E Souser
7,503 Points

Thank you both for your answers. They have really shed some light on the whole matter for me.