Categories
Actionscript Adobe Air fh wiesbaden flare Flash flex Hochschule RheinMain Multi-Touch Tangible Interfaces Visualization

Vispol Tangible and Multi-Touch Interface Video

This video presents the results of the Bachelor thesis of Frederic Friess at the Vislab of the Wiesbaden University of Applied Sciences. I have been Frederic’s mentor under the guidance of Prof. Dr. Doerner for this work.

Categories
Actionscript Announcement django Flash flex Multi-Touch Portfolio Tangible Interfaces Visualization

Pf Design Media Installation

I helped Sensory Minds to build an interactive multi-touch and tangible media installation for a Werkschau of students from the Hochschule Pforzheim. Graduates are represented by objects that are provided with a fiducial on the underside and a picture of the work on the upper side. As soon as the object is added to the table, pictures of the student’s projects will be loaded and circularly arranged around the object. Those pictures can be browsed via multi-touch. If a user taps on a project picture all pictures to this project will be loaded and will be arranged on a second circle around the project images.

Categories
Actionscript Adobe Air flare Flash flex Hochschule RheinMain Visualization

Vispol Multi-Touch Video

This video demonstrates the fundamental multi-touch functions of Vispol. The demonstrated functions contain the creation and modification of persons and objects and connections. Additionally, examples for the application of the layout functions in Vispol are being introduced.

Click here for further information about Vispol.

You can try out the mouse version of Vispol here.

Categories
Announcement Flash flex Hochschule RheinMain Multi-Touch Portfolio Visualization

My Master’s Thesis Project: Vispol – An Interactive Scenario Visualization

As part of my Master’s thesis with the title Conception, Realization and Evaluation of Multi-Touch Interfaces for Interactive Visualizations, there has been the goal to create an interactive visualization that can be used via multi-touch. Finally, this visualization should be evaluated, which means it should be thoroughly tested and there should be some results in numbers.

Videos:

Vispol on Sensory Mind‘s Round Table:

Paper: Read a summary about Vispol in this paper.

Desktop version:
Try out Vispol (Flash necessary)

Background information:
This multi-touch visualization should be different from the common multi-touch use cases scaling/rotating images and zooming in maps. Additionally, this visualization should have a dedicated use and should not just be a prototype that demoes basic multi-touch capabilities.

Vispol
Vispol

I have been intrigued by the interactive visualizations in Minority Report, which provided natural user interaction for profiling activities of a policeman in future.

Categories
Actionscript Adobe Air Flash flex

Calculate and Set Bounds (Bounding Box) from Points in Google Maps Flash [Update]

I’ve got a list of points in my database, which I want to show neatly in a Google Maps Flash Map.

Thus, I …

  1. calculate the bounding box around these points
  2. calculate the center of this bounding box
  3. set the zoom level of the map in a way that the zoomed cutout contains all points
  4. set the center of the map
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
//1.
var bounds:LatLngBounds = new LatLngBounds();
for each(var mapObject in tripMessages){
    var currentLatLon:LatLng = new LatLng(mapObject.latitude, 
	                                       mapObject.longitude);
    bounds.extend(currentLatLon);
}
 
//2.
var center:LatLng = bounds.getCenter();
 
//3.
map.setZoom(map.getBoundsZoomLevel(bounds));
 
//4.
map.setCenter(center);
Categories
Actionscript Adobe Air Flash flex

Figure out if you are using AS3 code in an Adobe Air application

I use my code in both an Adobe Flex and in an Adobe Air application. As I want to use the native menus of Adobe Air I want to prevent that my self-built menu is being added to the Air application. Thus, I need to figure out if the code is running in a Flex or in an Air application. I do this by using the following structure:

var airApp:Boolean = false;
try{
if(NativeApplication.nativeApplication) airApp = true;
}catch(error:Error){}
if(!airApp){
addChild(generalMenuSprite);
}

Categories
Flash Hochschule RheinMain Visualization

Wivi: Wikipedia Visualization

Simon Lehmann, a fellow student of mine from the visualization classes of the Computer Sciences department at the Wiesbaden University of Applied Sciences, has created the very nice Wikipedia visualization Wivi in the work of his Diploma thesis:

Screenshot of Wivi
Screenshot of Wivi
Categories
Actionscript Flash

Save XML and text files from Flash to your HD with AS3 and PHP

In this post I’ll show how to save a file from AS3 to your local HD. In another post I’ve explained how to load a file from HD to Flash.

For a project I’ve been looking around for a decent solution to the problem of saving a text file (to be more precise XML file) from Actionscript 3 to my local harddisc but i couldn’t find a solution for this (what not necessarily means that there is none).

Saving and loading can be smoothly achieved with Adobe Air but not with Flash because Flash has been designed to run on the web. However, it is possible to download and upload files via AS3 on and from your HD to and from a webserver. Think of an Flash MP3 shop: You can click on an MP3 in Flash and you will be asked where to save the file and afterwards the file is being downloaded to the chosen location on your HD. So it must be somehow possible.

Additionally, it is possible to create XML or other text in Flash and store it on a webserver and vice versa.

Thus I came upon following solution:

Howto save and load text files with AS3
Figure 1: Howto save and load text files with AS3

Categories
Actionscript Flash flex Multi-Touch

Google Maps Multi-touch Actionscript Code [Update_3]

Google Maps multi-touch image

After I published my youtube video on the Google Maps multi-touch app I have had some demands for the source code of this Google Maps multi-touch Flash application. Hence, I have decided to make the source code of it publicly available on Google Code. You will find the sources on the mapstouch Google Code download page.

To be able to use it you need to generate your own Google Maps Api key. Use this explanation on how to tweak the code and choose the appropriate URL for your API key in order to prevent the red DEBUG strings (you can still see those strings on the screen in the image on the top of this post):

Put your own Google Maps API key in the variable map.key in the class GoogleMapsPureAS. Use the qualified name of your computer in the URL e.g.

http://johannes.local/googleMapsMultitouch

and not

http://localhost/googleMapsMultitouch

to get rid of the red DEBUG strings on the screen. Additionally, opening the SWF file in the Flash Player is not possible if you don’t want to see the DEBUG string. Open it in your browser under the appropriate URL where your Google Maps API key has been registered for.

If you have got more questions just ask them in the comments.

Update: You need the Google Maps for Flash API that you can download here. You have to include the swc file from the folder lib of the uncompressed sdk.zip file either in your Flash GUI or put it into the libs folder of your Flex Builder project.

Update 2: Please beware that executing Google Maps on a local computer or in the intranet seems to be not committed according to Google’s license agreements (see comments).

Update 3: I’ve posted another (even more detailed) explanation how to remove the DEBUG strings in the forum of the nuigroup.. Additionally, i’ve updated the Downloads on the mapstouch Google code page.

Categories
Actionscript Flash Multi-Touch

Digital Volvelles application video

Quite some time since the actual private view at the Mall Galleris in London I have managed to put a little video about our Digital Volvelles application online. A more detailed video is going to come but until then watch this video please: