Twitter Baseball

I have successfully mapped tweets to be associated with a smiley or frowny face depending on what the emotion of the tweet it is with is, as well as changed the color to associate with the emotion (blue is happy, red is sad). The first image is the tweets appearing then disappearing, the bottom image displays the tweets piling up over time.

 The text of the tweet is important to me because I feel that reading peoples emotions is interesting and relevant to the project. The visuals, such as the color of the text and the addition of the happy and sad face, add to the artistic value of the project because they help the viewer understand what tweets are happy or sad. It has been interesting for me to be able to see the blue and red text to readily see what emotions the tweets are conveying.


 //import libraries
import twitter4j.conf.*;
import twitter4j.*;
import twitter4j.auth.*;
import twitter4j.api.*;
import java.util.*;

Twitter twitter;
//search twitter for hastag or words
String searchString = "royals lose";
List<Status> tweets;

String searchString2 = "royals win";
List<Status> tweets2;

//tweets
int currentTweet2;

int currentTweet;

//images
PImage img;
PImage img2;


void setup()

{
    //size and background of sketch
    size(2000,1000);
    background(#838383);
    smooth(0);
     //keys from apps.twitter
    ConfigurationBuilder cb = new ConfigurationBuilder();
    cb.setOAuthConsumerKey("key");
    cb.setOAuthConsumerSecret("key");
    cb.setOAuthAccessToken("key");
    cb.setOAuthAccessTokenSecret("key");
  
     //get tweets
    TwitterFactory tf = new TwitterFactory(cb.build());

    twitter = tf.getInstance();
  
    getNewTweets();
  
    currentTweet = 0;

    thread("refreshTweets");
  
 
 
}


void draw()

{
    //load images
    img = loadImage("frownyface.png");
    img2 = loadImage("smileyface1.png");
    //background color and size of tweet
    fill(#838383);
    //make tweets not pile up
    //rect(0, 0, width, height);


    currentTweet = currentTweet + 1;
  
    //dictate size of tweet
    if (currentTweet >= tweets.size())
    {
        currentTweet = 0;
    }
  
    //tweet status 1
    Status status = tweets.get(currentTweet);
   
    //fill(255,165,0); //orange font color
    fill(255,0,0); //red font color
    textSize(random(14,30));
    //make image appear with tweet
    float k = random(width-100);
    float l = random(height-100);
    //image to be placed with tweet
    image(img, k, l);
    //placement of tweet
    text(status.getText(), k, l);

  

    //delay tweets appear
    delay(3000);
  
    //tweet 2
    Status status2 = tweets2.get(currentTweet);
 
    currentTweet2 = currentTweet2 + 1;
    if (currentTweet2 >= tweets2.size())
    {
      currentTweet2 = 1;
    }

    //blue font color
    fill(#1B2FF7); //color and size of second tweet
    textSize(random(14,30));
    //placement of second tweet
    float k2 = random(width-100);
    float l2 = random(height-100);
    //image to be placed with second tweet
    image(img2, k2, l2);
    text(status2.getText(), k2, l2);
  
    //delay of tweets
   delay(1000);


}

//retrieve tweets

void getNewTweets()

{

  try
  {
    //try to get tweets
    Query query = new Query(searchString);
  
    Query query2 = new Query(searchString2);
  
    //search
    QueryResult result = twitter.search(query);
  
    QueryResult result2 = twitter.search(query2);
  
    //get
    tweets = result.getTweets();
  
    tweets2 = result2.getTweets();
}

catch (TwitterException te)

  {
    //can't get tweets case
    System.out.println("Failed to search tweets: " + te.getMessage());
    System.exit(-1);
   }

}

void refreshTweets()
{
    while (true)
    {
      //getting tweets
        getNewTweets();

        //println("Updated Tweets");

        delay(300);
    }
}

I have also been working on making tweets containing the phrase "world series" in them appear around a baseball.

I modified the "world series" search by changing the visual to more clearly state what is being searched. I made the text in the shape of a baseball to enhance the text with the visual. I changed the image to a World Series image because it helps the viewer understand that the text is about the World Series opposed to solely baseball in general.

 //import libraries
import twitter4j.conf.*;
import twitter4j.*;
import twitter4j.auth.*;
import twitter4j.api.*;
import java.util.*;

Twitter twitter;

//search twitter for hastag or words
String searchString = "world series";
List<Status> tweets;



//tweets
int currentTweet;

//images
PImage img3;

float r = 300;
float r2 = 100;

void setup()

{
    size(2000,1000);
    //load images
    imageMode(CENTER);
    img3 = loadImage("worldseries.png");
    background(255, 255, 255);
    textAlign(CENTER);
    smooth(0);
     //keys from apps.twitter
    ConfigurationBuilder cb = new ConfigurationBuilder();
    cb.setOAuthConsumerKey("key");
    cb.setOAuthConsumerSecret("key");
    cb.setOAuthAccessToken("key");
    cb.setOAuthAccessTokenSecret("key");
  
     //get tweets
    TwitterFactory tf = new TwitterFactory(cb.build());

    twitter = tf.getInstance();
  
    getNewTweets();
  
    currentTweet = 0;

    thread("refreshTweets");
  
  
 
}

//retreive tweets

void getNewTweets()

{

  try
  {
    //try to get tweets here
    Query query = new Query(searchString);
    //search
    QueryResult result = twitter.search(query);
    //get
    tweets = result.getTweets();
}

catch (TwitterException te)

  {
    //can't get tweets case
    System.out.println("Failed to search tweets: " + te.getMessage());
    System.exit(-1);
   }
}

void refreshTweets()
{
    while (true)
    {
      //getting tweets
        getNewTweets();
        //println("Updated Tweets");
        delay(300);
    }
}

void draw()

{
    //background color and size of tweet
    fill(255, 255, 255);
    //make tweets not pile up
    rect(0, 0, width, height);
  
    currentTweet = currentTweet + 1;
  
    //dictate size of tweet
    if (currentTweet >= tweets.size())
    {
        currentTweet = 0;
    }
  
    //tweet status 1
    Status status = tweets.get(currentTweet);
   
    //fill(255,165,0); //orange font color
    fill(255,0,0); //red font color
    textSize(random(18,30));
    image(img3,1000, 500);

  
    //delay tweets appear
    delay(5000);
  
    translate(width/2, height/2);
    noFill();
    noStroke();
    ellipse(0,0,r*2,r*2);
  
      // We must keep track of our position along the curve
  float arclength = 0;

  // For every box
  for (int i = 0; i < status.getText().length(); i++)
  {
    // Instead of a constant width, we check the width of each character.
    char currentChar = status.getText().charAt(i);
    float w = textWidth(currentChar);

    // Each box is centered so we move half the width
    arclength += w/2;
    // Angle in radians is the arclength divided by the radius
    // Starting on the left side of the circle by adding PI
    float theta = PI + arclength / r;  

    pushMatrix();
    // Polar to cartesian coordinate conversion
    translate(r*cos(theta), r*sin(theta));
    // Rotate the box
    rotate(theta+PI/2); // rotation is offset by 90 degrees
    // Display the character
    fill(0);
    text(currentChar,0,0);
    popMatrix();
    // Move halfway again
    arclength += w/2;
  }
  
}

project 3 progress

My project now displays two different tweets in two different colors. I am currently working on trying to get one to float down from the top and another to appear randomly. I am also thinking about the possibility of adding more tweets to add different colors. I hope to connect the tweets to emotions, and have them appear differently and in different colors in order to tell a story of the emotions coming from Twitter. I like how the tweets do not disappear, it adds to the visualization and makes the viewer think about the tweets being presented to them. I am working with how long to display each tweet because it is important to me that the viewer can quickly read each tweet to get a better understanding of the project.

fifth reading response

"Coding The Infome: Writing Abstract Reality"

The beginning of this article made me consider how writing and learning computer languages is almost the same as learning a foreign language. It takes about the same amount of time and yearning to learn a foreign language as it does to learn new computer languages. Computer languages are similar to all speaking languages as well because they bring people together and are essential to computer with one another. I found it interesting that the article compared coding and the coding environment to an organism, it made me even further consider how similar the languages are. I also found Jevbratt's commentary on abstract reality interesting because it is something I am interested in expressing in my own work, and I enjoyed reading about how she creates new realities in her own work. I liked how Jevbratt created her own software in order to make work that she wanted; that she took imitative and extended her work by taking it in to her own hands to collect and create data. I enjoyed reading about various project by Jevbratt, they all gave me a better understanding of how artists use real life data to make real time visualizations and art. I liked experiencing the data and forming my own conclusions based on the visuals the data made. Her projects made me consider just how much one can do with networks and data to make internet art.

in class processing testing

 

project 3 progress

After multiple Google searches and a lot of trial and error, I was finally successful in retrieving tweets from Twitter and making them randomly appear in Processing.

Now I am brainstorming ways to make the Tweets appear more visually appealing, as well as trying to get multiple searches appear at once. I would like to make different tweets appear different colors. Possibly tweets about different teams different colors, or one team but tweets containing different emotions (mad would be red, happy would be white, etc.) different colors.

project 3 ideas

• Twitter search of how frequently the baseball teams are tweeted in the month of October, or the duration of this project
• Instagram search of how many people post pictures of the K State campus
• Weather search of how many days it gets over a certain degree in Kansas this time of year

processing practice

PImage img;
float offset = 0;
float easing = 0.05;
 
void setup() {
  size(640, 360);
  img = loadImage("http://i.imgur.com/VG1jmqn.jpg");

 
}

void draw() {
  image(img, 0, 0);
  float dx = (mouseX-img.width/2) - offset;
  offset += dx * easing;
  tint(255, 127);
  image(img, offset, 0);
    
    }

   

void setup()
{
 
  size(600,600);
  background(0,255,0);

  for (int i=0; i<600; i+=10) //rectangles
  rect(i, 100, i+100,600);
 
  for(int i=0; i<600; i+=100) //left to right lines
    line(i, 100, i+100,600);
   
  for(int i=0; i<600; i+=100) //right to left lines
    line(i, 0, i-100,500);
   
  
   for (int i=0; i<600; i+=10) //bottom lines
   rect(i, 500, i+50,600);
  
   for(int i=0; i<600; i+=100) //left to right lines
    line(i, 100, i+100,600);

}