タグ

ブックマーク / aike.hatenablog.com (8)

  • 不思議な円グラフを描くウェブサービス作ったよ - aike’s blog

    最近ツイッター界隈で不思議な円グラフを見かけました。 こんなやつです。 ちょっと調べてみると昨年の報道番組からキャプチャした映像のようです。 このグラフを見て、その手があったか!という新鮮な驚きを感じました。これまでの円グラフの常識にとらわれず、円の中心からあえてずらした位置から分割することで飛躍的に表現の幅を向上させています。無味乾燥で機械的なグラフにくらべて製作者の強い思いがぐっと伝わってきます。なんとイノベーティブでなんとワンダーなグラフなのでしょう。 でも、このグラフ、実際に描こうと思うとけっこう面倒です。Excelのグラフ機能をみても中心点の位置をずらす方法はなさそうです。 そんなわけでゆがんだ円グラフを描くウェブサービスを作りました。 ワンダー・グラフ・ジェネレイター 項目の追加変更はもちろん、中心をずらしたり、楕円形にして項目を強調したりできます。円グラフの秘められた表現力を

    不思議な円グラフを描くウェブサービス作ったよ - aike’s blog
  • Web Audio APIでファミコンノイズを鳴らしてみる - aike’s blog

    おっさんには懐かしいファミコンのノイズ音をWeb Audio APIを使ってウェブブラウザで再現してみます。今聴くとかなり表現力に乏しい感じのノイズですが、当時はこれで宇宙船の推進音や敵機の爆発音、レーザー光線やスネアドラムなど無限にイメージが膨らんだものです。 このファミコンの音源プロセッサRP2A03のノイズは、単純な乱数によるホワイトノイズなどでは再現できません。ノイズ生成のロジックをそのまま実装する必要があります。 RP2A03の詳細やノイズ生成ロジックはニコニコ大百科のFC音源の項に異常に詳しく書いてあります。内容も読み応えがありずっと読んでいられます。僕は何か嫌なことがあったりして気持ちを落ち着けたいときにはこのページをよく読むようにしています。嘘です。 これによるとノイズ生成は以下のC言語プログラムでできるとのこと。ノイズには音程感のほとんどない長周期ノイズと比較的音程感のあ

    Web Audio APIでファミコンノイズを鳴らしてみる - aike’s blog
    rikuo
    rikuo 2012/12/25
  • JavaScriptで正規表現練習ゲーム作った - aike’s blog

    特に何か目的があるわけじゃないんですが、JavaScriptの練習のためにゲームを作ってみました。 Regex Of The Dead タイピングゲームのように正規表現を練習するためのシンプルなゲームです。ゾンビと一般人が迫ってくるのでゾンビの名前にだけマッチするように正規表現を入力して倒していきます。 HTML5の流れでオーディオ、グラフィック、フォントHTML/JavaScriptで簡単に扱えるようになり、さらにenchant.jsのようなゲームエンジンも充実してきて、ゲームJavaScriptだけで気軽に作れるようになってきたようです。 そんなわけで試しに書いてみたのがRegex Of The Deadです。プログラミングは長いことやっているもののゲームを作ったのは大学のとき以来かもしれません。 最初、何か良さそうなゲームエンジンがないものかいくつか調査しましたが、こういったタイ

    JavaScriptで正規表現練習ゲーム作った - aike’s blog
  • 竹内関数で音楽生成 - aike’s blog

    Lisperの人ならみんな知ってる竹内関数(たらいまわし関数)という関数があります。 定義としてはこんな感じ。 そのシンプルな定義からは想像もつかないほど複雑で膨大な再帰呼び出しがおこなわれるとても興味深い関数です。たとえば引数にTarai(10,5,0)を与えると343,073回も再帰呼び出しされたりします。 この関数呼び出しの引数がどのように変化するか知りたくてプログラムを書いて調べてみたところ、Tarai(10,5,0)の場合は3つの引数がそれぞれ0〜10(xは-1〜10)の間で少しずつ変化するなかで、2つの値を固定してひとつの値が下降していくような挙動があったりして、なんだか音楽の3和音のコード進行を思わせるような動き方です。 そういうことなら、ということで実際に音にして聴いてみました。Tarai関数が呼ばれるたびに引数のx、y、zを、0=ミ、1=ファ、2=ソ、……、のように音に割

    竹内関数で音楽生成 - aike’s blog
  • 十年前「はやぶさ」開発の現場を見ていた - aike’s blog

    小惑星探査機はやぶさ帰還のインターネット中継を見た。あのMUSES-Cが当に打ち上げられ、様々な困難を乗り越え、六十億キロもの想像を絶する距離を航行した後に地球に戻ってきた。わずかな時間ではあるけれどまわりを照らすほど明るく輝いて燃え尽きる映像を当に感慨深い思いで見ていた。 十年以上前、ぼくは横浜に住んでいて人工衛星の開発現場にいた。宇宙開発とは言っても設計業務はデスクワークであり、一見普通の会社とあまり変わらない光景だ。製造や試験は関係者以外立ち入らない別の施設でおこなうため、オフィスでは主にPCに向かって文書を作成している。 そこにいる技術者はみんな宇宙が好きということでは共通しているものの、担当部署によって少しずつ特徴があったように思う。熱設計、構造設計の担当者は特殊技能を持っている職人のようだ。データセンターで大量のデータ解析をする地上設備の開発者はIT技術者に近い。品質管理部

    十年前「はやぶさ」開発の現場を見ていた - aike’s blog
    rikuo
    rikuo 2010/06/14
  • 荒れないウェブサービスの作り方 - aike’s blog

    ウェブサービスの運営者はどこも同じような悩みを抱えています。 ユーザーは基的にコミュニケーションが大好きなのですが、コミュニケーション機能は常に荒れる危険を伴っています。そのためウェブサービスはどこも工夫を凝らしてフレーム(flame)対策をしています。今回はいくつか典型的なフレーム防止のパターンをまとめてみました。 ■文字数を制限する 長い文章を投稿できると議論がフレームに発展しやすいため、書き込める最大文字数を制限する対策です。Twitterの140文字という制限は有名ですし、クックパッドの「つくれぽ」はわずか32文字です。pixivのコメントは255文字で比較的多いものの、改行ができないため長文は書きづらくなっています。長文を投稿したいというユーザーからの要望は強いはずですが、これらのサイトはしっかりとポリシーを持ってあえて文字数制限を設定していると思います。 ■コミュニケーション

    荒れないウェブサービスの作り方 - aike’s blog
    rikuo
    rikuo 2010/05/08
  • ダジャレ判定機作ったよ - aike’s blog

    ダジャレが好きなのだ。 来関連のない言葉同士を自由に結びつけ、語感のリズムで羽ばたいてシニフィエの宇宙を再構築する、そんなおやじギャグはとてもいとおしい。 だからぼくはダジャレのスキルを向上すべく日々研鑽しているのだ。 そういつもダジャレのことばかり考えている。PDCAサイクルを回して技術をみがいていく。 いやそれにはダジャレ度が定量的に計測可能でなくてはならない。 そうだ、ダジャレ度を測定するための機械を作ろう。←いまここ そんなわけでダジャレの上手さを評価するウェブサービスを作りました。 もじった言葉ともとの言葉を比較して似ていると評価が高くなります。 ダジャレというより、いわゆるボキャブラですね。 ダジャレ判定機 (http://aikelab.net/dajare/) 文字列比較の仕組みはこんな感じです。 ・MeCabで形態素解析して漢字を発音通りのよみがなに変換する ・大文字小

    ダジャレ判定機作ったよ - aike’s blog
    rikuo
    rikuo 2010/02/17
  • 14KB JavaScriptマリオをコードリーディングしてみたよ - aike’s blog

    JavaScriptで書かれたスーパーマリオ。わずか14KBのサイズであのマリオを再現したということで話題です。 http://blog.nihilogic.dk/2008/04/super-mario-in-14kb-javascript.html これはソースを読まねばなるまい、ということでコードリーディングしてみました。14KBといってもYUI compressorで圧縮されているので、見るべきは圧縮前の方のソースです。 http://www.nihilogic.dk/labs/mario/mario.js 圧縮前といってもものすごいですよ、これ。空行やコメントを適切に入れて、分かりやすい変数名をつけて、しかも画像や音楽もすべてテキストデータとしてソース中に定義して、それでたったの35KB、1200行。 うーむ、信じられない。敵キャラのAIは?画像データは?JavaScriptでどう

    14KB JavaScriptマリオをコードリーディングしてみたよ - aike’s blog
  • 1