ネットで見かけたWebテク
1. 10 best bootstrap design tools for 2014http://smashinghub.com/10-best-bootstrap-design-tools-for-2014.htm
Bootstrapを使ったサイトをデザインするための便利なツールをまとめた記事です。
UIのパーツをドラッグ&ドロップで配置してサイトのモックアップを簡単に作成できるツールなど、
ボタンのジェネレーターや、
![図1 Bootstrapでデザインするためのツールいろいろ 図1 Bootstrapでデザインするためのツールいろいろ](/assets/images/design/clip/01/weekly-web-tech/201312/12/thumb/TH800_001.jpg)
2. 10 free scrolling plugins for awesome experiences | Desizn Worldhttp://www.desiznworld.com/2013/12/free-scrolling-plugins-for-websites.html
スクロール関連のjQueryプラグインを紹介しています。視差スクロールや、
スクロールで見せていくタイプのWebサイトの実例も紹介されています。
![図2 スクロール関連のjQueryプラグインやサンプル 図2 スクロール関連のjQueryプラグインやサンプル](/assets/images/design/clip/01/weekly-web-tech/201312/12/thumb/TH800_002.jpg)
3. Beautiful Examples of Login Forms for Websites and Apps - Designmodohttp://designmodo.com/login-forms-websites-apps/
Webサイトやモバイルアプリのログインフォームのデザインギャラリーです。
フラットでシンプルなログインフォームが集まっている印象を受けました。
![図3 ログインフォームのデザインギャラリー 図3 ログインフォームのデザインギャラリー](/assets/images/design/clip/01/weekly-web-tech/201312/12/thumb/TH800_003.jpg)
4. Get The Most Out of Tumblr: 20 Tips, Tricks & Toolshttp://www.hongkiat.com/blog/tumblr-tips-tricks-tools/
Tumblrのちょっとしたテクニックを20個紹介しています。
- ダッシュボードでのキーボードショートカット
- フォローボタン、
シェアボタンのカスタマイズ - 以前のテンプレートに戻す
- 記事の一括編集
- スケジュール投稿
上記のようなテクニックや、
![図4 Tumblrのテクニックを20個紹介 図4 Tumblrのテクニックを20個紹介](/assets/images/design/clip/01/weekly-web-tech/201312/12/thumb/TH800_004.jpg)
5. 230+ Free PSD Templates {UI, Icons, Mockups, Flyers & Web Templates} | Ginvahttp://ginva.com/2013/12/230-free-psd-templates/
Webデザインに使えそうなPhotoshop素材のテンプレートファイルを大量に集めています。
UIデザインやアイコン、
![図5 Photoshop素材のテンプレートファイルいろいろ 図5 Photoshop素材のテンプレートファイルいろいろ](/assets/images/design/clip/01/weekly-web-tech/201312/12/thumb/TH800_005.jpg)
そのほか、
- GmailとGoogleカレンダーのデータダウンロードがようやく可能に - ITmedia ニュース
やっとで全データをダウンロードできるようになりました - スマホでUSEN: 曲・
トーク番組を配信する550チャンネル以上が月額490円で聴き放題! - たのしいiPhone! AppBank
意外と安い金額でUSENがスマートフォンで聴けるようです “OK, Google” で即座に音声入力が可能になるChromeの音声検索エクステンションがリリース | TechCrunch Japan
Google検索のページがChromeのアクティブなタグになっている必要があるそうです
先週の気になるWebサービス
CSS Shapes Generatorhttp://coveloping.com/tools/css-shapes-generator
CSSで図形を作るためのジェネレーターです。四角形をはじめ、
あらかじめ用意されたテンプレートをベースに、
作成できたらHTMLとCSSをコピーして使用します。最近はFireworksだけでなくIllustratorでも描いた図形のCSSが取得できる機能が付きましたが、
![図6 CSSで様々な図形を作るためのジェネレーター 図6 CSSで様々な図形を作るためのジェネレーター](/assets/images/design/clip/01/weekly-web-tech/201312/12/006.jpg)