<![CDATA[makoto_inoue · Storify]]>http://storify.com/makoto_inoueNodeJS RSS ModuleSat, 25 May 2013 15:40:52 GMT<![CDATA[Sports Tech HackDay]]>

Storified by makoto_inoue · Sun, Sep 16 2012 08:26:25

The one and only @makoto_inoue hard at work at #sportstech hack day http://pic.twitter.com/Yk1CIpgV · Stephen O'Reilly
Powered by Storify
]]>http://storify.com/makoto_inoue/sports-tech-hackdayhttp://storify.com/makoto_inoue/sports-tech-hackdaySun, 16 Sep 2012 15:26:25 GMT<![CDATA[Hackathon summary]]>

Storified by makoto_inoue · Sun, Sep 16 2012 07:34:23

Googleusercontent
Bambinos at the Olympic hack day #mmxiihack http://pic.twitter.com/to8yrpaS · Oliver Nightingale
Googleusercontent
It's midnight and we are still going strong #mmxiihack http://pic.twitter.com/AsFU75IF · makoto_inoue
Almost 3 am. 3 men up. 3 men down. #mmxiihack http://pic.twitter.com/Lqz8mtDA · makoto_inoue
“@makoto_inoue: 4am and we are still going strong!! #mmxiihack FTW!! http://pic.twitter.com/uFsRxzt2” @pebblecode designer spotted! · Paul Evans
5 am and w r strong.... #mmxiihack http://pic.twitter.com/gpahlKr0 · makoto_inoue
7 am. I think we are done. #mmxiihack http://pic.twitter.com/e4fh5pnb · makoto_inoue
Powered by Storify
]]>http://storify.com/makoto_inoue/hackathon-summaryhttp://storify.com/makoto_inoue/hackathon-summarySun, 16 Sep 2012 14:34:23 GMT<![CDATA[Londinium MMXII Hackathon (#mmxiihack)]]>

A day after the opening ceremony of the London 2012 Olympics, the group of developers and designers gathered in central london for 24 hr App Marathon. All the result is in the result gallery. http://hackathon.new-bamboo.co.uk/

Storified by makoto_inoue · Tue, Jul 31 2012 15:59:01

Count down to the hack day was easy. Always Olympic +1
The day of the hackathon. People are heading to the venue and @new_bamboo staff are getting ready.
Googleusercontent
Bambinos at the Olympic hack day #mmxiihack http://pic.twitter.com/to8yrpaS · Oliver Nightingale
Googleusercontent
@cloud8421 presenting how our competition works , followed by @pusher  and @datasift for their API presentation
Googleusercontent
Googleusercontent
Googleusercontent
Powered by Storify
]]>http://storify.com/makoto_inoue/londinium-mmxii-hackathon-mmxiihackhttp://storify.com/makoto_inoue/londinium-mmxii-hackathon-mmxiihackTue, 31 Jul 2012 22:59:01 GMT<![CDATA[Where is the data for Londinium MMXII?]]>

I am looking for open & public data related to the biggest event of the summer in my town, but there is no luck so far. Let me know if anyone know good info.

Storified by makoto_inoue · Thu, May 03 2012 08:12:02

NY Times
Guardian
BBC
Powered by Storify
]]>http://storify.com/makoto_inoue/where-is-the-data-for-londinium-mmxiihttp://storify.com/makoto_inoue/where-is-the-data-for-londinium-mmxiiThu, 03 May 2012 15:12:02 GMT<![CDATA[Making of "The Fantasy Eurozone 2011"]]>

This is my story about making http://thefantasyeurozone2011.herokuapp.com

Storified by makoto_inoue · Sun, Dec 04 2011 17:26:20

Introduction: Challenges Are Beautiful

I created "The Fantasy Eurozone 2011" to submit to a infoviz contest hosted by the Guardian. The contest is to visualise data  featured on the Guardian about current economic crisis. You can either submit full information visualisation, or "Napkin" entries which involve writing down a concept on a piece of paper for those who do not have design skills.  Even though I have close to zero design sense and skills, I decided to enter the full information visualisation category so that I can build my design skills.  I am hoping that my coding skills will compensate for my lack of design flair.
Informationisbeautifulawards

We give you the data. You supply the creativity. If your entry wins, there's $5000 available in prize money.

