loading

Archive for August, 2006

watz

Tile-based output of huge raster images

Demo of high-res tiled image output: KugelTiled04 res demo

I've been able to generate huge raster files for print use from Processing, using the tiling trick first outlined on the Processing forums by user "surelyyoujest". Using his code as a base, I got it working with OpenGL and proceeded to output some gigantic files. A quick hack using PImage allowed me to stitch the resulting tiles together in one huge image, which was then saved as a Targa file.

See the picture above for a demo. When viewed at its original size, the left half of this image shows the full picture at 10% (original res 10240 x 7680 px). The right half shows the whited-out section of the left image at 100%. The resolution is staggering.

This should clear the way for doing huge prints, without not having to worry about PDFs not showing 3D correctly (see previous post). I will post sample code for tile-based rendering and stitching as a library when I have time.

eskimoblood

Digital Media Design - Processing

Utilising processing (www.processing.org) students were able to take a live camera feed and use movement/ interaction within the space in order to change the projection. Students responded to creating a persona with architectural elements, in this case a blank wall that responded in certain ways towards inhabitation.

Visit www.jamesshaw.co.nz for more info

Author: jamyshaw

Keywords: interaction design processing

Added: August 30, 2006

Quasimondo

Flash Filter Lab

After a year of development Visual MINDS Studio have just launched a very interesting project called Flash Filter Lab. It allows to create experimental Flash visuals with a patch based system. So instead of programming with code you can visually connect functional modules with wires.

The whole lab is Flash based and online. Experiments can be saved and even downloaded with the fla + swf files to be run standalone or included in other projects. The lab is embedded in a community with a gallery and the option to vote on other peoples creations.

watz

It’s official: Flickr Map

060830_flickr_map.jpg

An official Flickr geotagging solution: Flickr Map

A built-in official Flickr solution for geotagging has been rumored for a while now. With the launch of Flickr Map two days ago it's a reality, simply navigate over to flickr.com/map and start surfing. Geotagging is done through the Organizr, which now has a new tab called "Map". Pre-existing geotagged images aren't automatically imported, you have to go into Organizr and request that your images be added.

One truly great feature is the addition of a "Map" link on the pages for sets that have geotagged images. See a map of my recent New York photos for an example. This is probably the best way of looking at geotagged images right now, for reasons I'll explain below.

Having a definitive supported solution should provide a big boost for geotagging, as well as make it a whole lot easier for the non-expert part of the community. But the implementation is still a matter of taste. The Flickr geotagger community is currently figuring out what to think:

Not everybody is happy about the Flickr / Yahoo link. Flickr Map now becomes a potential killer app for Yahoo Maps. Apart from political considerations, Yahoo and Google cover different geographic regions with varying levels of detail, and for some users geotagging using Yahoo Maps is impractical because their country is not covered. This is a well-known issue, and will hopefully be resolved by map services becoming more advanced.

Flickr Map eschews the established practice of geotag triplets (geo:lon, geo:lat, geotagged). Instead it stores the information internally. While this makes for a prettier Flickr interface without unsightly tags, it also makes the data harder to get to. While an expanded Flickr API will provide access to the geotag info, some prefer the old style. See this discussion for pros and cons. Personally I lean towards keeping the tag triplets, perhaps with the option to hide them from view.

Personally, I find the interface a little too clean and unexciting. That might seem like a frivolous comment, but is quite seriously meant. Flickr's success owes much to it's "it's about the pictures" interface. But in Flickr Map they are strangely absent. Instead pink dots indicate locations where pictures can be seen, and clicking on them produces a small pop-up interface with a browseable stream of pictures at that location.

Photos are shown as tiny thumbnails, making them visually unspectacular. Worse, the "next / previous" browsing interface is clumsy and boring to use. It feels like a road-finding exercise when it should have felt like a magical new way to explore pictures. My two cents would be to include images in a more obvious and user-friendly way, for instance through popup thumbnails. Seeing a number on a pink dot on a map tells me that there are pictures there, but the lack of a preview means there is no way of immediately getting an idea of what they look like.

