I’ve been a heavy (daily) user of Panic’s Coda mac app for code editing for several years now.  And I, like many other web designers and devs, have been frustratingly waiting too long for Panic to release Coda 2.  Well that day finally arrived yesterday.

My early reaction, sadly, is that I’m disappointed.

I’m primarily a designer and front-end guy, so my focus is on the UI and general usability of the app.  For an app that so many designers use on a daily-basis for hours after hours, the user experience/productivity of the app is paramount, and I’m sad to say Coda 2, in my opinion, has taken a step backward in this regard.

That’s not to say there are some improvements in Coda 2.  So let’s cover a few my favorites first:

List View

Finally!  The sites view can now be a simple list instead of a mountain of site thumbnails that were difficult to search and find a site quickly (not a fan of typing in a search box just to open a project).

Code Folding

I can’t say I’ve found myself using this feature much (yet), but I do like the way it has been implemented.  Code folding allows you to “fold” sections of code, making your document more compact and easy to navigation.  The color coding along the left side helps identify areas that can be folded.  Nice touch.

CSS & General Code Completion

Generally, I’m satisfied with the improved code completion features built into Coda 2.  I noticed a few things are a bit more efficient.

CSS editing now adds some nifty popup bubbles to help with picking colors.  I think they’re going in the right direction here (who used the dedicated CSS Editor in Coda 1?  I didn’t.).

But I’m unsure if these are totally usable yet.  For picking and matching colors, I still find ColorSnapper to be the best tool out there.

And the CSS code complete doesn’t do cross-browser CSS3 support.  So I’m still using LessElements for most of my CSS3 work.

On that note, I would have liked to see .less files automatically recognized as CSS.  I still have to manually set the Syntax Mode to “CSS” every time I work with a .less file (which is every time I work on any project).  Annoying.

EDIT:  Thank you to @daveyank and @mattvagni for pointing out the preference setting to make .less files always open with CSS syntax

Now on to my main qualms with Coda 2:

The redesigned Top Section

Perhaps the most frustrating thing about this release is huge pieces of the visual interface have been dismantled and put back together in a less intuitive and overly clever (to a fault) kinda way.  The top section is the first thing that grabs my attention (in a bad way).

Here’s what one of my projects looks like:

If you’re familiar with Coda 1 (as I’m sure many Coda 2 users are), on first glance, it appears there are MANY files open, when in fact there are only 2 files open.  The breadcrumbs/file path bar now resides where the file tabs used to.  It’s also the same color/feel as the old file tabs.

OK, so they’ve moved the currently open files to the top, as these thumbnails.  Interesting at first.  But still a bit hard to read the file names on these (at quick glance), especially some are on 2 lines, some not, some truncated, etc.  The thumbnails take up a lot of screen real estate, so I tried text-only mode.  Nicely saves space, except now there’s no way to see the project name I’m working on (kind of a key component, no?)!  This is frustrating, especially when I’m working on 2-3 projects at once, which I often do.

Now back to this new file path bar.  Basically it’s a breadcrumb-style file path, which when you click each step opens a mini file browser popup.  In theory this is a clever idea, but in practice it’s cluttered, inefficient, and only serves to slow me down when I need to quickly navigate to certain files within my project.

I don’t think this piece is necessary at all.  But if it HAS to stay (there’s no option to disable it), then here’s one idea to make it a bit easier to use.  Make the root level the folder selected as the local path for this project.  Don’t make it the root of my computer!  Coda works on a project basis, so I only want to see files and folders for the project I’m currently working on.  The rest just make this harder to navigate.

EDIT:  It appears Panic implemented this this change in Coda 2.0.1

These little details can become very annoying on a daily basis.

The Sidebar & Publishing

Here’s another instance of trying to be too clever, and reinventing something that not only wasn’t broken, but might have been one of my favorite features of Coda 1:  The sidebar files list and marking/publishing files to the server.

In Coda 1, you had your files list in your sidebar, and every time you save a file you’d see a little icon next to that file indicating it’s marked for publishing.  As I save a handful of files, I can see which of my files are ready to go live (as well as which ones haven’t been touched).  When I publish, I can see which ones are still uploading and which have finished.  It was beautiful, compact, easy to use, and easy to see, all in one view.

In Coda 2, they created this dedicated list of files that are marked for publishing, separate from your main files list.  You have to click between the 2.  How is this better?  And what about knowing which files are ready to publish?  They could have kept the “marked” icons present in the files list, or in the new files tab up top.  But they’re nowhere to be found.  This is a head scratcher.

Bottom Line

I know this all sounds very nit-picky… but these things matter to someone like me who spends a huge amount of time in this app.

Maybe I just need to give it some more time to sink in.  But I can’t see how these file navigation issues — a central component of any code editor — will become any less cumbersome than they are now.  While I love everything Panic has done in the past, I might have to think about switching pretty soon.