VOYAGE GROUP エンジニアブログ

voyagegroup_techのブログ
VOYAGE GROUPエンジニアブログです。

2011年12月

エンジニアが参加して良かったデザインミニ塾

こんにちは、VOYAGE GROUPの水越(@Akiyah)です。

皆さん、デザインミニ塾というイベントを知っていますか?
デザインミニ塾とは産業技術大学院大学でほぼ毎月開催されているデザインに関する勉強会です。
塾と言っても申し込みをすれば誰でも無料の、毎回デザインの分野で活躍している方を呼んで講演をしていただくという形式の気軽に参加できるイベントです。

私はエンジニアなのですがデザインにも興味があるので、異文化交流と言う意味でもこのデザインミニ塾を2010年頃からちょくちょく見に行っています。大好きで毎月楽しみなイベントです。
思い返してみると2011年末現在までの約2年間で15回参加したようです。

先日、社内勉強会でエンジニアやデザイナー、そしてUX(ユーザーエクスペリエンス)に興味がある人を集めてデザインミニ塾の紹介を行いました。デザインミニ塾の開催案内pdfファイルを見ながら私が印象に残った話を語ると言うスタイルで、質問や意見が出て盛り上がりました。

その社内勉強会のときにまとめた資料があるので、再編集してこのブログにのせます。エンジニア目線で面白かった回をピックアップしました。


第6回
「医療安全への終わりなき挑戦」
~ ヒューマンファクターとインタフェース ~
自治医科大学医学部メディカルシミュレーションセンター教授
河野 龍太郎 氏

この第6回がはじめて参加したデザインミニ塾なのですが、自分の中ではデザインミニ塾で一番良かった回です。
『実務入門 ヒューマンエラーを防ぐ技術』という本の編集者でもある河野 龍太郎 氏の講演で、ヒューマンエラーが起こるわけと、その原因となるインターフェース上の問題を、医療現場、航空機、管制塔、原発などの事例を豊富に紹介していただきました。

B = f(P,E)
B : Behavior(行動)
P : Person(人)
E : Environment(環境)

という式をつかって、行動は人と環境を入力とする関数の結果であり、ヒューマンエラーを人のせいにせず、そのエラーを引き起こした環境に原因があると認識して改善すると主張されています。デザインミニ塾なのに工学やシミュレーションがリスク回避にとても大切だとエンジニアの大切さを主張されていたのが印象的です。

これに近い回では『第24回「ユーザを中心としたものづくり」人間中心設計への取組』で講演された、株式会社 U'eyes Design の鱗原氏のブログである使いやすさ日記もデザインの善し悪しを冷静にマルバツつけていてとても参考になります。


第10回
「公共交通とサイン」
アール・イー・アイ株式会社代表取締役
中村 豊四郎 氏

地下鉄の案内のデザインを行った方の講演です。デザイナーの仕事は華々しいものだとイメージしていたのですが、フォントの性能の測定や配色の視認性の実験など、工学的で地道な作業を聞いて案外エンジニアと似ているんだなと思いました。
普段何気なく接している公共交通の案内図などですが、こういうところにデザイナー達の働きが隠されているのですね。


第16回
「デザインの力を生かすLGの戦略(仮)」
LG Electronics Inc. デザイン研究センター HEB デザイン研究所 常務
洪 思允 氏

LGやサムソンと言った韓国の電機メーカーの名前はもちろん知っているのですが、日本の大手の電機メーカーと比べ物にならないくらいデザインに力を入れていると言う事を聞き、衝撃を受けました。同様の事を『第25回「日本のデザインにまだアドバンテージはあるか? 〜アジアの国々の取り組みと比較して〜」』でも聞いたので、改めて日本以外の国のデザインへの強い取り組みを感じることができます。


第18回
「カラーユニバーサルデザインをはじめとするUD デザイン活動のお話し」
(株)武者デザインプロジェクト 代表取締役/UDソーシャルデザイナー
武者 廣平 氏

カラーユニバーサルデザインの講演です。私は色彩も好きなのでとても興味深い回です。日本人男性の場合は色覚特性がC型以外のP型やD型の人(いわゆる色弱の方ですが、色覚特性と表現されます)が20分の1もいる事を知り、この話を聞いてからP型D型の人が見づらいかもしれない単純な赤を使う事ができなくなりました!(その代わりに少し青が混じったオレンジを使ったりします)


