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

ライセンス - Creative Commonsの記事一覧

プレミアムユーザー限定記事

MOONGIFTプレミアムは、月額500円の有料サービスです。詳細はこちらから

もっと見る

List

  • 2016/02/17

Pacman in HTML 5 Canvas - さぁ遊ぼう!HTML5製のパックマン

以前Googleがロゴをパックマンにしたことがありました。みんなそれに飛びついて遊び続け、経済的損失が1億2,048億ドルに達したと言われています。単純だけど、それだけにハマってしまう…それがパックマンの魅力と言えるでしょう。今回はそんなパックマンの恐怖再び、というHTML5ベースのパックマン、Pacman in HT...

List

  • 2015/12/10

Captain Icon - 手作り感あるアイコン集

Webサイトやアプリを作る際に必須なのがアイコンです。最近はフラットUIやマテリアルデザインの影響で、とてもシンプルなものが多くなっていますが、やはりアイコンは作りたいものに合わせて選ぶのが良いでしょう。今回はそんなアイコンを無償で公開しているCaptain Iconを紹介します。きっとぴったりくる時があるはずです。#...

List

  • 2015/11/26

Gridifier - アニメーションが格好良いグリッドライブラリ

コンピュータ上の表現としてグリッドは非常によく使われます。Excelのような表計算ソフトウェアはよく使われますし、テーブルや表もよく使われる表現です。しかしWeb上ではテーブルではなく、スタイルシートを駆使したグリッドが人気になっています。今回はグリッドのフィルタリング、並び替えが得意なGridifierを紹介します。...

List

  • 2015/11/23

Verreciel - どう遊ぶ?宇宙探索を楽しむiOSゲーム

宇宙にはロマンが溢れています。海底すら分かっていない人類ではありますが、遠い宇宙の先には心が躍るような経験が待ち受けているはずです。火星への移住計画もわくわくすることでしょう。そんな宇宙探索を体験できるアプリがVerrecielです。実際の遊び方はよく分かっていないのですが、分かる方はぜひお試しください。## Verr...

List

  • 2015/09/15

webm.js - Webブラウザ上でWebMエンコード

現在主流の動画フォーマットと言えばMPEG4ですが、オープンかつライセンス料無料で使える動画フォーマット、WebMも見逃せません。MPEG4よりもサイズが小さくなり、画質もほとんど変わらず利点の多いフォーマットです。問題はエンコーダーの存在であったり、再生するデバイスの多さにあるでしょう。そこで使ってみたいのがwebm...

List

  • 2015/09/13

Smoothslides - ケン・バーンズ効果を使ったカルーセル

最近はWebサイトにカルーセルを載せて写真をスライド表示するのを多く見かけるようになりました。大抵右から左に写真が流れていくものが多いのですが、あまり多いと見飽きてしまいます。これではせっかくの写真が印象に残りません。より写真を強調したカルーセルを考えるならばSmoothslidesを使ってみても面白そうです。## S...

List

  • 2015/07/18

SVG PORN - 各種サービスロゴをSVG化

SVGはHTML5になって標準化されているメディアフォーマットですが、まだあまり広く活用はされていません。ただし、現在の高解像度化であったり、幅広い画面幅に対応していこうと考えるとSVGのようなベクター画像はとても大事になっていくでしょう。今回はそんなSVGを使って各種サービス、ソフトウェアのロゴを描いたSVG POR...

List

  • 2015/03/13

wavesurfer.js - HTML5で音楽の波形を表示

Web上で音楽を楽しむ環境は整いつつあります。SoundCloudにアップしている人も多いですし、YouTube上にある音楽を聴く人も多いでしょう。そんな音楽メディアに欲しい情報として波形があります。wavesurfer.jsは音楽ファイルを読み込み、波形を表示してくれるJavaScriptライブラリです。JavaSc...

List

  • 2015/03/01

Subway – iOS/Windows Phone/BlackBerryでの利用を想定したシャープなアイコンセット

素敵なアイコンを探す旅は永遠に終わりません。ある時には小さくて可愛らしいものが流行ったかと思うと、次はシンプルでフラットなものが流行になります。古くさいデザインにならないためにも常に先進的デザインを追いかけなければなりません。今回は新しいアイコンセット、Subwayを紹介します。多数のモバイルデバイスに合わせたサイズが...

List

  • 2014/11/07

Material Icons - マテリアルデザイン向けに作られたGoogle製アイコン集

Googleが提唱しているフラットUIを発展させたデザインがマテリアルデザインです。アイコンを単純化して情報構造を明確にするだけでなく、さらにマウスオーバーやタップ時のアニメーション、色の変化をつけることでシステムがどういう状態にいるかが明確になります。そんなマテリアルデザインにフォーカスして作られたアイコン集がMat...

List

  • 2014/08/28

92five – 格好いいデザインのプロジェクト管理

プロジェクト管理、何を使っていますか。最近ではRedmineを使っている所が多いかも知れません。規模が大きくなるとMS Projectを使ったり、BasecampのようなWebサービスを使っている所もあるかも知れません。何となくプロジェクト管理は開発者向けのサービスとあって無骨なイメージがあります。今回はフラットなデザ...

List

  • 2014/07/31

HTML5 UP! - HTML5/CSS3製のレスポンシブHTMLテンプレート

新しいWebサービスを作ろうと思った時にはまずデザインにこだわりたいでしょう。最近ではスマートフォン、タブレットデバイスのサポートもあってデザインはさらに複雑になっています。これまでのデザインテンプレートでは対応できない場合も多いでしょう。そこで使ってみたいのがHTML5、レスポンシブWebデザインに対応したテンプレー...

List

  • 2014/07/10

RainLoop Webmail – PHP製のモダンなWebメールクライアント

Webメールはかつてフレームなどを使ったレガシーなUIからAjaxを使ったモダンなUIになって一気に進化しました。スパムフィルターや検索などを考慮すると個人のローカルよりもサーバサイドにある方が利便性は高いように思います。社内のセキュリティ上、Gmailなどは使えないケースもあるでしょう。そんな時にはモダンなWebメー...

List

  • 2014/06/02

WonderCMS - 大きなCMSに辟易しているなら試して欲しいDBいらずのCMS

Webサイトを作る際、殆どの場合CMSが欲しくなりますよね。かといって大型なものは入れるとデザインを変更するのも大変ですし、運用も面倒です。もっとシンプルに扱えるものが欲しいと思うのではないでしょうか。そこで試して欲しいのがWonderCMS、ごくごく小さなPHP製のCMSです。データベース不要で、手軽に使えそうです。...

None

  • 2014/06/01

おしえて!恋のプロトコル – プログラミングができるアイドル“ハックガールズ”デビュー曲

筆者はテレビを見ないのでアイドルなどは全然分かっていないのですが、皆さんはどのアイドルが好きでしょうか。自分の手の届かない存在としてのアイドルが好きな人も多いですが、最近ではAKB48のように会いにいけるアイドルというのが人気を集めています。そんな中、さらに自分たちと同じ話ができてしまうアイドル、ハックガールズが誕生し...

List

  • 2014/03/14

Google Docs writing tracker - Evernoteにも記録するGoogleドキュメントの作業ログ蓄積スクリプト

Google DriveはともあれGoogleドキュメントやスプレッドシートを使っているという人は多いかと思います。Googleドキュメントを使って日々文章を書いている方に使ってみて欲しいのがGoogle Docs writing trackerです。その名の通り、Googleドキュメントでの文章作成をトラッキングし、...

List

  • 2014/03/06

Glyphr - ここまで出来るとは!Webベースのフォントエディタ

フォントエディタとしては十分な機能ですね!Web Fontの影響もあって、フォント自体の魅力が見直されています。特徴的なフォントはもちろん、プログラミングしやすいフォントや可読性高いフォントなど普段使いできるものを知っていると重宝するでしょう。そんなフォントをWebベースで作成、編集できるのがGlyphrです。HTML...

List

  • 2014/02/04

i-am-cc.org – Instagramに投稿した写真をCreative Commonsで公開しよう

Instagramにあるいい感じの写真を使わせてもらいたいと思ったことはないでしょうか。しかしInstagramの写真はライセンスが明記されていないため使うのは控えてしまうでしょう。そんな問題を解決するために作られたのがi-am-cc.orgです。Instagramの写真を取り込み、Creative Commonsのも...

List

  • 2013/12/24

Unfolding the Box Model – 3Dを使ったCSS3テクニックのお手本にどうぞ!

CSS3の妙技満載!スタイルシートというとWeb上のテキスト装飾や配置を決定するものというイメージがありますがCSS3によってアニメーションや表示上のイフェクトをサポートするなどプログラミング並のことができるようになっています。そのためにはCSS3を駆使すれば何ができるのかを知らなければなりません。知った上でどこで活か...

List

  • 2013/12/18

Startup Framework: Demo Version - 新しくプロジェクトを開始するならベースにしよう!

デザイナー、開発者双方にとって嬉しいパッケージです。Webサイトをオープンして、アプリと絡めたイメージ写真を用意して…スタートアップはやることがたくさんあります。そんなスタートアップで必要とされるデザイン、HTMLをパッケージとして提供してくれるのがStartup Design Frameworkです。249ドルの有料...