Web Audio でマトリックスシーケンサーを作ってみた - Mach3.laBlog
この記事は賞味期限切れです。（更新から1年が経過しています） 今回のお題は「マトリックスシーケンサー」。 昔Flashで実装された物があったのをふと思い出し、今ならWeb Audio APIで作れそう！と思って作ってみました。 きっと同じ事考えて作って見た人はいるはず。 マトリックスシーケンサーとは マトリックスシーケンサーとは、整列配置されたボタンをトグルしてループミュージックを奏でる事ができるシーケンサーです。 多くの場合縦軸が音階を、横軸がフレーム（時間）を表し、 左から右にフレームが移動してONにされたボタンに割り当てられた音が鳴る仕組みです。 縦軸の「音」はスケール（調）に則って配置されているので、 相当いい加減にやってもまともな演奏になってしまう所がマトリックスシーケンサーの魅力の一つです。 ハードで知られているのがYAMAHAの「TENORI-ON」ですが現在は生産完了品で、
Amazon KDP で自費出版をしてみた話 - Mach3.laBlog
昨年11月末から12月末にかけて当ブログにて掲載していた 「Alphabetical Advent Calendar」を題材にして Kindle ストアでの自費出版を試してみました。 紹介を兼ねて、備忘録など。 JavaScript Alphabetical Advent Calendar 2013 JavaScript Alphabetical Advent Calendar 2013 こちらが制作してみた書籍になります。 基本的にはブログで掲載した内容とあまり変わりませんが、 リリースにあたって少し加筆修正などをしています。 Kindle ストアでの自費出版の手順 以下が出版までに踏んだ手順です。 EPUBデータを制作する epubcheck でバリデーションする kindlegen でKindle用のデータに変換する Kindle プレビューツールで内容を確認する Kindle Di
スタイルガイドを生成する「StyleDocco」の使用感 - Mach3.laBlog
この記事は賞味期限切れです。（更新から1年が経過しています） 先日スタイルガイドを制作する機会がありまして、 せっかくなので、スタイルガイドの生成に利用したStyleDoccoの使用感などをまとめておきます。 スタイルガイドについて ざっくり言うとスタイルシートのドキュメントです。 自分一人で完結するその場限りのページなら良いのですが、 複数人のチームで組み込んでいたり、メンテナンス担当が他の方だったりする場合、 プロジェクトのCSSをドキュメント化しておく必要が出てきますね。例えば、 どのような命名規則や方針で書かれていて どこになにがあり どのようなモジュールがどこで使えて そのモジュールはどうするとどのような挙動を起こすのか 等をまとめておく文書になると思います。 規模によってはかなり骨な作業になりそうです。 StyleDoccoとは StyleDocco StyleDocco ge
CSS3のbox-shadowでお絵かきアプリを書いてみたものの… - Mach3.laBlog
この記事は賞味期限切れです。（更新から1年が経過しています） 先日、CSS3のbox-shadowで描画されたモナリザが話題となりましたが、 インスパイアされて同じ手法でお絵かきアプリを作ったらどうなるか試してみました。 作ってみたもの まずはデモから。当たり前ですが、box-shadowに対応していないブラウザでは動きません。 DEMO on JS Bin JS Bin 感想 作って動かしてみた率直な感想を申し上げると…そもそもこういう用途を想定していないと思うので、当然あまり捗りませんでした。 が、描かれる物の雰囲気は、これはこれで嫌いではないです。水墨画的な物が描けそう。 重さが加速する Webkitはかなり軽快に動くのですが、Firefoxだとかなりもっさりした動きになります。IE9だとまだマシです。 そして、書けば書くほど重くなっていきます。 box-shadowを一点ずつどんど
サーバ管理のお手元に～VIエディタのチートシート - Mach3.laBlog
この記事は賞味期限切れです。（更新から1年が経過しています） VIエディタと言えばサーバ管理者やLinuxユーザーにとっては手放せない存在。 そんなVIエディタのコマンドチートシートがSmashing Magazineで、配布されていました。 VI Editor / Linux Terminal Cheat Sheet (PDF) – Smashing Magazine こんなかんじに綺麗にまとめられています。 リンク先ではPDFにてダウンロード出来るので、印刷して目につくところに貼っておくと便利。 私も本当に限られた機能しか使っていなかったので、重宝しそうです。 VIのチートシートとしては、このグラフィカルなやつも結構有名ですね。 Graphical vi-vim Cheat Sheet and Tutorial これはデスクトップの壁紙にして使えそう。 この手のチートシートで日本語で書
はじめてのRaphael (1) : お絵かき編 - Mach3.laBlog
この記事は賞味期限切れです。（更新から1年が経過しています） SVGが少しずつ市民権を獲得し始めている昨今のWWWですが、 Raphaelとは、そのSVGをコントロールするのに非常に便利なライブラリです。 公式によさげなチュートリアルがなかったのもあり、 今回はその使い方をまとめてみようという試み。 Raphaelとは RaphaelはSVGで図を描画するためのフレームワークです。 正しくは「Raphaël」と書きますが、 毎度めんどくさいのでRaphaelでいきます。 なにをしてくれるのか SVGが動かないクラシックなIE環境の為に、VMLでも出力してくれます。 イベントやアニメーションまわりも簡単に実装できるようになっています。 特に助かるのがVML対応。 旧ブラウザをサポートしなければならないケースには、 ぜひとも導入したいライブラリですね。 極めてシンプルな例 Rraphaelで図
TitaniumデスクトップでLESS.jsのフロントエンドをこさえてみた - Mach3.laBlog
この記事は賞味期限切れです。（更新から1年が経過しています） 申し訳ありませんが、このアプリケーションは更新を停止しています。 代替として、より優秀なWinLessやLess Parserをご利用ください。 以前何度かご紹介したCSS開発ツールのLESSですが、 コマンドを介したり自前で設定しなきゃいけなかったりで少々面倒なので、 LESS.jsをベースにしたフロントエンドをTitaniumデスクトップで作ってみました。 作ってみたもの Lessnium – version 0.9.0 (4.04MB) ※Windows版のみです。 使い方 要するに何をしてくれるのか LESSファイルを登録しておくと、更新を検知して自動的にCSSファイルをコンパイルしてくれます。 /the/path/to/hoge.less と登録しておくと、 /the/path/to/hoge.css を生成します。
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
写真で振り返る2012年 - Mach3.laBlog