Presumably, the quality of the interface will improve over the next few months. For now, using the "Map" link on photo sets is far superior to aimlessly surfing around the global map. The set maps are already zoomed to the region given by the tags, and so provide a much better experience.

I would also like to recommend trying loc.alize.us as an alternative, it's a great service which I've meaning to blog for a while now.

Mike

3D Surfaces in Processing

eskimoblood has released a nice Processing library for 3D surface rendering. The possibilities are illustrated in this Flickr photoset, and in this video in which a surface pulses and deforms in time with music. Paul Bourke’s site has a large…

3D Surfaces in Processing

eskimoblood has released a nice Processing library for 3D surface rendering. The possibilities are illustrated in this Flickr photoset, and in this video in which a surface pulses and deforms in time with music.

Paul Bourke’s site has a large gallery of surfaces and details on the equations that describe them.

Andreas

Offiziel geotaggen

Nach dem es ja schon seit einiger Zeit die verschiedensten Tools gab um seine Bilder bei Flickr mit Geokoordianten sogenannten geotaggs, zu versehen, ist diees feature nun fester Bestandteil des Flickr Organizers. Dieser Screencast zeigt wie’s geht. Das ganze ist so einfach wie drag’n drop nur sein kann.

via flickrBlog

Nachtrag

Da flickr zu yahoo gehört wird für das ganze natürlich auch deren Kartenservice yahooMaps genutzt. Was auch schon eins der größeren Probleme ist. Die Straßendaten für Deutschland sind ein Witz und sehen aus als ob sie von einer 100.000er Topkarte abdigitalisiert wurden. Auch die Qualität Satelitenbilder sinkt auserhalb der großen Städte ins unbrauchbare ab.

Bisher wurden die Koordinaten in den Tags geo:lat und geo:lon gespeichert. Nun werden die die Geodaten als Datenbank Eintrag von flickr verwaltet und erscheinen nicht mehr in der Tagliste. Daraus ergeben sich einige Probleme aber auch Vorteile für die unzähligen mashUps die diese Daten auswerten. Der Hauptnachteil sind sicherlich die Doppelungen die jetzt entstehen, es gibt Bilder mit den alten Tags und Bilder mit dem neuen DBeintrag. Flickr wird in der nächsten Zeit ein Tool anbieten, dass die Konvertierung der alten Tags ermöglichen soll. Der größte Vorteil ist sicherlich die bessere Abfragemöglichkeit der Daten über die Flickr API. Bisher war es nicht möglich sich alle Bilder in einem bestimmten bereich anzeigen zu lassen. Was auch der größte Nachteil vom Speichern der Geoinformation in den Tags war. Dafür gibt es jetzt das optionalen bbox Argument in der flickr.photos.search Abfrage. Diese filtert die Fotos an Hand der übergebenen bounding box Koordinaten.

Ein nettes Feature ist die Möglichkeit mehrere Fotos auf einmal auf die Karte zu ziehen und Fotos an andere ansnappen zu lassen.

technorati tags:, ,

watz

Code - CopyPasteTool.pde

I found a simple tutorial over on Java Practices that demonstrated the use of the system clipboard for transferring text between applications using copy / paste. I'm using it to copy color values from an improved version of SimpleColorPicker.pde.

The CopyPaste class described in the code can be dropped into any Processing sketch to provide access to the clipboard.

Source code - CopyPasteTool.pde

// CopyPasteTool.pde
// Marius Watz - http://workshop.evolutionzone.com
//
// Code for transferring strings via the clipboard using copy / paste.
// Useful for simple inter-app communication.
 
// Java classes needed for copy / paste functions.
import java.awt.datatransfer.*;
 
CopyPaste copypaste;
 
void setup() {
  copypaste=new CopyPaste();
}
 
