PDA

View Full Version : PSD to HTML



jamestl2
07-13-2010, 01:07 PM
I'm curious as to what's involved in the process.

One thing I have to say, is that I don't have any experience working on converting PSD's, however, is the process as easy as it sounds?

It seems like this would be the process, but I'm not 100% sure:

all you do is just look at the PSD
make a copy of the theme
Use Photoshop to slice up the large image into many smaller ones (header, sidebar, etc.)
insert the appropriate number of HTML elements / DIVs to where you sliced up the images
and add the CSS where appropriate

The reason I'm asking is because there seems to be a lot requested help with conversion, but I don't have much experience dealing with this kind of aid, and it sounds like it could be a good way to expand my skills and earn a little from helping people out with it.

mattbeck
07-13-2010, 02:21 PM
It can be that easy, or it can be a lot harder. It really depends on the PSD and the framework you are using.

Generally I'd say you are over-simplifying things a bit.

Slicing it up and matching the layout of the PSD in CSS is part of it.

Often the harder part is where non-web designers have put in heavily styled text content using strange fonts that aren't web-safe and you end up having to do a ton of text-replacement, etc.

Working with PSDs that were created by competent webdesigners is usually pretty easy. Working with PSDs that were created by non-designers or print designers is usually hard.

Big generalizations here though.

jimr451
07-13-2010, 02:25 PM
Hi,

Well, you are right that there's a demand for the work. Usually (in my experience), the designer who builds the PSD also chops it up (into css / html), but I guess some designers don't have those skills. It does take a lot of skill and knowledge to know how to slice up the psd and getting the final HTML to look like the PSD.

If you have strong html / css and graphics skills, it's probably a good fit for you.

-Jim

vangogh
07-14-2010, 03:12 AM
James it really depends on the PSD itself. All you're really trying to do is figure out how to develop a web page that looks like the PSD. I usually look to see what in the PSD will need to be an image and then create those images from the PSD.

I actually wrote a couple of posts on my thought process. The posts are on Onextrapixel.com

Part 1: How to Turn a Design Image Into a Working Web Page (http://www.onextrapixel.com/2010/04/28/part-1-how-to-turn-a-design-image-into-a-working-web-page/)
Part 2: How to Turn a Design Image Into a Working Web Page (http://www.onextrapixel.com/2010/04/29/part-2-how-to-turn-a-design-image-into-a-working-web-page/)

In the post I grabbed a PSD for a free theme and then walked through my thought process for turning it into a working web page. The way I went from PSD to html isn't the only, but seeing my process might give you an understanding of what's involved.

cbscreative
07-14-2010, 12:18 PM
Since you mentioned CSS, that would indicate you're working with a newer version of Photoshop. I've never been a big fan of slicing so I could offer limited help, but I do recall the older versions of PS created awful code. Since it appears you are referring to something newer, that's probably not an issue, but I thought I'd mention it just in case.

If you have Fireworks, it's much better suited to what it sounds like you're trying to do.

wickedpro
08-15-2010, 03:48 PM
I do some PSD to HTML coding for certain clients, and to me it totally depends on the design in the PSD, some designs are very simple and easy to code into XHTML and CSS others are much more complex and take a lot more time. So I would say some can be simple and some can be really difficult depending on the design.

vangogh
08-17-2010, 12:02 AM
Very true. I've coded PSDs that were completely straightforward and easy to turn into working html/css. I've also seen other PSDs that were close to impossible to actually develop as a web page. It's why I think it's good for all designer to understand at least the basics of html and css so they know what's difficult and what's impossible.

Dburn
12-21-2010, 02:56 PM
I agree , Fireworks is where I do slicing and dicing. The generated HTML is pretty decent. Further, you can comp up a multiple page site in Fireworks now with working links between pages. That might be a good step from visual comp stage to see how it works and renders on a web browser. I write Coldfusion, Javascript/Ajax and do some design but try to stay away from it if possible as I have finally realized it's much easier to do one or the other but not be responsible for both. Being a plumber pays better too.

vangogh
12-22-2010, 12:01 PM
Interesting idea to use the Fireworks generated code as a next step after the comp. I think in the end you're always better off hand coding the final site, but no reason you can't use the generated code to have something quick to show the client or just check yourself.

cbscreative
12-22-2010, 02:51 PM
I've often thought about taking advantage of FW ability to create comps this way, but haven't yet made the transition to doing so. Starting with CS3, Adobe made some impressive strides toward "standards compliant" code. I can't comment on the quality of code generated this way having not used it, but I suspect it may very well be better than you would expect. It's not like the old days of the horribly bloated code those programs used to generate.

The newer versions of Dreamweaver have some nice no frills templates which are very useful. They are not what you normally expect with templates. It's "structure only" to provide a well tested foundation. Since the actual structure of a page has very finite options, these templates provide that. There are no graphics or prettiness, but they are standards compliant and well tested. I've found them to be very helpful when building a page with a structure I've not used before.

If FW generates code like that, it would at least provide a good foundation, and maybe even be good to go. Testing it is one of those projects I would like to experiment with. My FW skills are less than ideal because I work primarily in Photoshop.

vangogh
12-23-2010, 12:05 PM
Why do I suspect that those Dreamweaver templates still aren't putting out the best code? Mind posting the code for one of the layouts or pointing to one online. I'm curious what they look like?

cbscreative
12-24-2010, 03:20 PM
When I say no frills, I mean no frills. Here is a sample of the code for a one column page, centered with elastic width, compliant with XHTML Transitional. As you will see, there's no fluff. You need to add the fluff yourself, which is one reason I like these templates.


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<link href="oneColElsCtr.css" rel="stylesheet" type="text/css" />
</head>

<body class="oneColElsCtr">

<div id="container">
<div id="mainContent">
<h1> Main Content </h1>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo porttitor, felis. Nam blandit quam ut lacus. Quisque ornare risus quis ligula. Phasellus tristique purus a augue condimentum adipiscing. Aenean sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at, odio. Donec et ipsum et sapien vehicula nonummy. Suspendisse potenti. Fusce varius urna id quam. Sed neque mi, varius eget, tincidunt nec, suscipit id, libero. In eget purus. Vestibulum ut nisl. Donec eu mi sed turpis feugiat feugiat. Integer turpis arcu, pellentesque eget, cursus et, fermentum ut, sapien. Fusce metus mi, eleifend sollicitudin, molestie id, varius et, nibh. Donec nec libero.</p>
<h2>H2 level heading </h2>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo porttitor, felis. Nam blandit quam ut lacus. Quisque ornare risus quis ligula. Phasellus tristique purus a augue condimentum adipiscing. Aenean sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at, odio.</p>
<!-- end #mainContent --></div>
<!-- end #container --></div>
</body>
</html>


And below is the CSS. It is nicely commented and allows you to easily define all the styles yourself. This is bare bones for sure, but it gives a nice starting point. Yes, all the templates are very minimalist like this. Compared to the old days, I was surprised too. I would have expected bloated code like you did, but these really are nice and lean.


@charset "utf-8";
body {
font: 100% Verdana, Arial, Helvetica, sans-serif;
background: #666666;
margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
padding: 0;
text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
color: #000000;
}
.oneColElsCtr #container {
width: 46em;
background: #FFFFFF;
margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
border: 1px solid #000000;
text-align: left; /* this overrides the text-align: center on the body element. */
}
.oneColElsCtr #mainContent {
padding: 0 20px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
}


Of course, this example would be plenty easy to do on your own, but when you want 2 or 3 columns with header and footer, and floats that don't cause unpredictable behavior when viewed in various browsers, these templates can provide a nice starting point that saves a lot of time. The comments in more complex layouts are helpful to understand why certain code was created to deal with browser issues such as margin collapse.

I'm sure you noticed the font declaration in the CSS. I always eliminate this line and set up my own text behaviors. I do think it's a good strategy that they included this though. For less experienced coders, they might end up with the default Times if that command was not there. One sure sign of a newbie is Times used on web pages.

vangogh
12-27-2010, 10:57 AM
Looks better than it used to be. I'll give them that. I still wouldn't use it myself, but I've been writing code by hand for so long that I don't need any tools writing it for me. As far as creating 2 and 3 column layouts with or without header and footer, it's not exactly hard. I can't remember the last time any layout I developed displayed unpredictable behavior in any browser. If anything they end up being very predictable. I think what happens when people rely on tools like DreamWeaver to produce code they eventually have to rely on the tool to continue to produce code.

cbscreative
12-30-2010, 06:12 PM
Looks better than it used to be. I'll give them that. I still wouldn't use it myself, but I've been writing code by hand for so long that I don't need any tools writing it for me. As far as creating 2 and 3 column layouts with or without header and footer, it's not exactly hard. I can't remember the last time any layout I developed displayed unpredictable behavior in any browser. If anything they end up being very predictable. I think what happens when people rely on tools like DreamWeaver to produce code they eventually have to rely on the tool to continue to produce code.

By unpredictable behavior, I was referring more to the nagging issues that plague people until they learn how to avoid them. Sometimes, a web designer can have these issues without knowing it if they don't do enough testing. Once you know the basics, you're usually good until MS releases a new browser to keep things interesting. I've had a few cases where they solved problems in ways I didn't think of, so the code can be very educational.

Like you, I prefer to write my own code and don't depend on these tools. I've only ever needed to open a particular kind of template once. After that, it's easier to use code from my customized version of it as a starting point and then make the needed changes.

It took until CS3 before I liked DW well enough to work primarily in it. Before that, I used a $20 text editing program more than DW. The newer versions finally allow you to hand code without whacking out the code format if you happen to click in the design pane (I use the design pane mostly just to easily get to the part of the code I want to work on, and work almost exclusively in the code pane).

mmendis
01-02-2011, 10:03 PM
I know that it will not be a complete replacement for a good developer. but i created a web app that takes a psd and converts it based on the layers into unique divs. figures out text and adds that to the html page. Right now it only deals with absolute divs, but hopefully soon will have floats working.

vangogh
01-03-2011, 10:51 AM
If all it does now is use absolute divs then I'm not sure how useful it would be. You don't need and generally don't want to use absolute divs in a layout. In fact one of the biggest problems I see with people trying to learn to use css to layout a site is they assume everything needs to be absolutely positioned. That only creates more problems than it solves.


I've had a few cases where they solved problems in ways I didn't think of, so the code can be very educational.

Personally I prefer having to figure out the code for myself. I find when I do I not only remember how the next time, but also come away with a better understanding of why the code works. I don't see how tools like DreamWeaver teach you the why. No doubt they can give you a solution to a problem, but without understanding the why I don't know how you can make the determination that it's a good solution or understand where else it can be applied.

To me there's no substitute for hand coding when you want to really understand the code.

mmendis
01-03-2011, 09:10 PM
I agree completely that there is no substitute for hand coding, but if you cant or dont want to learn, than hopefully my free tool will help out. I am doing this on free spare cycles of my time. But after I have the absolute divs mastered, than I will attempt at getting floats, ect working.

vangogh
01-04-2011, 10:57 AM
Sorry. I didn't mean to come across like I thought your tool was bad. I realize it's still something you're developing and I'm sure when it's done it'll be useful to certain groups of people. In fact I can understand how difficult what you're trying to do is. I'll personally stick with hand coding, but that doesn't mean I think everyone needs to.

cbscreative
01-04-2011, 03:59 PM
No doubt they can give you a solution to a problem, but without understanding the why I don't know how you can make the determination that it's a good solution or understand where else it can be applied.

