ITエンジニア/デザイナ向けにオープンソースを毎日紹介

List

  • 2015/03/29

Twine – ストーリーを整理するノートアプリ

プレゼンテーションは単純にスライドを並べてたんたんと説明していけば良いわけではありません。全体を通して一つのストーリーが必要です。ストーリーが一貫して提供されてこそ、聞き手は納得し、理解を深めることができます。そんな納得感あるストーリーを作るのに適したソフトウェアがTwineです。Wikiっぽさのある面白いソフトウェア...

List

  • 2015/03/29

Textures.js - SVGをパターンで塗りつぶし

SVGはWeb上でベクターグラフィックを表現するのに適した手法です。Flashのように外部プラグインはいらないですし、拡大/縮小しても綺麗なのでどんなデバイスの画面サイズにも対応できます。そんなSVGの表現力をあげるのに適したライブラリがTextures.jsです。多数のパターンを使って塗りつぶし処理を行います。## ...

List

  • 2015/03/28

スクショ撮る君 – 指定したURLのスクリーンショット画像を作成

Webサイトのスクリーンショットを撮る要望はずっと昔から存在し続けます。昔はIEを外部から操作してスクリーンショットを撮るものがあり、少し経つとFirefoxでスクリーンショットを撮るものが出てきました。最近ではWebKitベースが多いようです。そんなWebサイトのスクリーンショットを撮ってくれるツールがスクショ撮る君...

List

  • 2015/03/28

CSS SANS - テキストでも画像でもない文字表現

文字の一部だけ色を変えて欲しい、そんな要望がクライアントから出たらどうしますか?一番単純なのは画像を使うことでしょう。しかしそこで諦めてしまったら試合終了です。そこで参考にして欲しいのがCSS SANSです。スタイルシートで作られたフォントになります。## CSS SANSの使い方!ほら、普通の文字に見えるでしょ?

List

  • 2015/03/27

esarea – 任意のテキストエリアでMarkdown記入を補助

Markdownに慣れるとどこでもMarkdown記法が使いたくなります。記法をサポートしていない場合でも、人が見ても十分分かりやすいのでとりあえずメモはMarkdown記法でとっておくと便利です。そんなMarkdownでの記述を任意のテキストエリアでサポートしてくれるのがesareaです。## esareaの使い方e...

List

  • 2015/03/27

material - マテリアルデザインを行うベースにどうぞ

Googleの提唱するマテリアルデザインはAndroidだけに止まらず広がりを見せています。特にWebデザインは相性が良いようで、フラットにしたけれどクリッカブルな場所が分からなかったり、あまりに簡素化されたデザインでかえってユーザを混乱させてしまうことがあります。そんな時にマテリアルデザインを使うことでユーザビリティ...

List

  • 2015/03/26

JavaScript Hand Tracking – HTML5/JavaScriptによる手の認識ライブラリ

CV(コンピュータビジョン)はここ数年でどんどん盛り上がっています。2Dもあれば3Dによる認識もあります。認識精度があがることで、様々なアプリケーション、サービスが生まれてくるでしょう。まるで映画の中のコンピュータのような世界ができるかも知れません。それをWeb上で手軽に体感できるのがJavaScript Hand T...

List

  • 2015/03/26

Paper Now - PeerJ向けの論文フォーマット確認ツール

PeerJというサイトがあります。いわゆるオープンアクセス・ジャーナルと呼ばれるサービスで、誰もが論文を投稿、公開できるようになっています。Tim O'Reilly氏もボードメンバーになっているそうです。そんなPeerJに投稿するための文書を事前に閲覧できるソフトウェアがPaper Nowになります。## Paper ...

List

  • 2015/03/25

FastttCamera – IFTTT製のカメラ用ライブラリ

iOSのカメラ機能はどんどん機能向上しており、ちょっとしたカメラアプリでは太刀打ちできなくなっています。とはいえ、アプリにはアプリならではのカメラ向けの機能追加が考えられるでしょう。そんなカメラをカスタマイズして独自の機能を追加したい時に使ってみたいのがFastttCameraです。IFTTTの開発するDo Camer...

List

  • 2015/03/25

WebSyn.ca - Webベースのオフィススイート

Google DriveやMicrosoftのOffice.com、iCloud上でのPages/Numbers/Keynoteなど大手のクラウドベンダーはどこもWebベースのオフィススイートを提供しています。ここで問題になるのはデータのロックインでしょう。自分たちで管理できる、ドキュメント作成ツールが欲しい方はWeb...

List

  • 2015/03/24

Cachet – システムステータスを可視化しよう

Webサービスやクラウドが流行ると、ビジネスに必要な機能がすべてオンライン上に存在するようになってきます。となると万一サービスが落ちていたりすると大きな問題になります。それも単純に404や503になってアクセスできなくなるととても困ります。そこで必要になるのがサービスステータスページです。独自に作っても良いですが、シン...

List

  • 2015/03/24

SkyBlue - ミニマム、軽量なCSS3フレームワーク

Bootstrapは非常に高機能で便利なフレームワークですが、多機能故にカスタマイズがしづらくなっています。自由自在に見た目を変更しつつ、全体の統一感を保つのは至難の業でしょう。そこまでするなら自分でイチから書く方が楽というデザイナーの方は多いはずです。SkyBlueはBootstrap対抗という訳ではありません。ただ...

List

  • 2015/03/23

animatedModal.js – アニメーションしながら表示される大きなモーダル

モーダルウィンドウといえばリンクやボタンをクリックした際などに小さく表示されるウィンドウです。しかしスマートフォンなどの画面領域が小さいブラウザの場合、画面全体に広がって表示されます。そんな大きなモーダルをデスクトップやタブレットでも使えるのがanimatedModal.jsです。大きく表示されるのでインパクトがあり、...

List

  • 2015/03/23

StyleCI - PHPのコーディングスタイルをチェック

CI、つまり継続的インテグレーションは何もコードのデバッグにだけ適用されるものではありません。自動的に、かつ継続的に何らかのチェックする仕組みを作れればCIになりえるでしょう。StyleCIもその一つと言えます。StyleCIがチェックするのはPHPのコーディングスタイルになります。## StyleCIの使い方!Git...

List

  • 2015/03/22

RICOH THETA Live Viewer – RICOH THETAの映像をWebブラウザから閲覧

RICOH THETAは全天球写真が簡単に撮れるデバイスで、最新版では動画の撮影も行えるようになっています。さらにAPIがあり、RICOH THETAと接続して連携するサービスを作ることもできます。RICOH THETA Live Viewerはその一つで、RICOH THETAの映像をデスクトップから閲覧できるように...