void keyPressed() {
  // If 'c' is pressed the Hex string for the current color is copied
  // to the clipboard.
  if(key=='c') transfer.sendString("Test "+(int)random(1000));
  if(key=='v') println("From the clipboard: '"+transfer.getString()+"'");
}
 
 
// 
// The following code provide for sending and receiving strings 
// via the system clipboard using standard copy / paste. This class 
// can be copied into any Processing sketch, ready for use.
//
// Based on code found at http://www.javapractices.com/Topic82.cjp
 
class CopyPaste implements ClipboardOwner {

  public void sendString(String s) {
    StringSelection stringSelection = new StringSelection( s );
    Clipboard clipboard = Toolkit.getDefaultToolkit().getSystemClipboard();
    clipboard.setContents( stringSelection, this );
  }

  public String getString() {
    String str="";

    Clipboard clipboard = Toolkit.getDefaultToolkit().getSystemClipboard();
    Transferable contents = clipboard.getContents(null);
    boolean hasTransferableText =
      (contents != null) &&
      contents.isDataFlavorSupported(DataFlavor.stringFlavor);
    if(hasTransferableText) {
      try {str=(String)contents.getTransferData(DataFlavor.stringFlavor);
      }
      catch (Exception ex){
        System.out.println("Exception: "+ex.toString());
        ex.printStackTrace();
        str=" ";
      }
    }

    return str;
  }

  // Necessary method, but does nothing
   public void lostOwnership( Clipboard clip, Transferable data) {
     //do nothing
   }
}
watz

SimpleColorPicker.pde

Here is the code for a simple Processing GUI utility for editing color palettes. It generates gradients given a start and end color. It will print palettes as hex strings and RGB triplets, change the "prefix" and "suffix" variables to turn the output into readymade code.

I whipped this up to make it easy to make decent color combos for a current project I'm working on. It could do with a few more features, like a 2D RGB color field to choose from and the ability to save and maybe even load files. It feeds into a color library I use, maybe I'll make that available at some point to make it a bit more useful.

Source code - SimpleColorPicker.pde

// SimpleColorPicker.pde
// Marius Watz - http://workshop.evolutionzone.com
// Interactive creation of gradient palettes.
// Will print palettes as hex and RGB triplets.
 
// Select either left or right side of the gradient boxes
// to edit that color.
 
// By pressing 'd' the "dropper" mode is activated, clicking
// on a color will fill the currently selected slot with that
// color.
 
int rgb[][];
float R,G,B;
int sel,numrows,barTop,barRight;
boolean isDropper,whiteBG=false,edited[];
PFont font;
 
void setup() {
 size(10*20+15,10*20+200);
 font=createFont("Arial", 10);

 numrows=10;
 rgb=new int[numrows*2][3];
 edited=new boolean[numrows];
 for(int i=0; i<numrows; i++) {
   fillRGB(i*2, 50,50,50);
   fillRGB(i*2+1, 255,255,255);
   edited[i]=false;
 }

 R=50;
 G=50;
 B=50;

 sel=0;
 barTop=20*10+60;
 barRight=10+9*20+5;
}
 
