Archive for the ‘2008 ITP Classes’ Category

midterm idea - treemap-revised

Tuesday, March 4th, 2008

My ‘plan’ was to concentrate more on finding ways to acquire text data from URL by using of XML. But I found it more difficult that I thought it would be, decided that I would pursuit that later on my final, not midterm.

The main idea is to subdivide 2D space to show the relative frequency of each word(from .txt file)in mapping of tree structures.

The code was built mainly from Visualizing Data (Ben Fry, O’reilly) Ch. 7 -Trees, Hierarchies, and Recursion, then I modified it to ‘my version’ of it.

After several trials of modifying the last code for midterm, I came up with some results with slightly different visuals.

Each sample shows different stroke and ellipse size. First three examples are from the same text file from the book-Mark Twain’s Following the Equator, depicting word usage in the book, and forth one’s visuals created from Korean-English dictionary from The Project Gutenberg. The fifth one shows the word usage in The War of the Worlds by H.G.Wells.

Since the text is only drawn if the size of the text is smaller than that of ellipse, for many times it shows ‘blank’ ellipses.

Follow-ups : After in-class presentation, I got lots of helpful feedback both from Dannie and classmates. Among those, I sorted out some very important opinions.

  • The sequence of how those ellipses form in visual - For now, it is procedural, my processing code doesn’t contain ‘random’ value. Next time, I should think about how I ‘intentionally’ form whole fragments in visual more successfully.
  • Using more dynamic data - Absolutely. This should be my goal for final project. Parsing data from XML should be studied. In fact, one of my classmates showed us the perfect example that I can refer to. Stored text data makes the visual very static.
  • Make the visual less ‘arbitrary - Current code is done not by means of any underlying principle or logic, but by whim or some decidedly illogical formula. Using ‘baysean filter’ to build more logic first, then come up with better solution.

a2z_mid_output2.jpg

a2z_mid_output11.jpg

a2z_mid_output3.jpg

a2z_mid_output4_dictionary.jpg

a2z_mid_output5_war.jpg

a2z_mid_output7_kor.jpg

Source code here

midterm

Thursday, February 28th, 2008

I showed the result of what I have been working on to the class this morning. The purpose of this short presentation was to ask some problematic parts that I was engaging, however, it went to sort of critique which was a great plus to keep get this project going.

Dan’s reaction was that my work enables user to find hidden message from the image - Vitamin Water bottles.  For some reasons(I am still working on figuring this out.), when mouse moving it ’skips’ the label part of the bottles, so the result appears to be intentionally ‘conveying’ certain message.

vita_satu51.jpg

Now I’ve changed 80pixel wide strip animated. When mouse stops, the colored bar part starts extends horizontally, then it goes back to where it was before if mouse starts moving again. (this was heavily relied on Young Sang’s assist in coding)

Next step and (probably) a goal would be making the colored bar doing image manipulation such as sharpen or blurring.

keyboard exercise

Tuesday, February 26th, 2008

dfc_ipactest1.jpg

simple aram_dfc_key1.swf

This it it. As it says, it’s a simple keyboard interface made from Flash. Each button allows user to manipulate the object(currently it’s a mini robot character).

Somehow my creativity was limited this time to expand this project to next step which can join the IPAC interface as physical input. I played around several switches (see picture above) with IPAC first, realized that lack of idea still

midterm idea - treemap

Tuesday, February 26th, 2008

For A2Z midterm project, I want to develop a short program to familiarize myself with how treemaps work. I’ve already exercised one simple code last week for class assignment, this could be developed further by putting more trial on it. - For example, simply changing String data from .txt to URL source data.

Some sample existing visuals from web are shown below:

turner1a.gifsf-treemap.pngnewsmap.png

http://jcmc.indiana.edu/vol10/issue4/turner.html

http://radar.oreilly.com/archives/2006/07/treemap-on-rails.html

http://www.cse.ohio-state.edu/~kerwin/treemap-survey.html