第19回
「「共感」から発想するデザインコンセプト~オブザベーションのご紹介」
株式会社インフィールドデザイン 代表取締役
佐々木 千穂 氏

相手に共感してデザインするオブザベーションという手法とともに、『私は三年間老人だった 明日の自分のためにできること』という本を紹介していただきました。26歳のデザイナーが老婆の特殊メイクをして街に出てみたら、若い自分が受けているのと全く違う対応を社会から受けるという衝撃的な本です。
相手に共感すると言うのはこういう事か、と同時にここまでしないと立場の違いはわからないのか、とショックを受けました。


第21回
「異文化市場のお客さんの頭の中を探ろう ローカリゼーションマップの試み」
モバイルクルーズ株式会社代表取締役
安西 洋之 氏
テツタロウデザイン代表
中林 鉄太郎 氏

ローカリゼーションマップという概念についての回です。地域毎の考え方や文化の違いの事をローカリゼーションマップというようです。例えば女性がコンビニに行くとき、日本人なら日焼け止めクリームや乳液、フランス人なら香水、アメリカ人ならアイメイク、と言った違いがあるのだそうです。その他にもメキシコではマルちゃんが国民食として、メキシコの食材とあわせて調理して食べられているというローカリゼーションマップの成功例も紹介されました。これらは『「マルちゃん」はなぜメキシコの国民食になったのか? 世界で売れる商品の異文化対応力』という講演された安西氏と中林氏の本でも紹介されています。



さて、いかがでしょうか。興味が出てきた方もいるのではないでしょうか。
実は参加するにはpdfにかかれているメールアドレスにメールを送らないといけないのですが、デザインミニ塾の次回の予定は産業技術大学院大学のトップページにお知らせが書かれてから知る事ができるという、すこしややこしい方法なのです。興味がある方は次回から申し込みでくじけずにぜひ参加してみてください。

滅びの言葉をテストする

こんばんは。VOYAGE GROUPの野良クルー、@katzchangです。

ところでみなさん、バルスしてますか?

バルスとは滅びの言葉、つまりおまいらに解かりやすく言うと、異常系処理をキックするコマンドなわけです。で、やはり、異常系処理も含めてテストされるべきですよ。当然ですね。

ということで、テスト駆動開発、いわゆるTDD"風味"で、バルスのJava実装を作ってみました。とはいえ、要するに System.exit(1) すればよいので、実装は大したことがない。でも、実際にどのような動作になるか、あまり試したことがないのは僕だけじゃないはず。試す価値はありそうです。

方針としては、balseメソッドを実装したBalsableクラスを用意し、システムが無事に異常終了することを確認すればよいということにします。

さて、いきましょう。
package balse; import static org.junit.Assert.*; import org.junit.Test; public class BalsableTest { @Test public void test() { new Balsable().balse(); fail(); } }
テストコードはこんな感じ、new Balsable().balse();を実行すると、次のfail();が実行されないはずです。そうです、このときはそう信じていました………。alt + shift + x, t。

first_test_gray

よし、Gre……………y……?

なんと、JUnit test runnerがバルスしてしまいました。バルスマジバルス。

仕方がないから、外部プロセスとして実行し、結果を確認することにします。方針転換ってやつです。

こんな感じにテスト用のランナーを用意し、
package balse;

public class BalsableRunner { public static void main(String...args) { new Balsable().balse(); } }
外部プロセスとして実行させます。
@Test
public void testBalsableProcess() throws Exception { ProcessBuilder pb = new ProcessBuilder("java", "-classpath", "./target/test-classes;./target/classes", "balse.BalsableRunner"); Process p = pb.start(); assertThat(p.waitFor(), is(1)); }
green

今度はGreen。ちゃんとバルスできています。

ところが、ここで心配になりました。このバルスは、ちゃんとプロセス全体をバルスしているのでしょうか?マルチスレッドでも問題なくバルスるのでしょうか?

そう、不安があったらテストしましょう。

