On May 31st the WebMontag Ruhr took place at Witten University. It was quite packed and there were plenty of talks – most of them focused on internet marketing and social media.

My personal highlight was the fictitious character UWe Haar and the startup Buddy Beer (could anyone provide me a link on that – or is it stealth?). I had a html5/css3 talk about responsive web design as mentioned by A-list-apart – if you’re interested in the slides (German) you can get them from scribd.

Big thanks to the organizers Steuerung-B and Unicum - Hope I’ll see everyone on the next Webmontag!

iAds are a great new way to create digital advertisements for Apple’s mobile devices. Soon, there are going to be more than 100 million iPads, iPhones and iPods combined.

Based on open HTML5 technologies (yay!), developers will be able to easily create and distribute content for Apple devices. But what is all the buzz about?

Ad providers won’t be able to re-use many of their existing ads. The reason is Apple’s iPhone & iPad won’t support Flash, ever.

We don’t see that as a problem. As we have already shown, HTML5 holds some amazing possibilities.

For us, it isn’t about doing what we did with Flash already. We are keen to fulfill the promise of better ads with better tools. Forget those annoying Flash banners. Save the monkey from the hammer. Here’s why iAds are way ahead of the competition:

- iAds are powerful html5 mobile microsites
- Stream related videos, trailers & more
- Buy goods. From inside the ad!
- Clicking an ad won’t quit the app

Click here to see the actual demo. You might checkout the sourcecode on Github.

PS: It’s all based on CSS3 transitions, so it’s best viewed on iPhone/iPod/iPad. Webkit is necessary.

There is a potential side-effect of the new facebook “like” button, which has currently not reached public awareness, but it probably should.

It starts when you leave the facebook website. I usually don’t log out, my friends don’t log out, and in fact most people don’t log out. We all know this is too much of a hassle.

Now, if I visit a website which has integrated the “like” iframe, facebook might just know that I am there. Because I didn’t log out before. And why shouldn’t facebook track the referrer combined with the user id of every requested iframe?

The problem is, we might see millions of websites using this like button soon. Facebook could basically track all your surfing.

While we’re supposed to “like” the crap out of the world wide web, the referrers are going to feed the “open” graph with far more data than only our clicks:  view volume is much higher than click volume. Knowing which websites we surfed on will prove far more valuable to build up the open graph.

Imagine the value of all that precious data for facebook. Ads with retargeting? No problem anymore. In fact, the whole open graph idea might be the very foundation of a new ad system which could be considered as AdSense on steroids. (Even though I believe that it will never reach the quality of “permission marketing” à la AdWords). And it’s just a question of time, when facebook’s going to release website analytics for the publishers (so long quantcast!!).

Unfortunatly, this idea is quite scary. Facebook is moving at a pace that political and social boundaries simply don’t. Let’s see how much further they can go.

The social fatigue might be close, brother.

(They already know, but you can still click the button for the fun of it!)

Click here to view the presentation on Slideshare

I gave this presentation at the Google Technology User Group on Monday  and I’d like to share it with everyone reading our blog.

So enjoy the photo of “Last Night’s Pizza” I took the same morning and see what REALLY happens when traditional web servers have too much to handle.

Really now – have fun and let me inspire you to make something.

So we’ve seen a couple of 2010 lists lately, but from a technical perspective, we think they were missing some important stuff. The following list is a snapshot of heated-up discussions in our company about things that could shake up the web development world in the year ahead.

1. Database wars: NO SQL vs. SQL

The unevitable rise of the NoSQL movement is already fully underway. New database concepts such as key-value based document-stores let web developers hope for more flexibilities, better scalability and less headaches. CouchDB and MongoDB, two of the most prominent representatives for these kinds of databases, are gaining massive popularity among the early adopter tech crowd and are already attracting some vc money (ok, that doesn’t count much).

What comes on the top of this is that MySQL – the largest and most popular SQL database – hasn’t had a new major version for years. Plus, it’s under Oracle’s control now, much to the discontent of developers who become worried about it’s open-source status. What’s left is a “save MySQL” initiative that undoubtfully reveals a decade-long dominance slowly fading away.

2. Mobile wars: iPhone vs. Android

We strongly believe that 2010 is finally the year of the android. Put the Nexus One aside for a second. Google doesn’t need to produce an uberphone like Apple, they simply wait for a bunch of phone manufacturer to release one Android-based phone after the other. Android is becoming the mobile OS for the masses.

Android’s momentum is strong and the OS has the characteristics to perfectly fit into the role of the iPhone counterpart. It’s free, it’s open, it doesn’t have Apple’s ridiculus application-approval process and it is equipped with superior home-grown software (like Google Navigator).

3. Traffic wars: SEO vs SEM

This will be a good year for google, especially considering the impact of their latest search engine updates to their core business, paid traffic. Obviously, the search engine is becoming more robust against SEO voodoo, and favors “high-qualiy” content from reliable sources. Let’s not forget that the uberabused no-follow tag and Twitter already massively disrupt the link graph.

