First GWT Steps
Just started to work with GWT – a pretty interesting approach for web development compared to PHP or JSF. The whole Application engine is quite impressive especially allowing you to quickly test your applications locally by supporting automatic hot deployment after each code update.
One thing that took me a while was one of that “[ERROR] Unable to find ’[some-file].xml’ on your classpath; could be a typo, or maybe you forgot to include a classpath entry for source?” errors. If you are sure the file is in place I found restarting the App Engine or Eclipse mostly solves that problem.
fixing flex VideoDisplay CuePointManager
I was creating a Flex application to show slides and a presentation video of previously recorded presentations. Accordingly, each slide should appear at a certain point of time in the video – calls for cue points!
As all slides and there appearance are stored in a text file in my case, I started adding cue points with ActionScript. But as soon as the video can be controlled with a slider, allowing to shift for- and backwards, the event handler “cuePoint” was not triggered any more. Thus, the slides where not changed correctly as the user jumps ahead, as the cue points between the previous and the new position did not cause and cue point event.
Finally I wrote AdvCuePointManager, inheriting from CuePointManager, but which can deal with jumping back- and forward.
Copy it to “<your source folder>/net/svenbuschbeck/flex/video” and use it as follows:
<mx:VideoDisplay cuePointManagerClass="net.svenbuschbeck.flex.video.AdvCuePointManager" />
flickTrick
The flickr Services API is quite amazing. So I made a little application called flickTrick using phpFlickr.
tI is capable of producing either image mosaics on the basis of public photos of a given flickr account, or it it can generate a collage as the one you can see in the header part of this page, by simply adding follow CSS to it.
background-image: url(http://svenbuschbeck.net/flickTrick/collage.php?username=sven%20buschbeck&width=500&height=200&size=square&shuffle=true&maximum=24&alpha=40);
— edit 2009/03/15 —
As creating a collage can take several seconds, I implemented a caching version. It firstly returns the last image stored for the given parameters and then creates a new image. This version can be accessed by using “fast-collage.php” instead of “collage.php”.
oidviz
What we do here in the Okkam project, is creating an global infrastructure, allowing to give an unique name to anything. We called it ENS (Entity Name System), inspired by the DNS (Domain Name System). Why? Because having everything named and all occurrences in a document annotated with this name makes data integration as easy as pie. But names in a computer science environment are URIs and those are not human-readable by default. For example http://www.okkam.org/entity/ok923bf64b-3edf-4d0a-baf8-592db9f55689 is my name! 
– for sure no one is able nor willing to memorize this. As a first approach to this, I created a little PHP script, that can produce an image representing those names, or ENS identifiers or Okkam IDs (in short OID) as we call them. This resulting image should be much easier to be remembered an recognized.
The upper one represents me and the one below Stefano Bortoli, a friend and colleague of mine. Several dimensions have been used, like color, size, position and line-width. As a next step, besides improving creation speed, patterns and shapes could be introduced and even motion by exchanging the PNG image either with an old-fashioned animated GIF or a Flash animation. Integration is kept as simple as it can be, e.g. by simply inserting <img src=”http://okkam.dit.unitn.it/oidviz/?oid=[put your ID here]“/> into your XHTML page. The PHP script returns a bit stream, as if you would load an existing image directly from a server but instead it is created on-the-fly.
use all your fingers
multi-touch!
Heard about those home-made multi-touch screens using infrared LEDs? We did it
projects: coherences experiment interactive similarity UI visualization
2 comments
magnet v0
I finished the first prototype implementation of magnet, a generic tool to visualize coherences/similarities between enities of any data set.
sign selector
While testing some ideas for a jukebox application for my “media center” computer, I came to a point, where the user should be able to select an interpret or song from a huge list. If he knew the exact name, scrolling through a sorted list should be ok, but still a way to narrow the list by typing some initial letters would be much faster and convinient. This should not be difficult on a thouch screen, but as I also wanted this application to work on mouse-only devices, as a keyboard was for example too space consuming in my configuration. So I ended up trying to find an interface component, allowing an user to enter a view letters with a pointing device like a mouse or a track ball.
It is basically a pop-out technique, but making use of moving the mouse pointer in two dimensions, than the common linear approach. Operatiing this first prototype version on the left is still a little rough though.
Aquaris – three teams, two payers each, custom-built game controller
Aquaris is a game dedicated to teach and inform about renewable energy technologies and energy-saving measures to children of the fourth grade. Aquaris was intended to be set up in a small museum,owned by an electricity producing company. Private guided tours about the topic mentioned before where offered for whole fourth grade classes at once.
For those reasons, three requirements were defined:
facts
- easy to learn game flow, due to minimal complexity of gameplay
- easy to use, custom made controller
- a whole class of up to 30 children can play within one hour
- children learn in a playful way as knowledge pays off in our game
- to cope with minor reading problems, mostly audio is used instead of text
advantages of the controller built at a glance
click to see a 3D animation about placement and function of the controllers
- form follows function: the cursor on the screen follows one to one the controller handle
- no button functions need to be learned, all interactions necessary to play the game can be performed moving the handle
- each controller device is placed accordingly to its cursor on the screen
- very precise
- only needs to be calibrated once at setup time
- no influences of environment
Or click here to see a low quality (1mb) 3D animation version.
Dream Worlds — Traumwelten
This movie was a big challenge for me, because although I was the worst drawer in the whole group for sure, I got the chance to do the drawings for the movie. Some sleepless nights with a pencil, quite some sheets of paper and some pots of fruit tea — but finally, this small movie became something beautiful and unique and I ended up quite happy and proud . The video part and the coloration of the drawn part was done by collegues.
Content and navigation as zoomable UI and masked floating layer
See the Zoomable UI/floating layer navigational approach of my old (unmaintained!) home page (in german).
This version of my homepage features a new navigational concept combining the idea of zoomable interfaces and a masked floating layer. I created this application as experiment while searching for concepts and idea about how to integrate contents and navigational layer.
After informal feed back of user i asked to give it a trail, I had to find, in the end, this RIA will stay more an experiment than a easy to use information portal.
The text and media contained is in german and has not been update ever since, additionally the guest book is deactivated. Therefore give it a trail but do not take the content serious .
Ikarus
My first movie! A stop-motion movie about a bird. It is horribly much work — approximately one hour to do one second of film, but it would always do it again!
But see yourself below!