— · Fri, Dec 02 2011 14:02:00
Challenges Are Beautiful: visualise the economic crisis and win $5,000Challenges Are Beautiful: visualise the economic crisis and win $5,000
Albrecht Ritschl: Germany's ducking of the war reparations issue makes its attitude to the current Greek debt crisis somewhat hypocritica...
Finding A Topic: European Debt Crisis

One of the criteria is to use the dataset featured on the Guardian's data blog. After having reviewed all the articles from the past year, I had various conversations with family and friends, some of who work in the financial industry. In the end, I decided on an article about the current Euro debt crisis that appeared on the contest page.
Eurozone debt crisis: the key charts you need to understand what's happeningEurozone debt crisis: the key charts you need to understand what's happening
How bad are things in Europe - and how does each country compare? Well, besides the data below, Polly Curtis' Reality Check series is a g...
This article was very informative describing various indicators about the euro debt crisis. The Guardian did a great job collecting various figures from Eurostats and explaining each figure in great detail. However, I found it difficult to get the big picture about the European debt crisis as a whole due to an overwhelming amount of data. As such, my aim is to visualise the highlights from this article in one page.
Asking A Question:  What happens if Greece leaves the euro?
The blog article also asked an interesting question, "What happens if Greece leaves the euro?" This is often associated whether it leads to the end of Eurozone as a whole.
Is this really the end?Is this really the end?
EVEN as the euro zone hurtles towards a crash, most people are assuming that, in the end, European leaders will do whatever it takes to s...
Economist
This question gave me a great idea. What if the member of Eurozone is not fixed, but rather replaceable like any other sport team? 
Finding A Concept: The Fantasy Football
Have you played "Fantasy Fooball"? You become a manager of your own team and pick players from various teams to form your dream team. 
Currybet
So how do you apply these to Eurozone? One way is to create a multi dimensional chart plotting each player's ability. For instance, 5 for pass, 2  for goal, 1 for defence and etc. Below is my paper prototype. I am glad that I did not enter to the "Napkin" category as it is very clear that my napkin entry is not so strong..
photo · instagram
Choosing a Toolset: Raphaël
Next, it's time to pick a tool for the job. There are so many different kinds of infoviz libraries, some of them are HTML5 Canvas based, and others are SVG(Scalable Vector Graphics). HTML5 Canvas. There are lots of libraries which offer's some framework to use either of the format.
d3.js - GitHubd3.js - GitHub
D3 allows you to bind arbitrary data to a Document Object Model (DOM), and then apply data-driven transformations to the document. As a...
Powered by Storify
]]>http://storify.com/makoto_inoue/making-of-the-fantasy-eurozone-2011http://storify.com/makoto_inoue/making-of-the-fantasy-eurozone-2011Mon, 05 Dec 2011 01:26:20 GMT<![CDATA[test]]>

Storified by makoto_inoue · Sun, Nov 20 2011 08:29:45

thisi is occupy
Occupy Wall Street Eviction Testimonial, Liberty Square 11/15 · OccupyTVNY
Sign at #OWS: "Occupy the Bloomberg Mansion - Sunday, 6PM - Drum Circle - 19 E. 79th St" Crowd size expected unknown.. http://t.co/UNV75Clu · theother99
Powered by Storify
]]>http://storify.com/makoto_inoue/test-1http://storify.com/makoto_inoue/test-1Sun, 20 Nov 2011 16:29:45 GMT<![CDATA[Mozilla App Store]]>

My research result of Mozilla Open Web App and App store

Storified by makoto_inoue · Tue, Nov 15 2011 03:15:09

Overview

This video gives you the overview of Mozilla's Open Web App
Mozilla : Open Web Applications · Mozilla
Why do we use (or create an app for that)?

At a glance, it's very close to Google's Chrome store. You create an app using Web Technologies (HTML, CSS, etc). Mozilla provides Chrome like "Web Store"

