February 5, 2019No Comments

Concept Development

With "this", world's every graphic asset builds connection, instead of standing in its own island. As it focuses on simplified 2D imagery, its accuracy can be improved by catching an image with one set of color contrast--rather than complex objects or scenery. It doesn't necessarily try to translate the real world, but it observes how people perceive and recreate it in their own system. –Dream review

Biltmore Ave by Mason Adams


Concept: Graphic elements, such as icons and signages are everywhere in people's daily life. They also have standards and people have no problem communicating via those elements, or they do have problems. Regardless, the ability to produce a system of signs is human's very own characteristic.

Font Map by Kevin Ho: Also continues to fontjoy.com, which is a website you can pair font based on font vectors. It touches the core of my idea in a sense that the project itself tries to defend its own decision making in graphic design. My improvement or difference can possibly rely on ways to present this kind of analysis into other formats or applications.

Audience: There can be two types of users. One type can be those who are vaguely interested in visual communications area, and want to learn more about it. The other one can be those who desire to take these visual languages in different perspective.

Context: Due to the nature of my topic, it's somewhere between visual design and data analysis. There are many cases that attempt those two combinations, such as Programming Design Systems or Color of words. Although area of graphic design hasn't been fully observed, there are plenty of studies about road-sign recognition due to technical improvement in vehicle AI.

Content: There are still parts to be solidified, such as a method to tightly bond the daily experience of encountering numerous graphic elements with my analysis. Besides, I think the analysis itself will be consisted of big two themes of form and color. There is also a possibility to go with only one of them, depending on my speed.

Tech: Building T-SNE vector space and analyzing data have been done before, yet I haven't implemented in more advanced way than mere data files. In the same line from building content, I would like this to be approached in casual way as well.

Timeframe & Scope: 14 Weeks will be enough.


Preliminary Thesis Statement

Nowadays, people use Google Map navigation to find their direction. Before (or still), it was all about paper maps and road symbols. Even before that, people had similar system, drawn on cave walls and trees. Although now most things are migrating into digital devices, visual communication always exist in human history, only within different medium.

Visual communication, or graphic design, is like culture and language. It evolved in unpredictable directions, and people's lifestyle and history are embedded in them. Therefore, it's rather a new way to attempt these visual elements in analytical point of view, solely based on their appearance without their background contents. For the same reason, the concept or prototype I'll be building won't be about judging good or bad designs.

Instead, it's more about carefully observing what surround us everyday. My final outcome will be a combination of analysis and a tool to detect and/or generate visual elements based on that analysis.

December 12, 2018No Comments

Ghosts and Words

running example of Ghosts and words: pac-mans represented by yellow number eats food, or encounter ghost names and die

Ghost and words is a continuation from Evolutionary Pac-Man. It uses the same strategy of breaking down words (in this case, using paragraphs from Wikipedia's Pac-Man page) as "food", and also having "poison" or "ghost" that can kill the pac-mans.

Didn't know those ghosts have names...

The initial idea was simple - I wanted the words to act and animate as vectors. It also seemed interesting to use the correlation between actual meanings of words through such method like Word2vec, but I got stuck and spent too much time on other parts and didn't really get to that level.

Evolutionary Pac-Man was revisited because it was already using one unique way of converting text into many vector points. The renewed version more specifically focuses on typographic aspects, by turning (almost) every element into text.

In this game, texts do many things. They get eaten, run away or run towards, or sometimes get killed or starve to death.


The "ghosts" and "food" were initially built as classes:

class Ghost {
    this.x = x;
    this.y = y;
    this.type = ["BLINKY","PINKY","INKY","CLYDE"];
    this.color = ["red", "pink", "cyan", "orange"];
    this.call = int(random(4))

    textAlign(CENTER, CENTER);
    text(this.type[this.call], this.x + random(3), this.y + random(3));

However, as I start inserting pac-man object, I realized in order to use p5.Vector functions such as p5.Vector.dist, I had to keep them as p5 Vectors:

    for (let i = list.length - 1; i >= 0; i--) {
      // Calculate distance
      let d = p5.Vector.dist(list[i], this.position);
      // If it's within perception radius and closer than pervious
      if (d < this.dna[2 + index] && d < closestD) {
        closestD = d;
        // Save it
        closest = list[i];

So at this point, it's ran with four different arrays of ghost, which I think is bit redundant and I would like to make it simpler in the future.

December 12, 2018No Comments

Dialogflow V2: Unity Plugin Prototype

The Dialogflow V2 Unity Plugin is a continuation from Api.ai: Unity Plugin, which made it easy to integrate the Dialogflow(Api.ai) natural language processing API into your Unity project. It's built as a team project in Open Source Studio at ITP and not an official plugin from Google or Unity.

Responsible for project management and documentation. The project is selected for xStory, and will be continued on its development and documentation.

December 5, 2018No Comments

Doge Interactive Type

Doge meme style generator with ML5 PoseNet

Example of

Week 5: Doge style generator using ML5 PoseNet. This is not the best practice to use PoseNet, because a similar effect can be done through random(width), random(height) - not necessarily involving the person's pose. Yet it still makes a difference in a sense that it won't generate any text if it doesn't detect a person inside video. What can possibly done to use pose vertex with text in more apparent way..?

December 5, 2018No Comments

Fonts as Data

Type animation reacting to pitch of sound input

Week 4 assignment based on Drawing ttf with p5js commands + ML5 PitchDetection examples. It's always intriguing to see type itself reacting to sound, but it also makes me question what is the most natural/fitting typographic form to another data, such as: if the current transition of moving left to right goes along with concept of "pitch".

November 14, 2018No Comments

Concrete Poetry(?)

tiled gif image that is related to the spoken words, with red border and red text

tiled gif image that is related to the spoken words, with red border and red text

Week 3 assignment based on Marc Adrian homage and Speech to Gif examples.  Code

November 14, 2018No Comments

The Asemic Letterform

Generating asemic writing in grid - based on Recursive forms (homage to Anders Hoff) example.

October 31, 2018No Comments

The ANSI Terminal

Week 1 assignment based on Ghost train (homage to bpNichol) example. It displays bouncing palindromes that are starting and ending with letter "w", and changes its color and sentence after completing one round. It would be nice to figure out how to make two of them cross each other, just like the original Ghost train example.

October 31, 2018No Comments

Hidden Symbols & Networked Poems

week 1 readings:

The Upright Script: Words in Space and on the Page

  • Ara Shirinyan’s Your Country is Great: Afghanistan–Guyana (New York: Futurepoem, 2008)
    • "knowledge and love of Afghanistan is great even as he regrets the limits of his understanding"
    • This emptiness is clearest in the poems “Burkina Faso is Great,” “Central African Republic is Great,” and “Equatorial Guinea is Great,” each of which contains only a title on a blank page. As Shirinyan notes in his preface, “no one who could write in English and had access to the web thought to say anything great about those countries” in September 2006 when he conducted his searches.
  • Index for X and the Origin of Fires
    • The images continue to refresh, each remaining on screen just long enough to catch the reader’s eye before disappearing, while the text remains onscreen until the next click of the mouse.

Code hidden in Stone Age art may be the root of human writing

World map of

  • Between 2013 and 2014, von Petzinger visited 52 caves in France, Spain, Italy and Portugal.
    • The symbols she found ranged from dots, lines, triangles, squares and zigzags to more complex forms like ladder shapes, hand stencils, something called a tectiform that looks a bit like a post with a roof, and feather shapes called penniforms.
    • In some places, the signs were part of bigger paintings.
  • “Consistent doodles”
    • "The ability of humans to produce a system of signs..."