Stuff i'm working on. Or have worked on. Or stuff that just wanders in my head.
Thursday, March 21, 2013
Just had to share this...
Just take a look at this video:
http://www.amazon.com/gp/mpd/permalink/m2C229W9U5FIEP/ref=ent_fb_link
Tuesday, March 19, 2013
How to handle DOM updates in AngularJS Directives in "link"
var myModule = angular.module(myModule', []);
myModule.directive('myDirective', function () {
return {
templateUrl: 'partials/timeline.html',
link: function postLink(elem, attrs, transclude) {
// This code will run after
// templateUrl has been loaded and cloned
}
};
);
The problem is divided in two steps, that must be handled each: The function "
link
" is called after the template has been cloned. This does not include any DOM manipulations that happen after this cloning, triggered by directives ng-repeat
or ng-view
. If you want to start your DOM manipulation after these directives have been handled by AngularJS (i.e. the DOM has been manipulated), you will need a setTimeout
, or better the $timeout
function from AngularJS.So now you will get this code.
var myModule = angular.module(myModule', []);
myModule.directive('myDirective', function ($timeout) {
return {
templateUrl: 'partials/timeline.html',
link: function postLink(elem, attrs, transclude) {
$timeout(function () {
// This code will run after
// templateUrl has been loaded, cloned
// and transformed by directives.
}, 0);
}
};
);
Yeah, that's better. But wait, we're not done yet. What if you want you want to do transformations of the DOM based on the positions of the newly rendered elements? Getting the position, offset, height, width of the newly created elements are not guaranteed to provide the correct values, because the browser had not enough time to render and layout those elements. The hack is to further delay these operations.
var myModule = angular.module(myModule', []);
myModule.directive('myDirective', function ($timeout) {
return {
templateUrl: 'partials/timeline.html',
link: function postLink(elem, attrs, transclude) {
$timeout(function () {
$timeout(function () {
// This code will run after
// templateUrl has been loaded, cloned
// and transformed by directives.
// and properly rendered by the browser
}, 0);
}, 0);
}
};
);
If you wonder, why a timeout of 0 really helps, here's a great explanation by John Resig.
Website for "Medizinische Kosmetik Hördt" finished
Anyway, because it's businness-related stuff, I did not want to do it for free. But because moving money between cousins sucks, I had another approach. She will invite my wife and me to a fancy restaurant. Why? Because time is more valuable than money. Because people do matter most in life. Because spending money for yourself won't make you happy.
Oh, here is the new website:
Monday, March 18, 2013
My Wife Blogs
Saturday, March 16, 2013
Sandbox
This was one of my tries I liked most:
In general, I like typographic logos (see BaSiC). I find logos of this kind are usually very clever and very fun (My opinion may be biased because of stuff like this). So I fell in love doing such stuff.
Oh, in the end, they didn't choose my logo. As already told, they have some really great artists. :)
Friday, March 15, 2013
Why You Should Skip Photoshop
You can flesh out the main graphical ideas faster using a pencil and paper. When thinking about something general like layout, placement of images, you don't need to cope with unimportant stuff like the color of the dropshadow you want to use. You don't should care about pixel-perfect placement of borders and what not. Just skip photoshop and use a good old pencil.
You will be doing once again anyway.
If you design a website in photoshop, you will have to code that whole stuff in HTML, CSS and Javascript. So why spending so much time to paint pixels in photoshop?
You get better code.
Since the arrival of CSS3, making good-looking website is great: dropshadows, inner shadows, gradients, semi-transparet colors, you name it. Instead of cropping photoshop effects and useing them in background-image, you will use CSS features straight. This results in better code, faster loading, better maintainance, lower overall costs.
You are faster at changes.
Want to change the color theme on your mockup? Want to the navigation to left side, altough it's currently on top? Good luck using photoshop, I'll stick with my editor. Some effects are so much easier and faster to change in an simple CSS file (think "find/replace"), even waaaay faster when using some neat stuff like OOCSS or SASS, than clicking through alle those layers, moving and colorizing items.
You can work on one mockup with your colleague simultaneously.
Image what it would be like, if you could work on your machine with your mockup. And a co-worker would work on the same mockup at the same time on his machine. And when you're both done, some magic would combind the work of you both to one wonderful whole piece. Thanks to version control systems, this is something very old-fashioned in code-based working. Try to do that with photoshop.
You'll have no frustrations transitioning from photoshop to browsers.
Browser handle font rendering different than photoshop does. Browsers don't support all that crazy blending methods. Browsers have differences in rendering among each other. (I guess it was due to the craziness of some photoshop-idealist that people came up with the idea that websites have to look exactly the same on every browser.) You created something in a place where it will finally live. That's good.
"It's not just what it looks like and feels like. Design is how it works." — Steve Jobs
You cannot simulate the behaviour of a website, or an web app, or any app at all, when you just draw pixels. When it comes to testing mockups on future users, you must have something clickable.
You save money.
Well, since Adobe gives CS2 away for free, it's not that true anymore. But let's be honest: photoshop cost money. Alot. Insanely much money. Stick with your favorite text editor, and perhaps GIMP for some crazy image manipulation and everything should be alright.
Still not conviced? No problem. Don't listen to me. I'm just a regular wed dev idiot who thinks he knows something about designing web stuff. Maybe you would like hear what 37signals says about photoshop. Or why the designer at github skips photoshop.
So, maybe it's time for you to improve your design workflow?
Saturday, March 9, 2013
Can You Go With Less?
No doubt, I wanted that pair of new jeans. I wanted to purchase something, I wanted to renew my wardrobe, I wanted something new and fancy and fashionable. Even it's just something as boring as jeans.
So I put my which on hold. First, I waited and watched, whether I could still find something to dress without buying new stuff. I gave that experiment some time to either work or fail: About one week should be sufficient. Long story short: It worked just fine. I just don't need it.
This approach also works in the development of web apps. Before rushing into thinking about new features, before starting to adding new functions to your web app, just ask yourself: Will the effort be worth it? Will this function or that feature really add value to my program? Will it be so much better?
Because, just as buying unneeded items, it's not finished after paying the price on the price tag: Clothes need washing, need some place to lay them down when they're not in use, which also costs money (rent, furniture). Software is just the same. The work is not finished after having built the feature: Every feature also must be cared for. Every feature must be debugged. And, the worst of all: every added feature adds over-linear more complexity. This slows down the addition of new, really important functions.
My credo, either in real life, or in software development: simpler is better.
Saturday, March 2, 2013
I Deactivated My Facebook Account
Why? Because facebook does not add much real value to my life. When I look closely at the content which my acquaintances on facebook write, it's entertaining for short period of time, at best. And just a waste of time, at worst. And just because some clicks on a button, or writes a comment, doesn't mean he or she genuinely cares about what you write: I told somebody something he actually already knew, because I wrote something about that on facebook. We had a short conversation about that topic on facebook. But when talking face-to-face, I realized, that he already has completely forgotten about that. Probably becuase he just doesn't care. On the other hand: The things I talked to him in person about, he did still remember, more than one year later.
Facebook is also a tool of shallow, but instant gratification. They will never implement a dislike button, just to keep the experience as positive as possible. The worst thing, that can happen, after you wrote something or uploaded a picture, is that nobody replies. But it's likely that some of your "friends" will click that button, to express he likes that. And boom: there's you instant gratification. And instant gratification is how addictions work, especially the internet addiction.
It's quite noteworthy, that facebook tries very hard to stay active. So they present you this text:
Yeah, sure. |
So, I think, I will miss nothing. And if I do, it won't be important.
And yeah, this one-month-abstinence from facebook is also to fight my mild facebook addiction: Although I also deactivated my facebook account on my phone, I wanted to check status updates on it today.