The one caveat I would add which the author glosses over is Test in IE as a high priority unless you have a very tech-savvy audience. Compass/Blueprint abstract away most of the uglier CSS box-model hacks and I agree that IE users can live without gradients and rounded corners. But if the site looks awkward without the CSS3 tricks that don't work on the browser that >60% of your audience uses, you're going to need to tweak that aspect as well .
Right, so the choice is, find a DTD that keeps IE6 in standards mode, or spend countless hours debugging hundreds of tiny layout issues that exist nowhere else.
Relating to Haml/Sass, you may have heard of the ruby gem StaticMatic. It's a great tool that lets you use Haml/Sass to building quick, static prototypes.
In fact, I loved the concept so much that I began improving upon it myself[1], adding support for CoffeeScript and Amazon S3. For anyone who might find it useful, any testing or feedback would be greatly appreciated.
I used Staticmatic, but I never liked having to move all my HAML/SASS over to my app. I recently replaced it with the showoff plugin [1], which is basically Staticmatic inside a Rails app.
Interesting, thanks, I'll consider using that next time I'm building a prototype that will eventually become a Rails app. But who knows, I might write a rails-app-exporter for StaticMatic just for fun :D
I liked it. Lot of folks may already know some or most of this. But it is distilled all in once place, and as the post mentions, it will surely help in quickly moving forward with a polished looking app.
It actually isn't a mistake so I can understand your confusion. #111 or #222 can often be used without losing readability but this doesn't mean black is a mistake. When's the last time you went to a website and said "This text is just too dark!". Hopefully I don't come off too rude, the idea that black as a text color is a mistake is almost offensive to me. Different perspectives.
Well, there are plenty of studies that show high contrast makes for readability issues. For example, I get faint after-images that flick around the page when reading black text on white. It's very distracting.
I get your point about different perspectives, but for web pages we want everyone to read, we should be designing for the lowest common denominator.
Great catch. Although, in my defense I'm always looking to save time so I just used out of the box settings on the wordpress "Platform" theme. If you're starting from scratch on your own site, dont make this mistake :)
One reason I avoid using pure black or pure white these days is I blend text towards whatever is behind it. Text tends to look a lot heavier on the screen than it does in Photoshop (especially if the designer likes to use lighter font weights which generally don't work for the web), and you can really mitigate how heavy the text feels, and reduce the contrast (which mimicks the superior rasterisation going on in Photoshop) by moving the color of the text towards the colour of its background. If you have black text on brown, make the black text slightly brown, for example.
There's a difference between moving fast and doing sloppy work. IMO, this post is a recipe for mediocre design (at best). Don't confuse movement for work - when you approach a design with the a rushed attitude it slows you down in the long run, because you have to clean up your mistakes and possibly start over again when you realize that your first attempt just didn't work at all.
I'm not so much arguing with the specific suggestions in the post as I am the general approach and worldview. There are some useful ideas in there, but they're weakened by being presented in "recepie" format. Sometimes they make sense, sometimes they don't. It depends on the context. Better to learn principles than methods. It's quicker in the long run.
There is definitely a balance between speed and quality. The author here is advocating methods that will enable a single founder to push out an MVP as quickly as possible (while still maintaining some degree of aesthetic appeal). The recipe is absolutely useful in the same way that purchasing a template is useful. As long as it doesn't get in the way of your functionality, you can ship and start iterating with real users.
The article is aimed at programmers without design skills. If you can teach them to create great designs instead of just half-way decent ones, write something up!
My advice wasn't the one solicited but:
UI Frameworks are great at helping you get things done. If that is your primary goal, then you should use them. Plain and simple.
The only drawback is that you're incurring some technical debt because you may not be able to easily add needed features to the framework. That's okay for a MVP but needs to be considered before buying into the YUI Control #12 wholesale.
Orange has 'warning' and 'slow down' associated with it here in the US though (think of every traffic warning/construction sign and highway equipment you've seen).
I'd contest that it would only matter if you're the same as everyone else if it's contrary to your goal(s). What is your goal? For most it would be to get users to purchase something (aka, make money).
There's the other upside that if your website isn't radically different from others, a lot of your users will already know how to use it. There could be a lot to gain with a lot of your visitors knowing how to extract information from it.
Yeah, I'd agree. I've seen far more UI design crime done in the name of "doing it a new way for the sake of it" than is caused by being similar to other implementations.
The article is very specifically geared towards producing a prototype quickly, not producing a great design. Therefore, similar looking sites don't really factor into the issue being addressed.
I was super surprised at how well SASS let me move quickly with coding 3pics.me! The lighten, darken and mix functions make getting appropriate hex codes pain free.
The one caveat I would add which the author glosses over is Test in IE as a high priority unless you have a very tech-savvy audience. Compass/Blueprint abstract away most of the uglier CSS box-model hacks and I agree that IE users can live without gradients and rounded corners. But if the site looks awkward without the CSS3 tricks that don't work on the browser that >60% of your audience uses, you're going to need to tweak that aspect as well .