In addition to that, the SEO space gets extremly crowded, and if your business or service is not niche enough, you might have no other option than entering the SEM game (which isn’t a bad thing).

Consequently, most keywords bids will likely increase over this year. Do you think keywords are already too expensive for your business? Think again, and start focusing on Conversion Rate Opimization and improving the interaction process with your customer.

4.  Design wars: Art Director vs. Machine

In the wake of an expanding cloud, with hundreds of web services created day by day, and the rise of niche eCommerce shops, we’re facing more and more websites that want to sell us things. But from what we’ve seen in the past years, fancy design contributes – if at all – only a small portion to the success of converting visitors to sales.

Take a look at the big companies, from amazon to zappos, you will agree that these websites do not really look pretty and even lack of clean functional design. These websites are driven by split testing and their appearance is decided by the resulting conversion rates rather than by an art director. Of course, algorithms still need human input, and knowing what to test is key to the success of the website optimization. But let’s face it -  art directors usually do not have this knowledge.

With tools (e.g website optimizer, omniture) and wisdom being spread around the web, and a hungry SEO crowd eager to find ways to increase revenue margins, we might see a slow paradigm shift in the mainstream: Away from the artistic approach to design, to a performance-driven, analytic approach.

5. Platform wars: HTML5 vs FLASH

The HTML5 topic is already beautifully hyped in the web and we have, for a small part, contributed to this hype :-) .

Traffic of several projects indicates that there is already a 50% market share for HTML5 compatible browsers. While this share is slowly raising, it is still too far away to consider HTML5 as a the platform of choice for generic websites, stores and blogs. However, we can expect a lot for specialized web services and applications, since HTML5 has a dramatic impact into the speed of development, ease of maintance and brings a broad scope of new functionalities. That said, we’re currently building a content management application with HTML5. No more IE6 hassle, you don’t know how good that feels.

We also see a bright future for Flash – but on a whole different battleground. Adobe has pushed Flash from the role of nice eyecandy to a solid RIA platform. By enabling to develop iPhone apps using regular ActionScript, things got more interesting with AIR and Flex.

6. Language wars: Clojure vs. Scala

A new set of languages is rising. While no sane developer would voluntarily choose PHP over Ruby on Rails or Django (or any of the other frameworks in Ruby and Python), the alpha geeks are already playing with their new toys, Scala und Clojure. While Ruby and Python introduced powerful flexibility and demonstrated that flexibility does not necessarily come at the expense of stability, Scala and Clojure have powerful built in concurrency features, Scala calling them actors and Clojure providing agents. With a rising number of CPU cores these languages could finally emporer developers to utilize parallel architectures efficiently and maybe leave our friendsters Ruby and Python as “ye olde” languages if they don’t catch up.

The biggest difference between both languages is that Scala is statically typed while Clojure favours duck typing. Syntactically Scala borrowed a lot of ideas from Smalltalk and Ruby, Clojure is based on Lisp. Both languages are pretty nice, especially Clojure can be used very expressively, though Scala seems to have a little more momentum. Both Scala and Clojure are based on the Java Virtual Machine, which makes them easy to integrate into existing Java Systems, easier to sell to clueless executives and provides them with a giant pool of available libraries right from the start. Last but not least, they can both be used to develop for the Android Platform.

We’re excited to see where 2010 will lead us and what surprises it might hold for the development community.

Last weekend the whole staff went to rails camp germany 3 at ZweiTag/Münster. It was nice to see how many people showed up and we’ve seen many things – also many non-rails topics. We were pretty excited to introduce a very early alpha  of our open source content management system VRAME to the public.

The first session was about Ruby in general and app development with MacRuby. It is very hot and everyone’s eager to see it running on the iPhone.

The next session was about CouchDB. NoSQL was a very strong meme at the rcg3. It’s a cool thing to see people running CouchDB or MongoDB in their production environments. For those who are unsure about the benefits, here’s a good further reading about NoSQL Patterns. For those who are skeptical – there is also a dark side of NoSQL.

Many people joined our session. We’re surprised there a so few competing Rails-based CMSes (Radiant, BrowserCMS, Adva). Together with VRAME we also introduced our authentication engine which can be used independently from VRAME.

In the testing session we’ve had a few insights on acceptance testing with Cucumber, WebRat and Selenium Grid. For those who don’t know the trio infernal: You write acceptance tests with Cucumber in a natural language, you use the webrat library (which has tons of step definitions out of the box) and then you run the tests in parallel on several virtual boxes directly in the browser (yes even the really filthy ones). In opposite to pure WebRat testing you can test complicated AJAX features as well.

In the last session we talked about gems and plugins. We sadly found out that authlogic is not the latest and greatest thing anymore. The new koolaid is warden and devise. There is a good blogpost about warden and devise which expains the differences to clearance and authlogic. Seemingly there are a lot of authentication gems and engines out there e.g. Declarative Authentication or ACL9 just to name a few.