void draw() {
  float rD,gD,bD,r,g,b;

  noStroke();
  if(whiteBG) background(255);
  else background(0);
 
  // draw title
  fill(0xFFEBAC32);
  rect(0,0,width,20);
  fill(255,255,255);
  textFont(font,10);
  text("SimpleColorPicker 0.9", 10,13);

  // draw selection
  if(sel!=-1) {
    if(isDropper) fill(255,0,0);
    else fill(255);
    rect(10+(9*20*(sel%2))-1,30+20*(sel/2)-1, 17,17);
  }

  // draw color boxes
  for(int i=0; i<numrows; i++) {
    rD=(float)(rgb[i*2+1][0]-rgb[i*2][0])/9f;
    gD=(float)(rgb[i*2+1][1]-rgb[i*2][1])/9f;
    bD=(float)(rgb[i*2+1][2]-rgb[i*2][2])/9f;
    for(int j=0; j<10; j++) {
      r=rgb[i*2][0]+rD*(float)j;
      g=rgb[i*2][1]+gD*(float)j;
      b=rgb[i*2][2]+bD*(float)j;
      fill(r,g,b);
      rect(10+j*20,30+i*20, 15,15);
    }
  }

  // draw big color field
  fill(R,G,B);
  rect(10,barTop+10, barRight,30);
 
  // draw smaller contrast color field
  int sel2=sel+1;
  if(sel%2==1) sel2=sel-1;
//  println("sel "+sel+" sel2 "+sel2);
  fill(rgb[sel2][0],rgb[sel2][1],rgb[sel2][2]);
  rect(10,barTop+40, barRight,10);

  // color bar background
  fill(60);
  rect(10,barTop+60, barRight, 10);
  rect(10,barTop+75, barRight, 10);
  rect(10,barTop+90, barRight, 10);
 
  // color bar foreground
  fill(255);
  rect(10,barTop+60, barRight*(float)R/255, 10);
  rect(10,barTop+75, barRight*(float)G/255, 10);
  rect(10,barTop+90, barRight*(float)B/255, 10);

  // draw title
  fill(0xFFEBAC32);
  rect(0,barTop-25,width,20);
  fill(255);
  text("'p' to print palette, 'd' to use dropper", 10,barTop-12);
}
 
void printColors() {
  // change this to add readymade function calls for pasting into your code
  String prefix="";
  String suffix="";

  println("");
  for(int i=0; i<numrows; i++)
    if(edited[i]) {
      print(prefix);
      print("""+getColString(i*2)+"", ""+getColString(i*2+1)+""");
      println(suffix);
    }
 
  println("");
  for(int i=0; i<numrows; i++)
    if(edited[i]) {
      print(prefix);
      print(getColStringNumeric(i*2)+", "+
        getColStringNumeric(i*2+1));
      println(suffix);
    }
}
 
String getColStringNumeric(int id) {
  String s;
  s=""+rgb[id][0]+", "+rgb[id][1]+", "+rgb[id][2];
  return s;
}
 
String getColString(int id) {
  String s=Integer.toHexString(color(rgb[id][0],rgb[id][1],rgb[id][2]));
  s=s.substring(2).toUpperCase();
  return s;
}
 
void mousePressed() {
  int mx=(mouseX-10)/20;
  int my=(mouseY-30)/20;
  if(mx<10 && (my<10)) {
    mx=(mx/5);
    int newsel=my*2+mx;
    if(isDropper) {
      fillRGB(sel, rgb[newsel][0],rgb[newsel][1],rgb[newsel][2]);
      R=rgb[sel][0];
      G=rgb[sel][1];
      B=rgb[sel][2];
      isDropper=false;
    }
    else {
      sel=newsel;
      R=rgb[sel][0];
      G=rgb[sel][1];
      B=rgb[sel][2];
    }
//    println("mx "+mx+" my "+my+" "+(mx/9)+" sel "+sel);  
  }
  else {
   my=(mouseY-(barTop+60))/15;
   if(my<3 && my>-1) {
     mx=mouseX-10;
     if(mx<0) mx=0;
     else if(mx>barRight) mx=barRight;
     float val=(float)(mx*255)/(float)barRight;
     if(my==0) R=val;
     if(my==1) G=val;
     if(my==2) B=val;
     if(sel!=-1) fillRGB(sel, (int)R,(int)G,(int)B);
     edited[sel/2]=true;
//     println("mx "+mx+" val "+val+" R "+R+" G "+G+" B "+B);
   }
  }
}
 
void mouseDragged() {
  mousePressed();
}

void keyPressed() {
  if(key=='p') printColors();
  if(key=='d') isDropper=!isDropper;
  if(key=='b') whiteBG=!whiteBG;
}
 
void fillRGB(int id, int r,int g, int b) {
  rgb[id][0]=r;
  rgb[id][1]=g;
  rgb[id][2]=b;
}
thinking on digital tools

