input要素にフォーカスした際のアニメーションエフェクトをいろいろまとめた・「Awesome input focus effects」 Awesome input focus effects Awesome input focus effectsはinput要素にマウスフォーカスした際のエフェクトのまとめです。borderやbackground、placeholder...2016.04.21 | 9時49分39秒
グリッドレイアウトのポートフォリオサイトを手軽に作成する為のシンプルなスクリプト・「gridfolio.js」 gridfolio.js gridfolio.jsはグリッドレイアウトのポートフォリオサイトを手軽に作成できるJavaScript製のジェネレーターです。gridfolio.jsにコンテナのタイトルやアイキャッチ、リンク先、スタイルや...2016.04.20 | 9時49分11秒
SVGにも対応の手軽にダイアグラムを作成できるフリーのグラフエディタ・「yEd」 yEd yEdはフローチャートのようなダイアグラムを作成出来るフリーのソフトウェアです。SVGにも対応しておりWindows、Max OS、Linuxなど主要プラットフォームにも対応しています。手動による作図はもちろん、外部データをイ...2016.04.19 | 10時21分28秒
データを可視化する際の表現パターンをいろいろとまとめたカタログサイト・「The Data Visualisation Catalogue」 The Data Visualisation Catalogue The Data Visualisation Catalogueはいろいろなデータを棒グラフや円グラフ等、可視化する際の表現方法をまとめたカタログサイトです。データには...2016.04.18 | 9時42分26秒
モダンでクリーンなレスポンシブWebデザイン対応のフレームワーク・「Spectre.css」 Spectre.css Spectre.cssはモダンでシンプル、クリーンなCSSフレームワークです。RWD対応で軽量、UIコンポーネントも充実しています。HTMLメールも用意されてるみたい。また、日本や中国、韓国といったアジアのフォ...2016.04.17 | 10時14分57秒
ツリー構造データを可視化するためのシンプルな非依存型スクリプト・「treeData.js」 treeData.js treeData.jsはツリー構造のデータを可視化する為のスクリプトです。シンプルな仕様で、単純に可視化するためだけのものとなっていますので他スクリプト等への依存もなく、コードも少なく実装も容易です。使い勝手は...2016.04.16 | 9時16分42秒
jQueryで作られたオープンソースのシンプルなTodoアプリ・「LobiList」 LobiList LobiListはjQuery製のToDoアプリです。OSSとして公開されています。上図のように複数リストも設定可能で基本的なToDoアプリの性能は揃っている印象でした。シンプルで使いやすそうですし、手軽に作れるのは...2016.04.15 | 10時58分10秒
レスポンシブWebデザイン対応のHTMLメールフレームワーク・「Outline Mail」 Outline Mail Outline MailはRWDなメールのHTMLフレームワークです。スマフォの普及で以前より需要が増している印象です。HTMLメールのRWD対応は通常のWebページとは少し勝手が違うのでこの手のフレームワー...2016.04.14 | 9時31分06秒
日本語にも対応のHTMLをPDFに変換するOSS・「Athena」 Athena AthenaはHTMLからPDFへ変換するコンバートツールです。日本語を含め、数百もの多言語に対応しているそう。URLを指定すれば変換してくれます。wkhtmltopdfの代替として開発、OSSとして公開されています。今...2016.04.13 | 14時32分18秒
フリーで公開されたWebデザイン向けのリソースをまとめている・「Freebiesbug」 Freebiesbug FreebiesbugはWebデザイン向けのリソースで無料で公開されているものだけをまとめているWebサイトです。テンプレートやCSSフレームワーク、ちょっとしたコードスニペットの紹介ページやPSDファイル、フ...2016.04.12 | 10時25分20秒
静的なHTMLファイルを編集可能にするシンプルなCMS・「SiteCake」 SiteCake SiteCakeは通常の静的なHTMLを編集可能にするシンプルなCMSです。プログラミングの知識も不要でプレーンなHTMLを編集可能になします。コンテンツはドラッグ&ドロップで調整出来てデータベースも不要との事。どこ...2016.04.11 | 10時25分25秒
canvasを使ったシンプルなドローライブラリ・「atrament.js」 atrament.js atrament.jsはcanvasを使ったシンプルなドローライブラリです。色やペンの太さ、消しゴム、透過機能などが揃っています。他ライブラリへの依存も無く、圧縮版で7KBほどと軽量です。滑らかで動作も軽いドロ...2016.04.10 | 9時29分41秒
Markdownで書ける、Wikiベースの日本国産オープンソースなコミュニケーションツール・「Crowi」 Crowi Crowiは日本国産のオープンソースなWikiです。コミュニケーションツールとしてのWikiを目指したシンプルな設計となっているそう。もう1~2年前に公開されていたようですが最近知ったばかりでしたのでメモも兼ねて。国産なの...2016.04.09 | 11時08分57秒
can I useの特定の項目のブラウザ対応表をWebサイトに埋め込める・「The (Unofficial) CanIUse Embed」 The (Unofficial) CanIUse Embed Can I Use transforms3d? Data on support for the transforms3d feature across the maj...2016.04.08 | 10時32分38秒
Webアプリ向けに設計された非依存型で軽量なツールチップ実装スクリプト・「Popper.js」 Popper.js Popper.jsは常に見やすい状態に維持してくれるツールチップ実装スクリプトです。圧縮版で3.5KBと軽量且つ非依存型で単体で動作してくれます。うまく説明出来ませんが、任意のコンテナにツールチップを表示した際、ス...2016.04.07 | 9時49分19秒
インタラクティブなグラフやチャートの為のjQueryプラグイン・「FusionCharts」 FusionCharts FusionChartsはインタラクティブなグラフやチャート構築の為のスクリプトです。jQueryに依存してます。シンプルなグラフはもちろん、3Dな円グラフや棒や線などの複合チャート、エクスポート機能の他、J...2016.04.06 | 10時13分08秒
様々なUIのデザインをパーツ別に収集しているギャラリーサイト・「Collect UI」 Collect UI Collect UIは様々なUIデザインを収集しているギャラリーサイトです。よくあるギャラリーサイトですが、他と違う点は大量のカテゴリに分けられている点です。主なソース元はDribbbleだそうですが、自動ではな...2016.04.05 | 9時49分54秒
ブラウザやOS、デバイス等を検出してclassを付与するスクリプト・「Detectr.js」 Detectr.js Detectr.jsはブラウザやOS、デバイス等を検出してclassを付与するスクリプトです。他ライブラリに依存せず単体で動作し、圧縮版で3.6KByと軽量です。下記のようにclassが付与されます。 ...2016.04.04 | 12時13分28秒
画像にblur効果を与えるためのシンプルなスクリプト・「Image Blur Plugin」 Image Blur Plugin Image Blur Pluginは画像にぼかし効果を与えるためのシンプルなスクリプトです。jQueryに依存します。いわゆるblur効果を簡単に付与できる、というもの。オールドブラウザも含め、...2016.04.03 | 9時41分38秒
再利用も視野にいれたオブジェクト指向CSSフレームワーク・「RichCSS」 RichCSS RichCSSは再利用も視野に入れて設計されたオブジェクト指向のCSSフレームワークです。各コンポーネント毎にファイルを別にしているみたいですね。クリーンなCSS設計になるよう心がけて設計してあるそうです。隙を見て触っ...2016.04.02 | 10時51分16秒
任意のテキストをクリックで表示させるシンプルな注釈スクリプト・「Expounder」 Expounder Expounderはクリックで任意のテキストを表示させるシンプルなスクリプトです。タイトルだけだとうまく説明できなかったのですが、百聞は一見に如かずという事で上記の動作サンプルを用意しました。注釈系のスクリプトです...2016.04.01 | 10時57分28秒
HTML5製の管理画面構築のためのOSSなダッシュボードフレームワーク・「RazorFlow」 RazorFlow RazorFlowはHTML5製のダッシュボード用フレームワークです。オープンソースとして公開されています。円グラフや棒グラフ等のチャート、管理画面のスタイルビルダー、リアルタイム更新、軽量且つ高速でタッチデバイス...2016.03.31 | 10時28分50秒