Ubiquitous Computing Process Journal 4
By Jingpo Li
(CountrySize web application screenshot)
I was always curious about how does Google Home,Siri, Alexa work through readily available APIs online. In another class, I had explored the API when building a website: I used Weather online API data to find the real time temperature data online. After I did research, I found there are two APIs, Data API and Question API. This time I had an opportunity to work with question API and I had a hard time find the concept and decide what to do. Because we need to narrow down the questions we ask and visually give the answers to that questions.
I am sure you know the biggest country in the world. I think you also know the top 5 biggest counties but I doubt if you know top 15 largest counties. Which country is bigger or how much bigger? When a question is asked, Wolfram Alpha’s response is displayed. People are bored of numbers and sentences. Instead of representing numbers, represent through aesthetic visuals. Instead of designing for affect-as-information, design for affect-as-interaction.
I got inspiration from an existing website called, MapFight. It is a website that compares the size of any two geographical areas.
Our assignment is to explore a new way to ask questions and get the results by using specific type of data, so I change a way to ask the question. Instead of asking or typing the whole questions (What is the size of Canada?), just type the country name. MapFight can only compare the sizes of two countries. What I attempt to do is to visually compare the sizes between countries as many as you want.
Instead of giving you the answer (The total area of Canada is about 3.86 million square miles), I wanted to use different size of circle to represent the size of the country.
Tools & Software
– Wolf Ram Alpha API
– PubNub connecting the Wolf Ram Alpha API
The very first step is to have the question bar.
Since I need to get the number after “about” in the answer, I split the sentence.
After I got my Wolf Ram Alpha API developer key in class and set up PubNub Account for connecting the web page to the Wolf Ram Alpha API. I started working on the p5 example code. Above is my first successful attempt at accessing split Wolfram Alpha’s response on a p5 canvas. Split an array so that in every loop, those value are entered separately side by side.
In order to get some visualization, I need to extract the number out of the answer(text). I found out these answers have the same format as “The total area of (country name) is about (certain number) square miles.” That is to say I need to have the number right after “about”.
I used for each statement to find out “about” in an array. The forEach() method executes a provided function once for each array element.
When I got my circles working, I decided to design the web page a little bit. I placed a world map on canvas and used random colour for circles.
I still cannot find a way to solve the problem. What I did for the code is to extract the number after “about” and to make a circle based on that number. The thing is the answers have different units and the range of those number is too big.
“The total area of Canada is about 3.86 million square miles.”
“The total area of Thailand is about 513,120 square miles.”
So if I just used the number after about, Thailand would be larger than Canada and cannot fit in canvas.
I also tried to ask the question in a different way, such as”The size of Canada in million square miles” They don’t have an answer for that question.