Thursday, March 21, 2013

Just had to share this...

Yes, I neeeeed this piece of plastics for my spoiled kids to ruin my 700,- € iPad.

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"

AngularJS directives are great. They provide a really wonderful mechnism "to teach HTML new tricks". But apparently there is no predefined mechanism for doing your DOM manipulation after the template has been loaded, cloned and transformed and rendered. Today I found a workaround for that.

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

Yes, it's finished. Design, HTML and stuff by me. For my cousin Ina Hördt, who runs a small saloon (she does not like this word) in Würzburg. Her previous website really needed some polishing.
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

My wife started blogging. I think I will start a cooking challenge, too. That will be fun.

Saturday, March 16, 2013

Sandbox

A friend founded a new company, called it "sandbox interactive". He hired a team of great artists and programmers to create a new MMORPG. One of those kind they would like to play themselves. They needed a logo for their fresh, new company. He told me, that if I liked to, I could give it a try.

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

I don't use Photoshop for designing web sites any more. See, why I believe, you should too:

  • 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?

Some days ago my trousers got ripped. Since I have already decluttered my wardrobe almost to the minimum, I immediately thought: Oh, I have to buy a new one! I already planned where to buy that new jeans, what kind of jeans, was thinking about the color that new jeans should have, and so on. But then I stopped: Hey, just step back a little bit. You do still have one more pair of jeans. You actually have enough trousers. So do you really, really need that new pair of jeans? Could you without that replacement? Could 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

I deactivated my facebook account. One year after reducing my amount of so-called friends on facebook, I decided to let go of facebook. At least for one month, period.

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.
All my 67 friends will no loger be able to keep in touch with me. Oh, really? Most of these friends have my e-mail adress, my phone number, the knwo where I live. And if they don't: It's not hard to find out. I wonder, how many people actually believed that.

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.