マルチスレッドを使ったテスト用ランナーを用意し、それをテストします。今度はリターンコードだけではなく、スレッドが実行されていることを確かめるべく、標準出力の内容も検査することにします。
@Test public void testBalsableThread() throws Exception { ProcessBuilder pb = new ProcessBuilder("java", "-classpath", "./target/test-classes;./target/classes", "balse.BalsableThreadRunner"); Process p = pb.start(); assertThat(p.waitFor(), is(1));
// TODO: helperを作るべき InputStream is = p.getInputStream(); BufferedReader br = new BufferedReader(new InputStreamReader(is)); String line; List<String> lines = new ArrayList<String>(); while ((line = br.readLine()) != null) lines.add(line); is.close(); assertThat(lines.size(), is(2)); assertThat(lines.get(0), is("時間だ!!答えを聞こう!!")); assertThat(lines.get(1), is("バルス!")); }
バルス!

はい、Green。標準出力の内容も意図通りのようです。

他のコードも含めて https://github.com/katzchang/balse にコミットしていますので、煮るなり焼くなり好きにしてください。

これを他のプロダクトに組み込む場合、直接System.exit(1)を呼ぶより、Balsableを通して呼ぶように変えることができます。そのときのテストとしては、MockBalsableを用意し、モックのbalse()メソッドが呼ばれたことを確認すれば、プロダクトへのバルス実装は完了です(Balsableにももう少し手を加える必要はあります)。そして、end-to-endテストとして実際にBalsableを組み込んだ上でバルスしていることを確認できれば、出荷可能です。

さて、この記事はTDD Advent Calendar jp: 2011の10日目の記事でした。

9日目の記事は@yujioramaC言語でもレガシーでも、TDD をやってやれないことはない(レガシーコード改善成分90%、TDD成分10%)、明日は大学でテスト駆動開発プロセスを研究してる@pocketberserkerです。きっと読み応えのある記事を書いてくれることでしょう……!!

純粋なTDDではないけど、まぁこんな感じで進めてますということで…。

VOYAGE CUPのインターバル撮影動画を作ってみた

こんにちは、VOYAGE GROUPの水越(@Akiyah)です。

株式会社VOYAGE GROUPにはVOYAGE CUP(去年まではナビリンピック)という社内の運動会・体育祭といったイベントがあります。6チームに分かれて、綱引きや大縄跳び、10人11脚やリレーなどで戦い、優勝を争うというイベントです。
これ、ガチです。私は今回が初めての参加だったのですが、当日の二週間ほど前から昼休みや夜に集まってチームで練習したり、インターネットで綱引きのコツの動画を探して共有したり、みんなで本気で勝ちに行っていました。
私の所属する紫チームは6チーム中3位で、残念ながら優勝は逃してしまったのですが、来年こそ、と言う気持ちです。

さて、そのVOYAGE CUPにGoProというカメラを持ち込んで体育館の隅に置き、インターバル撮影(微速度撮影)をしてみました。VOYAGE CUPが始まる前に設置し、10秒に1回撮影するように設定して置いておきました。

IMGP9154


GoProは170度の広角撮影ができるので、一枚の写真はこんな風になります。

0165

夕方VOYAGE CUPが終わり、ヘトヘトになって着替える前にカメラを回収しました。家に帰って、カメラのデータを確認したら、写真が1126枚撮れていました!やった!
と思ったけど、あれ、、、10秒×1126/60/60≒3.1時間、、、朝から昼頃までしか撮れていないじゃん。。。
改めて計算してみると4GBのSDカードを使っていたので、一枚2.7MBの画像は約1500枚(約4時間)しか入らないわけで、どのみち夕方までは撮れなかったのです。まあいいか。

次の手順は1126枚の静止画の動画変換です。今回はRubyとffmpegを使いました。
まず、ffmpegで処理できるように1126枚のファイルを0001から始まる連番のファイル名にします(ffmpegは0001から始まる連番でないといけないそうなのです)

ruby -e 'Dir.glob("in/*").sort.each_with_index do |f, i| `cp #{f} out/#{(i+1).to_s.rjust(4,"0")}.jpg` end'

こんなRubyのワンライナーを書いて、inフォルダにある画像ファイルをファイル名を変更しながらoutputフォルダにコピーしました。そして次はffmpegの番です。

ffmpeg -i %04d.jpg -b 1200 -aspect 4:3 -f avi -vcodec mpeg4 output.avi 

しばし待って、、、できた!



45秒の動画になりました。ちょこまか動いていますねー。 だけど広角すぎてちっちゃいですね。トリミングしましょう。
ffmpeg -i %04d.jpg -b 1200 -aspect 4:3 -f avi -vcodec mpeg4 -croptop 486 -cropbottom 486 -cropleft 648 -cropright 648 output.avi

ffmpegのコマンドラインに-crop*をつけて上下左右を1/4づつ削って、っと。



できた!
今度はいい感じに体育館全体が画面に広く映っています。完成〜

参考
記事検索
QRコード
QRコード