They've actually done a pretty good job with commenting the code to explain the why. I think it would be especially useful for someone newer to coding. Like you, I mostly write my own. Even when I've started with a DW template, it bears little resemblance to the original when I'm done. The core elements are there, but much more tends to get added, and a few things often get deleted or modified. It's been quite a while since I used any of them since I have my own custom ones to start with.

mmendis
01-04-2011, 07:13 PM
vangogh,

i know what you mean, personally I am hand coder person. But I think it might be useful, and because I have been hand coding for a while i *think* that I know how to convert the logic to a program. But yeah hopefully this weekend I will be able to dealing with floats in the div.

vangogh
01-05-2011, 11:22 AM
They've actually done a pretty good job with commenting the code to explain the why.

That's good. I still think the best way to learn is to break out a simple txt editor and just type away. It's good to see DreamWeaver improving though. The code it puts out today is definitely better than the code it put out years ago. However…


text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */

For most sites it seems a waste of time to code for IE5* browsers. In adding this line of css to the body you now have to add text-align: left back at least one other place and probably more. That's just wasted code to me in an attempt to be too inclusive. I think it's also where the main problem lies. Programs like DreamWeaver have to produce code to a lowest common denominator and in the process be unable to take advantage of things like progressive enhancement.

One other think about the comments is hopefully you clean them out of the file before taking the site live. They might be good for learning, but they seem kind of pointless on a live site.

Again though the code looks so much better than it did a few years ago.


But I think it might be useful, and because I have been hand coding for a while i *think* that I know how to convert the logic to a program

I'm sure people will find it useful. Even though I prefer hand coding it's not hard to see that many people would rather be able to use a GUI to design and have the program behind that GUI put the code out.

cbscreative
01-05-2011, 02:35 PM
I'm not sure if that IE5 part would be in the newer versions or not. This came from CS3 which is almost 4 years ago now.

Good point about lowest denominator though. But I adopt a little of that myself for many sites. Maybe not IE5, but I do try to cover some of the older stuff still in use yet if it's a general access site. I'm finally getting to the point where I could care less about IE6. There are still way to many people using it, but since they will be having a lot of problems anyway, I'm kind of inclined to give them more problems in hopes it will provoke them to upgrade. I suspect it will take until they can't access half the web before they finally figure out they need something newer.

I've been waiting for the time to dance on IE6's grave, but it amazes me how much it is still used.

vangogh
01-05-2011, 04:59 PM
Maybe it's not in the newest version then.

The problem I see with the lowest common denominator approach is that it also means that's all you can give to everyone else. Again think progressive enhancement. Most browser can now handle css-radius, though you still typically need to use the vendor specific -webkit or -moz to make it work. Does DreamWeaver allow you to ad a border radius? If so how does it handle versions of IE that don't render a border radius?

For me now I either decide if that radius is important enough to want to include for IE. If not I can add it for the other browsers and leave IE with squared off corners. If it is important there are JavaScript solutions that can be used to get the radius in IE.

I'm curious how DreamWeaver handles something like border-radius. I realize you don't have the latest version, but border-radius has been with us for a few years and I'm pretty sure it was already being used 4 years ago.

jamestl2
01-05-2011, 05:21 PM
IE9 should be able to implement at least a few CSS3 properties, including border-radius (that's what they're saying, anyway). I think the browser's coming out later this year.

vangogh
01-06-2011, 12:29 PM
I've heard good things about IE9. Even IE8 is pretty good when it comes to css. IE still lags behind other browsers, but not to the extent it used it. I write much less IE-specific code than I used to, often none at all.

The problem of course is that even after IE9 is out many people will still be using IE8, IE7, and even IE6. And a quick scan of my analytics shows that one person visited my site in the last month using IE5.5. Throw in mobile browsers that aren't quite as capable and we're still dealing with a host of browsers that can't handle CSS3 or even all of CSS 2.1. And by the time those browsers catch up, we'll likely be complaining that they aren't yet able to handle CSS 3.5 or 4.2 or whatever is the latest and greatest.

