Coda: My Journey to the MacWorld has begun

So now that I’ve made the jump to a macbook pro, I’ve had some time to venture into the great yonder and learn from new cultures, such as Panic’s Coda, a all-in-one web designer tool created specifically for the mac. Now that I’ve had time to use it, here’s what I really think:

1. Coda Design

Since most web projects you work on typically follow a lot of the standard tags, elements, css, etc, Coda gives you the option to use “clips”. These clips let you save snippets of pretty much anything, and the ability to quickly paste a chunk into your code. You even set where selected text would go into this snippet if you were to highlight something and then paste. The amount of time this can save over time is astronomical, and Coda executes it so elegantly it’s impossible not to use.
Another nice-have is the Code Navigator. When using IDs in your divs, standard tags, or CSS classes, Coda creates a “table of contents” of all these elements in your current document for you. I find myself quickly jumping to different parts of my doc very quickly. While it’s nothing brand new (Dreamweaver also offers this), Coda just seems to handle it faster and color codes these items so i can easily differentiate the classes from my tags.

2. Coda Styles

Even though I typically do CSS by hand, t’s great knowing Coda has a robust CSS editor that’s quick to use and on par with the highly-praised CSSEdit. Sometimes I don’t want to type out the CSS for a top left non-repeating background image… it’s just too damn long. Coda also gives you the ability to bring up a rather impressive color picker, where you can choose a color and then drag that swatch into your CSS doc to create the hex value for you. This keeps me from jumping back to Fireworks/Photoshop to figure out the hex value for that shade of blue I were using. It also keeps me from just randomly guessing 4 times until I get it right.

3. Coda Validates

Coda doesn’t want you to leave Coda, even if it’s just for a few minutes. Maybe it’s that it gets needy… or maybe it’s because almost every reference you need is already built in. Validator.w3.org is a great to make sure your HTML is good to go, but Coda has HTML and XHTML code validation built in. Follow the warning triangles and read the balloons to get an idea of what’s wrong. This has been useful from day one.

4. Coda Shares

Sharing is caring. If you’re working in a group setting, I’m sure you’ve used Google Documents to quickly share word docs for everyone to look at, make comments on, without the hassle of emailing back and forth. Coda is also outgoing and friendly, and loves to make new friends. Simply click the Share button at the bottom of the editor and click the “Bonjour” button. This makes the document visible to others so they can take a gander at your design. I can then use the Invite popup to send out an invitation to the document to another Coda users, and even setup Access Controls for my guests so I know what they can and can’t do to shit. If all I need is approval, then I can make the document read-only, or if I feel the person is capable I’ll let them improve upon my doc.

5. Coda Controls

With Coda’s one-window setup, it’s not surprising I’m able to handle all my version controlling via Coda as well. Version Control is like a my roommate Tyler…. annoying to deal with, yet always has a copy of my porn work if my computer crashes. It also makes him a thief whereas Version Control has permission to do so, but besides the point. Having this in Coda keeps me from having to open a new program everytime I want to sync up with my repository, check out a new project, etc. This is a huge time saver, and just keeps everything more organized. It’s the little things in life that make me happy.

Comments (2)

November 10, 2008 · Filed under Design, Web

Halloween Costume Design of the week

Captain Hammer

Still not sure what to be for halloween? Simple: Captain Hammer, made fairly popular by Joss Whedon’s Dr. Horrible Sing-Along blog featuring Neil Patrick Harris and Nathan Fillion. The latter stars as the not-so-humble serenading hero who unjustifiably spoils the not-so-evil plans of Neil Patrick Harris. So why is this my costume of the week? It’s heroic, it’s epic… and as Obama said about himself in a roast to McCain… “it’s possible I’m little too awesome”. It’s probably the easiest costume ever…. all you really need is a black tee and an iron-on Captain Hammer emblem… which you can probably create yourself, or just order one from Cafepress. Then you just need ridiculously large black gloves to finish off the look. It might take some practice to pull off the swagger, and vocals, that really turn your costume into a character… but in terms of design, this costume follows the number one design rule: Simplicity wins.

Comments (1)

October 18, 2008 · Filed under Design, Events

Second Life’s second chance

The well-known, yet hardly relevant virtual world,  is trying to make a comeback. Even though it’s dwindled down to the same crowd that still gets on myspace everyday… it has recently garnered some attention from corporations looking to give Second Life a second chance. 

As companies continue to experiment with ways to monetize the continued boom of the social network scene (facebook, Twitter), as well as the recent economic hit that’s hitting everyone, corporations are realizing that marketing in the virtual world might be cost effective way to reach out to consumers if done right. It’s more about building a relationship and engaging user’s in a more creative way than simply pasting virtual billboards every five feet. The recent issue of Fast Company magazine explains how Careerbuilder set up targeted kiosks in high-traffic areas of Second Life world. It only makes sense that with layoffs abound there’s plenty of unemployed users running around…. and it’s resulted in 6,500 users applying for jobs.

