週刊Webテク通信

2013年8月第4週号1位は、Webデザインに役立つツールやジェネレータを探せるサイト、気になるネタは、「イマつぶ」「イマつぶLIVE」サービス終了

ネットで見かけたWebテク(Webテクニック・Webテクノロジー)記事から、Webデザイナーの目で厳選したネタを週刊で紹介するこのコーナー。今回は、2013年8月19日~8月25日の間に見つけた記事のベスト5です。

1. 80+ Essential Web Design Tools For The Web Developers in 2013http://www.divine-project.com/web-design-tools

Webデザインに役立つツールやジェネレータを探せるサイトです。

以下のカテゴリに分けて掲載されています。

  • ワイヤーフレーム作成
  • CSSグリッドのフレームワーク
  • JavaScriptライブラリとjQueryプラグイン
  • 配色ツール
  • CSSジェネレータ
  • ベクターアイコンとアイコンフォント
  • アイコン検索エンジン
  • レスポンシブデザイン用ツール
  • 文法チェック
  • デザインのフィードバックが得られるサイト
  • コラボレーションサービス
  • ドキュメント作成ツール
  • オンライン画像編集ツール
  • Photoshopファイル形式のUIキット
  • WordPressテーマ
図1 Webデザインに役立つツールやジェネレータ
図1 Webデザインに役立つツールやジェネレータ

2. Pros and Cons of Flat Design - Designmodohttp://designmodo.com/pros-cons-flat-design/

フラットデザインの長所と短所を考察した記事です。

以下の項目について、いい点と悪い点とが解説されています。

  • 流行していること
  • インターフェイスがシンプルなこと
  • 明るくはっきりした色の使用
  • 目立つタイポグラフィ
  • シンプルであること
  • デザインの装飾について

また、フラットデザインに関してのFlat Design Is Not A Trend, It's Been Around For Some Timeという記事も参考になります。

図2 フラットデザインの長所と短所
図2 フラットデザインの長所と短所

3. Getting Inspired By Innovative User Experience Concepts - The Usabilla Bloghttp://blog.usabilla.com/getting-inspired-by-innovative-user-experience-concepts/

革新的なユーザー体験を得られそうな、ユーザーインターフェイスのアイデアを紹介しています。

iPadのソフトウェアキーボード上で指をスライドさせることでカーソル移動や選択ができる機能のアイデアはいいですね。

図3 ユーザーインターフェイスのアイデアいろいろ
図3 ユーザーインターフェイスのアイデアいろいろ

4. Living Your Desing Life with Dribbble: Tools and Apps - Template Monster Bloghttp://blog.templatemonster.com/2013/08/21/dribbble-tools-and-apps/

Dribbble関連のツールやアプリを紹介した記事です。

デザイナーのポートフォリオ&ソーシャルメディアサイトのDribbbleを、便利に使うためのAndroid/iOSアプリやWebアプリ、Dribbble APIを利用するためのスクリプトなどが紹介されています。

図4 Dribbble関連ツールとアプリ
図4 Dribbble関連ツールとアプリ

5. 30+ Examples of Most Impressive Websites Using Unusual and Creative Navigation | StunningHubhttp://stunninghub.com/30-examples-of-most-impressive-websites-using-unusual-and-creative-navigation/

クリエイティブで変わったナビゲーションのWebサイトを多数紹介しています。

変わったインターフェイスながら自然と使い方が分かるサイトが多く、そこが優れたナビゲーションということなのでしょう。

図5 クリエイティブなナビゲーションのサイトのギャラリー
図5 クリエイティブなナビゲーションのサイトのギャラリー

そのほか、最近の記事の中から、気になるツールを3つ紹介します。

先週の気になるWebサービス

Bunkr is more than just a presentation tool: collect, organize, presenthttps://www.bunkr.me/

Bunkrは、プレゼンスライドが簡単に作れるWebサービスです。作成したスライドはHTML5のコンテンツとなるので、生成されたURLにリンクするかiFrameで埋め込むことで公開できます。また、PDFかパワーポイントファイルとして書き出すことも可能です。

ネット上の画像やムービーなどをクリッピングしておき、それらを元にプレゼンスライドを作るといったアプローチが特徴です。このサービス上でGoogle画像検索とYouTube検索が使え、検索結果からどんどんクリッピングしていけます。NAVERまとめっぽい感じで、プレゼンが作れるサービスとも言えそうです。

ブックマークレットを使うと、Webブラウズ中に見ているサイトからコンテンツをクリッピングできます。もちろん、手持ちの画像をアップロードする機能もあります。

プレゼンスライドは、ページ切り替え効果などの動きのある機能はなく、単純な紙芝居のようなものしか作れません。凝ったプレゼンを作るというより、とにかく素早く資料を作るツールだと感じました。

無料プランだと、作成できるプレゼンが2つまでなどの制限があります。月3ドルのプロ版にすると、作れるプレゼン数に制限がないほか、コラボレーション機能などが使えるようになります。

図6 プレゼンスライドが簡単に作れるWebサービス
図6 プレゼンスライドが簡単に作れるWebサービス

おすすめ記事

記事・ニュース一覧