cbscreative
01-06-2011, 12:51 PM
I guess if I'd looked for border radius in DW, then I could answer your question. I rarely use borders, so the motivation to use border radius isn't very strong. Remember too, I was a graphic artist long before I was a web designer. If I can accomplish something with graphics, then I worry less about coding it. I use a lot of "old" techniques and rely on my creativity to make them appear unique. Although, I'll quickly admit, coding has advantages to adapt to the zillions of variations in today's devices.

vangogh
01-07-2011, 12:03 AM
If I can accomplish something with graphics, then I worry less about coding

Not really the best way to develop a site though since an image is always going to weigh more than the equivalent code and it's also an extra http request further slowing load times. Media, like images, and http requests are the two biggest causes of slower sites. I always look for a way to code something over using an image and you can be just as creative in the code. That's even more true with css3 and things like border-radius from css2.1.

Naturally you have to use images at times and of course there are times you want to use images. I hope I'm not coming across like I think using images are bad. However take a look at some of the things you can do with code.

10 css3 examples (http://www.catswhocode.com/blog/10-examples-of-futuristic-css3-techniques)

You'll need to look in something other than IE. I would think either Safari or Chrome would be your best options, though I think most of the examples should work in Firefox too.

My thought about DreamWeaver is that it has to code for the least common denominator so you won't be able to use it for css3 at the moment. That's a guess on my part since I don't know. The point being that too much reliance on tools like DreamWeaver put you behind the curve somewhat. At some point what's cutting edge now will become the least common denominator. People hand coding the cutting edge will be a few years ahead of the curve. Of course that's based on my assumption being correct about DreamWeaver not handling css3, which of course may not be true.

Do you need to be coding with css3 now? Absolutely not. There are some great advantages to do so though.

cbscreative
01-07-2011, 03:51 PM
I probably sound like I'm singing praises for DW, eh? I actually could get by on much less than DW because I use a small fraction of its capability. Being a hand coder myself, I work almost exclusively in the code window. There are some nice intuitive features to it though. I think Adobe has recognized users like us, and its not like the old days where it was geared just to drag and drop users.

One you might like is the CSS panel, but I don't know if CS5 supports CSS3 or not. If you click any element of a page, the CSS panel will reveal every instance of code that affects the selected element. If you're trying to troubleshoot issues, this can be a time saver. I'm sure many of those advantages could be found in a really good text editor, but I don't know of any with this level of sophistication. If you're viewing a web page, the supporting documents like CSS and scripts don't need to be open for DW to "see" the commands. Starting in CS4, it automatically opens all supporting files with a web page though (very nice feature).

My main point is that although you can do very well with something like the NoteTab Pro I used to use more than my older DW (before I got CS3), the newer versions of DW serve hand coders quite nicely. And DW has some functionality that hand coders can get spoiled with real easily. It's not just for drag and drop users.

Back when I bought the CS3 Suite, I seriously doubt I would have bought DW separately. Since it was included, I gave it a test drive and found out I liked it in a way that I never really did with older versions. I don't use CS5 yet, but I do know they added a lot of enhancements geared toward WordPress. That's always been lacking in previous versions.

vangogh
01-07-2011, 08:02 PM
Funny. I know you mostly hand code. And you can probably tell I don't use DreamWeaver. I used it for the very first site I ever built and then I never opened it again. Currently I use Coda, which is a Mac only editor. It has the built in FTP and I can edit files live on the site. It does code completion and SSH. It even has some books built in so you can look up code you can't remember and there are addons the community develops for it. Basically it does more than enough for me.

For the debugging stuff I use tools in the browser. Firebug in Firefox and the web inspector in Safari. Both pretty much do what you described with the DW css panel. Plus they do even more.

cbscreative
01-08-2011, 05:09 PM
Yeah, I switched to using Opera as my primary browser a while back and I find some of the tools built into that are pretty nice too. Like you, I didn't care much for the older DW for hand coding. I suspect you probably only use Photoshop and probably don't have much need for a Suite. I'm not so sure I would buy DW as a stand alone, but there are enough things I like about it now that I mostly gave up the NoteTab Pro I used to use.

There are a few things my $20* NoteTab Pro does that I can't figure out why DW has never included. A couple examples are character count (useful for page titles when you want to make sure not to exceed 64 to 80 characters), and strangely enough, thesaurus. I've always wondered why they wouldn't include a thesaurus. I don't use them often, but when I do want it, it's annoying to not have it built in to the program.

*I know it's at least $30 by now, but I didn't look up the current price. They have a free version that's pretty good too.

501graphics
01-08-2011, 05:51 PM
I haven't used Fireworks to generate code in a very long time. Like Steve said above, I know CS5's Dreamweaver has some great structure templates. Lately, I've looked at a template, then designed my PSD to mimic the template in structure. I then hand-copy the various parts of the PSD into the template using HTML and CSS. I always have to do quite a bit of hand coding to tweak things to get them looking just right.

It's not a difficult process, but it's fairly time consuming the first few times you do it. As with almost everything, the more you practice, the quicker you will become. If the PSD is not created with conversion in mind, I'm sure it would take much longer, so if possible, create your PSD in such a way to make the conversion quicker (ie, keep DIVs on separate layers in the PSD). Otherwise, you'll end-up with a solid graphic, and you'll just use Fireworks to slice it up.

vangogh
01-08-2011, 06:44 PM
Steve I do use Photoshop and don't have one of the suites, however that's mainly because Adobe doesn't make a suite of the programs I want (unless I want to go all out on the master suite). I'd like to have Illustrator and InDesign, and even Flash if you can believe it. I'd be fine with Acrobat and Fireworks too. The problem is Adobe views some of those as print programs and some as web programs so there is no suite with those 5 programs.

And of course the software is incredibly expensive, not to mention a resource hog. I do use Photoshop, but I probably use no more than 20% of it. And just about every time I open it for even the smallest thing I usually have to restart my computer.

I've been leaning more toward lighter programs that do a few things really well, especially when I only need those features a limited amount of the time.

Aaron what do the structure templates look like? Is there a way to grab an image of one or two and post them here. I wouldn't mind seeing what the code DW produces for them too.

501graphics
01-09-2011, 08:00 PM
I could probably swing that. Give me a while to take some screenshots. I'll be snowed-in for the next couple of days with my almost-three-year-old, so I should have some time to get those ready.

vangogh
01-10-2011, 11:43 AM
Thanks Aaron. No rush. I promise I can wait. :) It's mostly curiosity on my end to better understand where DW is. I'll probably use the information more for conversations like this one than anything else. It's not a desire on my part to use DW in my work. Mostly curiosity.

