ネットで見かけたWebテク
1. 3 great ways to build a website prototypehttp://thenextweb.com/dd/2016/07/28/3-badass-ways-build-website-prototype/
プロトタイプを作るための3種類の方法と、
- Keynoteなどのプレゼンテーションソフトを使う
- コーディングしてプロトタイプを作る
- UXPinなどのプロトタイプ用のソフトウェアやアプリを使う
3つの方法ごとに、
![図1 プロトタイプを作るための3つの方法 図1 プロトタイプを作るための3つの方法](/assets/images/design/clip/01/weekly-web-tech/201608/04/thumb/TH800_001.png)
2. 16 Prototyping Tools & How Each Can Be Used (Updated — 2 more tools added) — Prototyping: From UX to Front Endhttps://blog.prototypr.io/14-prototyping-tools-how-each-can-be-used-1c804fab33a6#.q52lv1ds8
プロトタイプを作るためのツールを分類分けして紹介した記事です。
「モバイル向け/
![図2 プロトタイプを作るためのツール 図2 プロトタイプを作るためのツール](/assets/images/design/clip/01/weekly-web-tech/201608/04/thumb/TH800_002.png)
3. Web Design in 4 minuteshttp://jgthms.com/web-design-in-4-minutes/
「4分間でのWebデザイン」
最初は何もデザインされていないテキストだけの状態から、
![図3 Webデザインの初級テクニックを学べるページ 図3 Webデザインの初級テクニックを学べるページ](/assets/images/design/clip/01/weekly-web-tech/201608/04/thumb/TH800_003.png)
4. How Progress Bar Indicators Help In Mobile UX Design?https://think360studio.com/how-progress-bar-indicators-help-in-mobile-ux-design/
プログレスバーによるインジケーターについてまとめた記事です。
進行状況をユーザーに伝えるインジケーターについて、
- フィードバックへの鍵
- 種類
- ループアニメーション
- 整列したループアニメーション
- システム標準の/
カスタマイズしたループアニメーション - 直線のアニメーション
- 革新的なアニメーション
- ステップの表示
- 骨組みの表示
- 静的なインジケーターを避ける
- 2度クリックすることへの警告を残す
- 退屈さをなくす
![図4 プログレスバーによるインジケーターについてまとめ 図4 プログレスバーによるインジケーターについてまとめ](/assets/images/design/clip/01/weekly-web-tech/201608/04/thumb/TH800_004.png)
5. 50 Beautiful Websites with Blurred Backgrounds for Your Inspiration - Hongkiathttp://www.hongkiat.com/blog/blurred-backgrounds-web-design/
ぼやけた画像が背景のWebサイトのギャラリーです。
ぼやけた画像はグラフィックデザインのトレンドで、
![図5 ぼやけた画像が背景のWebサイトのギャラリー 図5 ぼやけた画像が背景のWebサイトのギャラリー](/assets/images/design/clip/01/weekly-web-tech/201608/04/thumb/TH800_005.png)
そのほか、
- Become a Sketch Pro with 9 Tiny Tips — Design + Sketch App — Medium
Sketchのテクニックをまとめた記事です - How To Create Icons In Adobe XD – Smashing Magazine
Adobe XDでアイコンを作る方法を紹介しています。
先週の気になるWebサービス
Tagboardhttps://tagboard.com/
Tagboardは、
アのアカウントで認証するとTagboard上で投稿への「いいね」やリツイートなどもできますが、Instagramの投稿にリアクションはできませんでした。
検索結果を
「Tagboard」
![図6 複数のソーシャルメディアを横断してハッシュタグ検索できるサービス 図6 複数のソーシャルメディアを横断してハッシュタグ検索できるサービス](/assets/images/design/clip/01/weekly-web-tech/201608/04/thumb/TH800_006.png)