- 1 click installation from the store
- Payment ability (not much info on Mozilla's site though)

However there are differences .　These are the advantages for Mozilla App Store

- Mobile App support. You can install the app on mobile as well as desktop
- Device API , such as geolocation, orientation and camera access.
- Cross browser. It should work not just for Firebox, but for other browsers

Since this uses web standards, you can use offline storage using Local Storage or IndexdDB

Apps - MDN
DRAFT Web apps are websites that users can install and run from Web-enabled devices. They are built using standard Web technologies with ...
How to make your web site "Firefox Web Store" aware? Looks very easy (and similar to how Chrome app works). You basically write a manifest and serve the file
- Create an app manifest.
- Serve the app manifest in a file with a file extension of .webapp.  
- Set the Content-Type header to application/x-web-app-manifest+json. 
- Publish the app, either on your own site or in an app store (or both). 
- Publishing it yourself requires adding some code to your site to manage installing and updating the app in users' browsers.

App manifest - MDN
An app manifest contains information that a web browser needs to interact with an app. It provides both human-readable elements (a name, ...
Edit this Fiddle - jsFiddle - Online Editor for the Web (JavaScript, MooTools, jQuery, Prototype, YUI, Glow and Dojo, HTML, CSS)
From https://developer.mozilla.org/en/OpenWebApps/The_Manifest { "version": "1.0", "name": "MozillaBall", "description": "Exciting Open W...
So is this available? 

Ok, I now know how to develop it, but is this actually available? Does it have some sand box environment to play with?
Answer is thought of yes. There is a extension for both firefox and chrome to let you register your app on your dashboard

Download the Mozilla Web App extension for Firefox and/or Chrome. This extension implements the application launch and application management APIs. Use the Manifest Validator to ensure your Web App manifests are working. Check out this proof-of-concept Web App dashboard written in HTML5. You may even be inspired to write your own dashboard!

— · Mon, Nov 14 2011 23:46:55
Mozilla : Web Applications : Firefox Extension
Web Applications are applications that run on any device, and can be distributed through any store or directly by the developer. The expe...
Mozilla : Web Applications : Chrome Extension
The chrome extension is currently pre-alpha code and comes with a couple caveats: Finally, we welcome your contributions to this extensio...
TED
Jibe - The Dashboard that Syncs
And there are already some apps you can actually install.
Mozilla : App Directory
A collection of Awesome Web Apps written by our friends!
Powered by Storify
]]>http://storify.com/makoto_inoue/mozilla-app-storehttp://storify.com/makoto_inoue/mozilla-app-storeTue, 15 Nov 2011 11:15:09 GMT<![CDATA[The state of adding subtitle on HTML5 video]]>

One of my clients is interested in adding accessible and multi language subtitles on videos. Here are my finding.

Storified by makoto_inoue · Tue, Nov 08 2011 07:38:17

I was initially searching with the word DFXP(Distribution Format Exchange Profile). Apparently  it's one of the document profile type to express TTML (Timed Text Markup Language) for Videos on web.

4.1 DFXP Content DFXP Content is an abstract document type of a profile of the Timed Text Markup Language intended to be used for interchange among distribution systems. This document type is defined in terms of the element and attribute vocabulary specified in 5 Vocabulary. This specification defines two types of normative schemas that may be used to validate a subset of conformant DFXP Content document instances:

— · Mon, Nov 07 2011 14:41:48
Timed Text Markup Language (TTML) 1.0Timed Text Markup Language (TTML) 1.0
Child information items [children] are reduced to only element and character information items. Contiguous character information items ar...
Whenever we talk about shiny new web standards, the first question we come up is "which browser it's been supported"? I googled for about an hour and found nothing, so I turned my effort into twitter.
To my surprise (sorry @thebeebs) , the ones currently supported are Flash and next version of IE(10)
Winisp
HTML5 Video Captioning - IEBlog - Site Home - MSDN BlogsHTML5 Video Captioning - IEBlog - Site Home - MSDN Blogs
The promise of HTML5 is a Web that works for everyone. Media accessibility through captioning is an important part of that promise and an...

We wanted to test a scenario were multiple formats are used to gather more feedback, so we built the demo in such a way that both TTML-1.0 and WebVTT can be used. WebVTT originated from W3C discussions last year after a need for simple caption authoring was identified. TTML is already an established standard for full-featured video captioning and supported in Adobe Flash and Microsoft Silverlight. It is used on Netflix, Hulu and other sites that display broadcast content.

— · Mon, Nov 07 2011 18:13:11
I finally found the answer about DFXP. The answer is "not yet". So I turned my focus to WebVTT which is also mentioned in the IE blog.
WebVTTWebVTT
The output of the steps below is a set of CSS boxes that covers the rendering area of the media element or other playback mechanism, whic...
HTML5 Video WebVTT Example
Sample HTML5 code that makes use of a WebVTT file and playr to add subtitles to a video clip
WebVTT is a text format to separate text context out of video elements. You can specify text in the format like below