Developer Involve 3D exclaims how at the beginning… “everyone was there strictly for the hype and sunk their money into 15 minutes of fame. Now they [companies] are  analyzing what they’re doing and seeing how Second Life breathes.”

Globallinkhas setup an adveritising exhibition hall allowing Second Life user’s to view fashion, cosmetics, products, etc from different countries in a cleverly engaging way that feels more like a museum experience than cluttered ads. Globallinkexplains how it’s just trying to make globalization easier and more affordable for companies via a presense in the virtual world. 

Although the change in attitude towards Second Life lies in just a handful of companies… it’s a trend that’ll likely continue as the economy forces companies to re-evaluate how they spend their marketing budget.  I myself have never dabbled in the second world… but I assume Dwight’s second second life avatar is where the party is at.

Leave a Comment

October 7, 2008 · Filed under Uncategorized

Halloween Costume Design of the Week

Green Man (Always Sunny in Philadelphia)

I’m not sure there’s really a more brave, clever, yet simplistic costume design out there… and I had to put it as the design of the week. The ever-so-lovable Green Man originated from the character Charlie in the FX Original, Always Sunny in Philadelphia. Green Man’s design is so simple in concept… yet with the right dance moves, can be brilliant in execution. This exclusive… err elusive… costume can be purchased at www.begreenman.com.

Leave a Comment

September 30, 2008 · Filed under Design, Events, Uncategorized

Photoshop.com Re-launch: Why Care?

Photoshop.com has relaunched as a full-featured Photo Gallery App with the ability to share your photos, browse other albums, and even edit images from other accounts. So why use this if you’re already using Flickr or Facebook?

Well, for starters, it actually isn’t trying to compete with the aforementioned… it’s looking to collaborate. Photoshop.com lets you sync up with Facebook, Flickr, Photobucket, Picassa, etc to view, tweak, and share ALL your photos from all your accounts at your own unique Photoshop URL. For example, johndoe.photoshop.com could easily share all his facebook and flickr photos, tweak an embarrassing photo or two, and now have one URL for uploading photos.

This is great if you want to send your latest roadtrip pics to relatives who might not have a facebook account, or if you want to just have an easy-to-access repository of all those evenings out on the town. Maybe it serves as a great portfolio resource if you don’t have your own website or blog, and you need something quick and easy to display your talents. Or at the very least, you can just browse around other people’s galleries looking for a great new desktop wallpaper.

Another standout feature is their express uploader. This lets you drag and drop your photos from your desktop into the application, and it’ll do the rest for you. You can drop directly into an album, and then just click upload. This is perfect for those who take tons of pictures at a given time, and don’t want to deal with logging into facebook and going through their upload process. It’s all about convenience and ease-of-use, and that’s where Photoshop.com seems to excell.

Leave a Comment

September 18, 2008 · Filed under Design, Technology, Web

3 Modern Interior Designs to Avoid

It’s pretty easy to find nifty and fun design idea for your bedroom, living room, and overall living space. IKEA even offers you fully-built bedroom displays so that you don’t even have to figure out what matches. Some ideas I’ve seen online have been brilliant… the ones below are not faulted for their cleverness… the execution just doesn’t seem quite there.

The lights in the table register your movements… sounds fun right? I imagine this would make for the most annoying dinner party ever. By the end of dinner you’ll probably break the table… and hate lights.

 

The cupcake chair is a fun and delicious (clever, eh?) take on the always fun bean bag decor. While the cupcake is more than likely comfortable and likely a hit at your next party… it costs $900 and will constantly make you hungry. Go for the LoveSack Fombag instead if you’re in the market for an overly large beanbag chair.

Honestly, I love the idea and concept. I mean a nightstand that transforms into a bat and shield. What could be better? Well, perhaps a nice looking design? This is probably the ugliest nightstand ever made (with that stack of books you used as a nightstand in college a close second)… and you could easily just put a bat in the corner of the room to serve your security needs.

Comments (4)

September 15, 2008 · Filed under Design

Zune upping iTunes

Apple announced it’s new line of iPods this last Tuesday, as well as the new version of iTunes featuring the brand new ‘Genius’ feature. This iTunes feature will show you a list of recommended songs based on your song library. Microsoft’s slowly-growing Zune, a direct and really only threatening competitor to the iPod lineup, is releasing their 3rd generation Zune software next week with a similar feature… only multitudes more awesome.

