#pixel-perfect

[mercycodes]

ocean kissed - free to use

click here for the pastebin!

[comets-and-cosmos]

64, 85, and 91

64. What was the last movie you saw? Opinion?

The last movie I saw was Kubo and the Two Strings. And wow it was one of the best animated movies I’ve seen. The stop motion alone was dazzling but the story was just so emotionally impacting that it brought everything together so well. Highly recommended

85. What motivates you to succeed?

Um…I’m not entirely sure. I guess it’s just a will to succeed? I take pride in what I do and I never want to do a shitty job which causes me to put a lot of effort into most things. So I guess my determination to succeed motivates me?

91. If you could have dinner with any one person, living or dead, who would they be and why?

I’d probably want to talk with Mary Shelley. While Frankenstein may not be my favorite book of all time, she truly defined the writing craft by creating the science fiction genre and showing that women were capable of works beyond romance. And I think it would be really interesting to talk about writing style with such a defining author.

Thank you so much for the questions!!!

[al-the-x]

Why “pixel-perfect” makes my blood boil...

I keep tabs on several different job boards, so that I can recommend them to my grads from The Iron Yard. I saw this again today -- "Proven ability to design and implement pixel-perfect designs so that they’re pixel perfect" -- and I almost lost it.

For all you aspiring front-end developers out there, for all of my students, for everyone I've taught the last four years, for all my grads hunting for jobs on the market, and especially for all you pixel-pushing designer-only-types, this is for you:

Pixel-Perfect Doesn't Matter

Nobody gives a $#!+ about making anything look identical to your preciously hand-crafted, single page of lipsum... except you. What's more, that flat image that you slaved over for 40+ hours to line up all the baselines on... What's that look like on your iPhone? What about the boss's Blackberry?

Not to mention that your tidy typography is gonna fall flat when Marketing drops 30 pages of copy on it and blows your cute four-point navigation all to hell with three levels of nesting. Let's not even talk about the small paragraphs they want to shove into your cute little Call-to-Action buttons.

Your contribution to the project is no more important than anyone else's...

And that's really what I hear when I see "PIXEL-PERFECT or GTFO!" in job postings: designers who think that the integrity of their design -- which won't survive impact with reality -- is more important than the collaborative input of a professional from another discipline. Or maybe they just think that the most important part of the project is the design, coincidentally the part they happen to spend the most time on.

Yeah, my focus isn't on every pixel of the UI, like yours. Mine is on making your static vision a dynamic reality, something that can be clicked on and interacted with. The content is equally as important.

"But the integrity of the design is pivotal to the success of this project!" they exclaim. Just like the integrity of the system architecture, the information architecture, the orchestrated chaos of deployment, the right copy, imagery and photography... It's all pivotal, and it's all subject to change and interpretation.

I've got to change it a little in the implementation, the client sure as hell wants to change it as soon as he or she takes a shower, the copy that lives inside it will change it, the device it gets rendered on will do strange things to it.

It's not gonna be exactly the way you drew it.

If that's your idea of "perfect", you're gonna be disappointed. Often. Even by yourself, should you take up the code first-hand.

"But I can make it pixel-perfect!" you say. Perhaps you can. How much time will you spend making it precise, only to cringe when you see it on that fancy new tablet-thingy?

"But I can make it responsive, too!" Maybe. Can you make it work on every device? Even the ones you don't know about yet? That haven't been built?

Get over it.

Pixel-perfect doesn't matter.

[uxdarkroom-blog]

By definition, Design is a method of problem solving.

Design is not about creating something for your viewing pleasure. It’s about the challenge of solving a problem, something that doesn’t quite work or just feels ‘wrong’.

It’s about loving that challenge. The bigger, the better. It’s a quite common perception that a designer’s work is all about how it looks, if the colour scheme matches your preferences or the typeface is your favourite.

But good design is selfless. It’s aimed for the good and needs of others. Keep reading >

[akrigline-blog]

Pixel Perfect is a Lie

Seeing as how I am a Senior at the University of Akron, I'm currently in the market for a web design job post-graduation. There's a lot of opportunities out there, but there's one line I keep seeing on job requirements.

"Must be able to create Pixel Perfect websites based on mockups." or something along those lines.

Pixel Perfect is an illusion, a falsehood, a contradiction, and an impossibility.

The web is no longer pixels, there are no standard sizes that become "the page." Everything is fluid. The designer cannot control what size device their website is viewed at, nor can they choose to ignore a large portion of the browsing population by only catering to a certain screen size.

The idea behind a "pixel perfect website" is pretty understandable. If print design has standard sizes, so must web right? Surely 960px wide is a standard "website" width. Why should I bother scaling it up for higher resolution screens, or down for people who have multiple windows open? Why even bother with tablets or mobile devices?

It's a very understandable line of thinking. The problem is that it's a line of thought that is a few years behind its prime. Today, there are no standard sizes for the web. There are some theoretical breakpoints, but even those aren't ideal. Everything has to be viewed on all devices, because if a user comes to your website on their phone and runs into a frustrating experience, they won't be back.

The web is fluid now. There is no way to successfully constrain it to certain sizes. Pixels are out, percentages are in.

Rest in Peace, Pixel Perfect.

[designchronicles-blog-blog]

Making a pixel-perfect, scalable flower

Knowing that circle shapes can be a tricky business to get pixel-perfect in Photoshop — due to there being no 'Snap to Pixels' checkbox, like there is in the rectangle and rounded rectangle tools — I was a bit concerned about how to get a nice, even repeating pattern for my flower.

ATTEMPT #1: Draw a circle in Photoshop (using the rounded rectangle tool with a large corner radius, for that lovely Snap to Pixels), duplicate it a few times, and arrange the circles by eye to make the petals.

However, I was working at a small size (like 30px wide), and it was hell to get everything aligned. I gave up.

ATTEMPT #2: Moved to Illustrator. I figured Illustrator probably has a feature for this, and as it turns out, it has several.

To ensure pixel-perfection when I move back to Photoshop, I did the following:

Make a pixel grid, following this guide to turn Illustrator into pixels.

Go through the Preferences changing anything that looks pixel-relevant, such as Selection & Anchor Display > Snap to Point: 1px and General > Keyboard Increment: 1px. Also, in the View menu, check Snap to Pixel.

Double-check everything's set up right by drawing a circle and zooming in to see if it lines up to the pixel grid.

Pay attention to how things line up: is the center of the circle a pixel, or a pixel boundary? (This will affect things like: if there's an uneven number of petals, and you have two that meet at the center at the bottom, will it come to a single point/pixel? Or will the middle be between two pixels, making it blurrier or give it a gap?)

Pasted it into Photoshop using this trick: pixel perfect vector pasting.

Did any further Photoshop edits using this guide: pixel perfect vector nudging.

Then to actually make the flower, I discovered that there are two great methods for this very thing: complex circular design techniques (AKA how to make repeating circular patterns).