cbscreative
01-10-2011, 01:40 PM
Actually, vangogh, the Design Premium Suite (http://www.adobe.com/products/creativesuite/design/whatisdesignpremium/) might be to your liking. It does bundle all the programs you listed, and DW. It is still pricey, but not nearly what the programs would be separately. I can't do anything about the resource hungry nature because you're right. Each version gets increasingly demanding. The best you can do is go into the program settings and choose how much RAM the program is allowed to use. It just so happens, I was checking that on my PS last night. I could lower it, but the recommended amt was nearly 1GB to keep the performance level up. Mine was set slightly too low which I kind of suspected.

vangogh
01-11-2011, 12:13 AM
You know I think that suite does have everything I might want (plus a few I'll probably never use). Now where did I leave that spare $2,000 :)

Definitely the suite I would get if I was going to get one. Is that a new suite? I've looked through them all so many times and never could find something that had all those programs. I think it was always the web suites would leave out InDesign and the design suites would leave out Fireworks, Flash or both.

One of the problems I think that's might be facing Adobe in the future is their pricing. They certainly make feature rich software, but I see more and more lighter programs coming out that are under $50. Pixelmator (http://www.pixelmator.com/) is one many people rave about for the Mac. Probably not enough for people like you and me, but for the majority it's more than good enough. I think it compares favorably with Photoshop Elements at less than half the price.

dojo
01-11-2011, 07:23 AM
For an experienced designer, this is a breeze. It doesn't take me too much time to slice and code the HTML/CSS template. Still, sometimes the design itself is pretty weird (have done some coding for a designer and just wanted to kill that person). I like to make my own designs usually, since I know how much I can go crazy with it, but I've done coding for others too. As long as the design is not too ugly to make me hate working on it, it's pretty OK.

cbscreative
01-11-2011, 01:04 PM
You won't get any argument from me that Adobe is overpriced. I've always felt they were kind of arrogant for lack of a better way to describe them. They only had one serious competitor, Macromedia, before they bought them out (I wouldn't classify Corel as serious competition even though they make a very good product). I anticipated they would raise their prices after eliminating the competition, and sure enough, they did.

The only plus side is, they adopted a lot of Maromedia's thinking on their products since the buyout. That made the products better for sure. Before that, the lack of adequate workspace tools and reliance on menu diving (or memorizing a zillion keyboard shortcuts) to perform tasks was maddening. I still have serious issues with Illustrator. To me, although far better than a the pre-Macromedia buyout days, the interface is still awkward and clumsy. Tasks that can be performed in one click in a program like CorelDRAW often require 2, 3, or 4 steps/menu dives in AI.


Definitely the suite I would get if I was going to get one. Is that a new suite? I've looked through them all so many times and never could find something that had all those programs. I think it was always the web suites would leave out InDesign and the design suites would leave out Fireworks, Flash or both.

On your question about the availability of the Suite, it goes back to CS4, but I'm not sure if CS3 offered a comparable mix. I don't think they did. It was just like you described before that.

vangogh
01-11-2011, 03:26 PM
It's possible I haven't looked at suites in awhile. I currently have Photoshop CS4 and I don't recall that suite being there when I was looking to upgrade. Maybe my timing was a little off and the suite appeared just after I made my purchase. My memory is that the suites (other than the master suite) fell either on the print side or the web side. It's also possible I just missed it, though I did spend a lot of time looking through Adobe's site.

To me the biggest problem with Photoshop and I expect all Adobe products is they're resource hogs. As much as I need and use Photoshop I'll do anything to avoid opening it if I can. It almost always slow my laptop to a crawl and frequently requires a restart after using. Admittedly I don't have the most powerful computer in the world and my laptop is 2 1/2 years old at this point (a long time in tech years), but Adobe products seem to be more resource hungry than they need to be. They do aim to be everything, which is part of what makes them so good. On the other hand I think in the future we're going to see slimmer products that aim to do a few things really well instead of trying to do everything.

And in my case Apple and Adobe don't seem to be playing nice with each other. I can see a time when many Adobe products are either not available on a Mac or lag greatly behind their Windows counterparts. Not that it's going to stop me from buying the design suite. A little more money in my bank account and it'll find it's way onto my machine.

cbscreative
01-12-2011, 01:47 PM
I do find it interesting that Apple and Adobe seem to have a hostility brewing because the Adobe products were more Mac based in the past. Since so many designers swear by Mac, they have nothing to gain by butting heads.

vangogh
01-12-2011, 11:14 PM
They used to be such good friends. I'm not sure where the rift started. I think it was before all the Flash or rather lack of Flash in iOS. I can attest to Flash (and all Adobe products really) being memory hogs. Every computer I've owned in the last 10 years comes to a crawl after watching a few Flash videos or using Photoshop for any length of time.

I've wondered if Apple was planning on offering something more Photoshop like than what thy currently have, but I don't think they are.