yahoo_treemap.jpg

scratch 2

Saturday, February 16th, 2008

I chose to use ‘Vitamin Water‘ images for exercising current topics - saturation, noise, brightness and etc. - in C language.

Complete image of all different colored Vitamin Water bottles shows literally ‘color palette’, that’s why I thought it is great source to manipulate.

vita_orig.jpg

vita_satu1.jpg

Here, I found one small problem: in the code, widow’s size is set to 640×480 so I should bring any image with exactly same size otherwise it’d be crooked as shown above. However, I decided NOT to change the window size in the code.

vita_satu2.jpg

I found something! While size of stroked square remains the same, I managed to change actual navigation square’s size to 50×50 pixel.

vita_satu3.jpg

SetRect(&Recti,mousepoint.h-50,mousepoint.v-50,mousepoint.h+50,mousepoint.v+50);

I changed each value from 100 to 50.

vita_satu4.jpg

This is improvising from Danny’s tweaking - I only changed the value of saturation from 0 to 100.

vita_red_gray.jpg

if(x<mousepoint.h+10 && x>mousepoint.h-10){
ourSetPixel(x,y,R,R,R,bufferRowBytes,bufferBaseAddress);
}else{
ourSetPixel(x,y,R,0 ,0,bufferRowBytes,bufferBaseAddress);
}

vita_grey_rgb.jpg

scratch 1

Thursday, February 14th, 2008

wk3_assig_01_animatedrect.jpg

Simply, switching around some values from the existing .c file and came up with above.

Modified part:
for(y=0;y<70;y++){                                                        // translation to lingo -  repeat with y = 0 to 70
ourFramedRect(mousepoint.h -y*60-count,
mousepoint.v -y*10-count,
mousepoint.h +y*60+count,
mousepoint.v +y*10+count);                                  // calling our method that draws Rects

concordance

Tuesday, February 12th, 2008

This week, I made a simple treemap, referring mainly from the book Visualizing Data. All done is Processing, not Java.

treemap_shot.jpg

Code sample available here.

prototyping-next level

Monday, February 11th, 2008

First idea in order to enhance user experience with Samsung camera is merging multiple buttons in one long, two-way button. (see pictures below) Industry standard word would be ‘Rocker switch‘.

nv15_back1.jpg

Before

nv15_back_enhance.jpg

After

That’d be all for altering ‘physical’ interface. With those two buttons, user can do exactly same navigation as before,by simply clicking either direction to get whatever function. Series of ‘what you can do’ with this button are:

  1. Browsing each function by one-time click
  2. Selecting any function by center click
  3. Fast-image browsing by keep pressing (HOLD)the button

Next step is tweaking a little bit of LCD graphic interface removing the first row icons redundancy.

Application that I am going to use, I am thinking of using Processing or Flash unless some other apps will turn out to be more appropriate and easy to use.

note_menu.jpg

nv15_fl1.jpg

This is ‘in process’ view of Flash window. In comparison to real NV15, my interface shows ‘menu’ first on LCD bottom row.

group project idea: cleaning (to be continued)

Thursday, February 7th, 2008

We, Laura, Sanjay and me, gathered together after class to talk more about project subject.

Laura came up with ‘cleaning’ subject:

  • Why someone does cleaning a lot while the other doesn’t (at all?)
  • What if we observe the house of the person who does cleaning for a living, whether it’d be (extremely) clean or not?

agenda -

Thursday, February 7th, 2008

Group

Sanjay
Aram

We came up with a few ideas but could not narrow down on one:

Movies:
- movie as a product in theatres
- services for promotion
- movies on small screens such as psp,ipod, mobile,etc

Cleaning :
- sanitation
-recycling
-energy

Web Surfing
-different ways?
-different places

Bike Accident Device
-device to notify vehicles that a bike is coming and to becareful

Fashion
- customizing fashion , accessories, trends etc