WEBVTT FILE 
[idstring]
[hh:]mm:ss.msmsms --> [hh:]mm:ss.msmsms [cue settings] 
TextLine1 
TextLine2 ...
WebVTT and Video Subtitles | iandevlin.com - blogWebVTT and Video Subtitles | iandevlin.com - blog
With the web industry embracing HTML5′s ability to embed video in the browser, we need to take a further look at what the future holds fo...
Powered by Storify
]]>http://storify.com/makoto_inoue/the-state-of-adding-subtitle-on-html5-videohttp://storify.com/makoto_inoue/the-state-of-adding-subtitle-on-html5-videoTue, 08 Nov 2011 15:38:17 GMT<![CDATA[Storify at #mozfest]]>

@makoto_inoue , community partner of Storify, attended Mozilla Festival (#mozfest) as a Human API of storify.com. This is his story during the festival

Storified by makoto_inoue · Mon, Nov 07 2011 17:31:06

Hi, my name is Makoto. I am a Web Developer based in London. I am a supporting member of Storify and help doing some data mining for Storify. In short, my job is to storify the storify! For this conference, I participated as a Human API of Storify 
photo · instagram
What is "Storify the storify"?, you may ask. Look at one of the work I did for Storify. When #SteveJobs passed, there were more than 140 different stories made on Storify, and many of them included same quotes. I did simple aggregation work to find "Top 10 most quoted Tweets". I bet #10 is someone you wouldn't imagine. 
Top 10 most quoted Tweets on Storify about #SteveJobsTop 10 most quoted Tweets on Storify about #SteveJobs
The most quoted Tweets in Storify stories by news organizations, bloggers and individuals
For me, Storify is the goldmine of interesting data. If you want to do some data journalism using social media (such as twitter), you need some infrastructure to handle "Big Data" and write a lot of complex programe to extract meaningful information. Enter Storify!! Storify is  "Mechanical Turk" for journalism. Many experienced and intelligent journalists curated meaningful information from various social networks, such as twitter, flickr, facebook, instagram, and various web sites. "Signal/Noise" ratio of information stored in Storify is very high. My job as a Human API is to introduce you how to leverage our info through Storify API. If you are interested, go to http://dev.storify.com now!!
Chess-playing Automaton · anyaventura
Storify: Developers
This page describes the Storify API v1. The Storify API allows you to get all the information about any public story or any public user o...
Anyway, if you are interested in what exciting things happend at #mozfest, check out @sotirfydev stories I made during the festival
#mozfest social media highlight (day 1) #mozfest social media highlight (day 1)
Social media highlight of Mozilla Festival (London Nov 4 ~6), day 1
#mozfest social media highlight (day 2)#mozfest social media highlight (day 2)
Day 2 of Mozilla festival
#MOZFEST SOCIAL MEDIA HIGHLIGHT (DAY 3)#MOZFEST SOCIAL MEDIA HIGHLIGHT (DAY 3)
null
And it was not just me storifying. Here is "Where are the mozfest foxes?" by @hsing
Storify - Create stories using social mediaStorify - Create stories using social media
Create stories using social media. Turn what people post on social media into compelling stories. Collect the best photos, video, tweets ...
Friday - Web Media Science Fair 
At Friday evening, I was a bit late to arrive at the festival, and the place was packed! Luckily, nice people at @scraperwiki guys kindly shared the space with me. 
 I was talking to many people almost non stop for 2 hours.  Thank you so much for all the people who came to our stand. Some people were kind enough to bring me a glass of wine because I was stack at the booth and could not get anything to drink. The best part was that some of the audience was explaining to other audience about how great Storify is and how to use it. 
IMAG0293_small · makotoi12345
Saturday - Human API

On Saturday, we Human API peeps got white lab coats from the organiser mozilla. Now do we look more professional?
lab coat love in with the @BlueVia massive here at #MozFest. SMS, location and billing APIs if ya need em, http://t.co/kIqVlyVQ · spugamola
Powered by Storify
]]>http://storify.com/makoto_inoue/storify-at-mozfesthttp://storify.com/makoto_inoue/storify-at-mozfestTue, 08 Nov 2011 01:31:06 GMT<![CDATA[Could you write a quote for dRuby....?]]>

Storified by makoto_inoue · Sat, Nov 05 2011 00:38:23

Powered by Storify
]]>http://storify.com/makoto_inoue/could-you-write-a-quote-for-druby-http://storify.com/makoto_inoue/could-you-write-a-quote-for-druby-Sat, 05 Nov 2011 07:38:23 GMT