PSP has been completely hacked

Well, I am watching of the PSP hacker and homebrew scene for a few months now. When I started I bought a PSP with the firmware 2.50 and needed the orginal UMS of Grand Theft Auto to load the eLoader that emulated the Firmware 1.0. This procedure always needed 5-7 Minutes. Last week I became aware that there is a downgrader for my firmware available and I successfully downgraded my machine. Now I can instantly run homebrewed stuff, like my pixeleditor Smoove, making the PSP very useful for me right now.

Today I read on PSP Hacks, that there is a new exploit available, even for the latest firmware version 2.80. That means, that all currently available PSPs are able now to run self-written, homebrewed code. It took the scene only about four months to hack everything that is 2++. The creativity and the will to explore of hunderts of hackers beats the restrictions programmed by only some engeneers at Sony.

Please also have a look at scnclr, an artistic project I made with the pixeleditor smoove PSP.

blog.blprnt.com - Processing

tree.growth : The Last Stand

It has been almost a year since my tree.growth exhibit opened in Vancouver, and six months since the exhibit in Budapest.

To wrap things up, I am selling one last round of prints, this time of two of the trees exhibited at EvoMUSART. This will be the last chance to purchase prints from this series.

This is a fundraiser of sorts for my next exhibit, which will be a series of prints from my colour.economy project. 

flower.tree (click for full image)

  • 36" x 20" - Edition of 5 - $180 each
  • 18" x 10" - Edition of 10 - $50 each

flame.tree (click for full image)

Peter Kirn

Jiggly, Goo-Like Image Distortion: Quasimondo’s Rubber Screen, in Processing

Apologies to anyone who’s on Processing overload, but we keep finding fantastic work. Quasimondo’s Rubber Screen maps an image to a 3d mesh and then lets it jiggle like hyperactive Jell-o. The still image doesn’t do it justice; you have to try it out. Like the 90s app Goo, you can warp images in comical ways. Unlike Goo, though, everything happens in real-time, with physically-realistic animations and various cool tools. This also gives me hope for the possibilities of coding physical dynamics and fluid models in Processing and Java. (Sadly, no source code, but just playing around with it should spark some ideas.)

I know there are other projects similar to this. Got a favorite? Let us know. , , , ,

jesus gollonet

JEdit for ChucK

In my never ending search for a one-size-fits-all code editor, I’ve been trying JEdit for the last couple of weeks.

Reasons? With some plugins, it’s said to be a good choice for ruby on rails; toxi published an edit mode and a lot of abbreviations which speed up the work with processing; it’s multi-platform; and the most important thing, it is extremely configurable, while not being as fat as eclipse.

Until the recent release of the miniaudicle for windows there were little options for syntax highlighting of ChucK files in this platform, so, using a couple of edit modes from languages that I know better, the ChucK reference and some help from chuck-users, I’ve made a ChucK edit mode. This means that now i have syntax coloring for keywords, ugens, methods and operators.

screenshot of jedit with a chuck file

(Note: the awful colors correspond to the moment in which I decided to stop trying new ones. Don’t worry, they’re configurable too)

To install it:

  1. put the file chuck.xml in C:\Documents and Settings\username\.jedit\modes.
  2. write this in the catalog file in the same folder: <MODE NAME=”chuck” FILE=”chuck.xml” FILE_NAME_GLOB=”*.ck” />

And that’s pretty much it. You should be seeing some nice color in your chuck files.

If you detect any error or improvable thing or want some additional help, just tell me: jesus {youknow} jesusgollonet.com

Ryan

Drömma

I can’t get enough of Dimitre’s great ideas.. I just started writing my dreams in the dream logger Drömma. I wish I had thought to make it! It’s a super-simple design, and you can even sketch a simple line drawing to go with the dream log. Arggg Dmtr you make me happy and mad all at once! Make the book, dude! gogogo.