But there is tons of other good stuff goin’ on: Pacecar is an active record extension which adds named_scope methods and other common functionality to ActiveRecord classes via database column introspection. If you want to hack’n’slice on RSS feeds you might want to check Feedzirra out. If you need databased controlled settings in your rails app, try rails-settings. If you need semantic form validation then you’ll probably like formtastic. Vestal versions is for those who need their models to be versionable. If you need nice URLs on your resources, friendly-id is a very good at that. If you want to check out if these gems are ruby 1.9 compatible, check out isitruby19.com.

We ended the evening in the Pier House with great burgers and lots of nice talks about general geekery (and major foo).

If I forgot something (which I probably have done) please leave a comment and I’ll update the post. And last but not least a big thumbs up to the sponsors Xing, Wunderloop, Rails Konferenz, Sonntagmorgen und Zweitag. The photo was taken by unimatrixZxeros. If you want to know more about rcg3 check out all the tweets out there.

PS: A lot of people asked about our T-Shirts – you can download the motives here.

Convert a video to ogg

The best way to convert a video to ogg is FireOgg. It is a pritty nice FireFox plugin which provides you graphical user interface to convert the video. Very straightforward.

Convert a video to mp4/m4v

This one was more tricky. There a plenty of tools out there Handbrake, Mencoder or the grandmaster ffmpeg. After some struggling, a huge amount of earl grey tea and a lots of error messages we figured out that little snippet to convert the video:

Note: You have to carefully look at the input dimensions there is a difference between PAL (320x256) and NTSC (320x240) - in some cases you have to adapt the parameter.

The <video> tag

We simply add the video tag with controls and some autobuffering (so we can immediately start watching) and spice it with two source tags. One for ogg and one for mp4/m4v:

The Mime-Type hazard

When trying to look at our precious results we refreshed the browser... and nothing happened. Deep in my mind I remembered that the most webservers (probably including mongrel) does not support to provide the correct mime-types for ogg files. And the browsers on the other hand are very picky and follow the strict rule "no mime-type, no entertainment". So we added the mime-types at serveral places - for the completeness I listed all major webservers:

Rails

Just add these lines to the initializer in config/initializers and don't forget to restart the server:

Apache

Just edit/create a file conf.d/mime-types and enter these lines

Lighttpd

Same here etc/lighttpd/lighttpd.conf

NGINX

or here /etc/nginx/mime.types

I hope you enjoyed that little blog post. If we missed out some information just write us a comment and we gonna update the blogpost.

Further reading:

http://diveintohtml5.org/video.html
http://html5doctor.com/the-video-element/

Well, now, here it is. The magic of a pillowfight in slowmotion. It took a while to edit and cut the footage we took during this year's pillowfight in nyc (probably the largest pillowfight in the world), so we're a little late with the release.

You might wonder about two things:

First, the background music comes from nyc-based group ida, the song's title is 'Late Blues'.

Secondly, the footage was taken with the Casio Exilim EX-F1 - a digital camera with this subtle and stunning feature to record videos with 300 frames per second with a reasonable resolution (512 x 396 - good enough for webpublishing). Before the release of the Casio Exilim, this feature could only be found on extremely expensive cameras.

We got the camera just a few days before the pillow fight, so there was not much time to test the camera and get used to its abilities.

That said, I think the results are fantastic, even though part of the footage could need some color filtering.

Unser HTML5 Experiment war ein voller Erfolg, wenn wir uns allerdings unsere Statistiken anschauen, dann kommen die meisten unserer Besucher aus den USA und dem Rest der Welt. Deshalb haben wir uns dazu entschlossen das Experiment noch einmal in einem deutschen Kontext zu starten.

Vielen Dank an das Trendbüro und den Duden, dass wir das Szenesprachenwiki dafür benutzen konnten. Um das Experiment anzuschauen benötigt man einen aktuellen Browser wie den FireFox 3.5, Safari 4 oder Google Chrome - also bitte umsteigen, oder updaten ;-)

Klickt hier um das Experiment zu starten.

Links: Trendbüro (Büro für Wertewandel), Duden, Der Szenesprachenduden als Buch

The results of the "red dot award 2009" have arrived. 6.112 works of designers and companies from 42 countries were submitted. And we received one for szenesprachenwiki.de!

Szenesprachenwiki is a wiktionary for new words which have not been recognized by the German Duden (standard German dictionary), even though they are part of everyday language. Each submitted word is searched for using both Google and Twitter. Why? Only words with actual search results can be submitted! (On a side note: That is one great spam filter) Before being published on the website, all words are being checked and refined by experts. Successful submissions will be communicated to the author's Facebook (via Facebook Connect) and the wiki's Twitter profile. In late September there's going to be a book featuring the site's collective submissions!

The website itself is designed as a HTML/Flash hybrid. We're using Flash for eyecandy animations and advanced UI elements. The backend is programmed in Ruby on Rails (yes, Rails can scale!). There also is a mobile version - just visit the site with your iPhone!