Wired had a sneak viewing of the Zune 3.0 software featuring the newly dubbed ‘MixView’ feature. The concept mashes together artists, albums and fans into their recommendation engine, supposably “more accurately mirroring the way people think about music”. The above graphic shows an artist in your library in the middle, and you instantly discover which bands influenced that artist and vice versa, by mousing over those surrounding elements in MixView. Double-clicking through to any song plays a 30-second sample, which you can then go purchase. You can also see which Zune users have this artist in heavy rotation, other albums from the artist, etc… and bringing any of these into the forefront reconfigures the relationships with new elements. It becomes not only a music engine but a social network to discover Zuners that match your musical tastes.

Another neat feature is the Now Playing screen, which displays relevant stats about the currently playing song (ahem, VH1’s Pop Up Video). This is perfect for anyone who wants the lowdown on a song they just snagged via the MixView feature… or just to have playing on your LCD during a party to give the not-so-social butterflies some entertainment and convo topics. Hats off to Microsoft for using their elongated experience to know that one of the paths to victory in this David vs Goliath battle against the iPod is through user-friendly software.

Comments (1)

September 12, 2008 · Filed under Design, Technology

Discovering Blueprint CSS

Blueprint CSS is a CSS framework designed specifically around the idea that your webpage is a grid of information that can be easily adjusted and customized, while at the same time offering up a foundation for much quicker CSS development. It’s standards compliant, follows best practices, and has worked well in all the browsers I’ve tested so far. Where it succeeds:

Grids
So let me get you in the frame of mind to understand how the grid works. Let’s say that your webpage is broken down into 24 columns. These columns do not have a defined width, but naturally each column will always be 1/24th the width of the entire page.  So when you start thinking about your site in this way, you can start easy playing around with how a page would be laid out. Your main content can start at the 2nd column, and then span 18 columns of your page. You then set a secondary area of your site to be the remaining columns. You can then breakup your 15 column main content area into other columns fairly easily. Lets look at the sample below:

Here you can see that span-# is what’s determining how many columns on the grid you’d like to take up. Adding ‘last’ right after means that this is the last column in row/area of content, and will put you down below this content (e.g. to start a footer).  To get the complete lowdown, check out the great Grid Tutorial offered up on their Wiki.

Typography
Another area that blueprint focuses on is having a more advanced, pre-defined group of classes that’ll give you great fonts in a quick manner. The typography.css file defines your h#, p, a, ul, ol, etc, and lets you quickly adjust these to fit your sensibilities. This does offer a great foundation for getting started, and might introduce you to some html tags that you’ve lost touch with. 

The main purpose here is to give you a way to format layout and style very quickly, having a set framework of CSS code, and making small adjustments here and there to fit your design tastes. Although advanced CSS’ers out there might feel like this is cheating… I see it as there’s no point in re-inventing the proverbial “wheel” (in this case, the wheel = wasted f****** time).

Comments (3)

September 8, 2008 · Filed under Technology, Web

Seinfeld and Gates: Huh?

This is the first in a series of Windows Vista commercials featuring the… err… boring duo? The commercial should play off the awkwardness of Gates with the Quirkiness of Seinfeld… but instead it’s a bit too long, makes no sense, and isn’t funny. Sorry Microsoft, no high five for you.

Comments (4)

September 4, 2008 · Filed under Television

Silver and Gold… and Chrome

When firefox started to take some of IE’s share… it was for two main reasons: Customization and Speed. So why would people use Google Chrome over Firefox? Well… it needs to outperform in one of these two categories to actually justify a switch. Which one is it? Well… from what I’m seeing, it’s soon going to be both.

Google Chrome does do the latter. It’s fast. It loaded my blog even before I typed in the address. This seemed rather odd at first… but I had stumbled upon one of Google’s most innovative features… it’s f***** psychic. Through fancy advancements in mental process analysis, Google is able to tap into our psych and cache the sites your brain stores in your subconscious. Although this speed is great… I still see just as many porn popups… hhmmmm

One of the other neat features is the new Google Mascot, Baby G. He’s A cute version of your favorite letter, colored in red with disney style arms and legs. What is he intended for? Unlike the much loved Microsoft Word paperclip, who provides guidance to the inadequate… Baby G provides you with useless knowledge of how much money you’ve made Google during the duration of your web surfing through state-of-the-art visual recognition technology. For instance, you see that Google Ad on the right of this blog post? Well, if you were using Chrome, Baby G would tell you that you just made Google 15 cents. If you looked at it again, that’s another 15 cents. I ended up making Google $11 by constantly trying to hit the little chicken with the slingshot in that clever banner ad I stumbled upon… it said I’d win a free iPod Nano… it lied.

These are just a couple reasons why Google Chrome is garnering so much attention. For more details, check out Google’s Comic detailing it’s other feats of glory.

Leave a Comment

September 3, 2008 · Filed under Design, Technology, Web

« Older Posts