週刊Webテク通信
2020年7月第1週号 1位は,カード型UIをデザインするためのヒント,気になるネタは,モバイル版「Googleフォト」大幅刷新 検索しやすく,マップ連携表示が可能に
ネットで見かけたWebテク
1. Simple Design Tips for Crafting Better UI Cards - UX Planethttps:// uxplanet. org/ simple-design-tips-for-crafting-better-ui-cards-19c1ac31a44e/
カード型UIコンポーネントをデザインするためのヒントを紹介しています。
- 内容に関連する画像を使う
- 大事な文字情報だけに絞る
- 本文にはシンプルな書体を使う
- カードとわかるように影をつける
- カード内のインタラクティブな要素を明確に示す
- モバイル環境ではカード内でのスクロールを使わない
- 詳細情報を表示するとき親から子への遷移を使う
- よく使われているジェスチャー操作に対応する
2. An Overview of Scroll Technologies | CSS-Trickshttps:// css-tricks. com/ an-overview-of-scroll-technologies//
スクロール関連のテクノロジーについてまとめた記事です。
以下は,
- 特定の位置で固定される
(position: sticky;) - 視差効果
- 特定の位置にスナップ
- スムーズスクロール
また,
3. Design Trend: Geo Shapes & Patterns (With Animation) | Design Shackhttps:// designshack. net/ articles/ trends/ geo-shapes-patterns-animation//
幾何学的図形とパターンを使ったデザイントレンドをまとめています。
- アニメーションする背景
- 3Dシェイプとアニメーション
- 触感のある動き
- ロゴアニメーションの読み込み
- 視差スクロールと幾何学的図形
- 幾何学的なホバーアニメーション
- デザインテーマとしての幾何学的図形
- タイムラインアニメーション
4. The Finest Collection of UI/ UX Patterns & Exampleshttps:// www. niceverynice. com/ components/
UI/
画像だけで,
5. How to Enhance Your Website Layouts With SVG Shapeshttps:// webdesign. tutsplus. com/ tutorials/ website-layouts-with-svg-shapes--cms-35259/
SVGシェイプを使って複雑な形状で画像をトリミングする方法を解説した記事です。
全画面の背景ビデオ,
そのほか,
- Facebook,
古すぎる投稿をシェアしようとすると 「古いですよ?」 と確認する機能 - ITmedia NEWS
この機能はTwitterにもあった方がいいと思います - Zoom活用の有料オンラインイベントを簡単に開催できる
「amply」 ローンチ | TechCrunch Japan
日本のスタートアップが提供するサービスです - 飲食店向けテークアウト支援サービス 「おもちかえり.com」
提供 新型コロナ対策機能も - ITmedia Mobile
元マイクロソフトの有名ソフトウエアエンジニアの中島聡さんが作ったサービスですね
先週の気になるWebサービス
Formbuttonhttps:// formspree. io/ formbutton/
Formbuttonはポップアップするお問い合わせフォームをサイトに追加できるサービスです。フォームの内容をメール送信するFormspreeの類似サービスとなっています。
テキスト,
無料で使えるプランがあるのが嬉しいですね。しかも,
今週の気になるWebネタ
モバイル版 「Googleフォト」 大幅刷新 検索しやすく, マップ連携表示が可能に - ITmedia Mobilehttps:// www. itmedia. co. jp/ mobile/ articles/ 2006/ 26/ news051. html
GoogleフォトアプリのAndroid&iOSアプリが大幅に刷新,
写真を探す
iPhoneユーザーも使っている人が多いGoogleフォト,
バックナンバー
週刊Webテク通信
- 2020年7月第5週号 1位は,2020年のUIデザインのトレンド,気になるネタは,テレビ会議でのプレゼン映像をかっこよくする仮想カメラアプリ「mmhmm」登場
- 2020年7月第4週号 1位は,JavaScriptを使ったハンバーガーメニューの代替3案,気になるネタは,G Suite向けGmailがChat,Meet,Roomを統合
- 2020年7月第3週号 1位は,ウェブデザインが似通っている理由とその対策,気になるネタは,Web会議「Microsoft Teams」にバーチャルルームに集まれる「Togetherモード」
- 2020年7月第2週号 1位は,ボタンデザインの良い例・悪い例,気になるネタは,NAVERまとめ終了 11年の歴史に幕
- 2020年7月第1週号 1位は,カード型UIをデザインするためのヒント,気になるネタは,モバイル版「Googleフォト」大幅刷新 検索しやすく,マップ連携表示が可能に
関連記事
- 2020年11月第2週号 1位は,Google新アイコンの区別の付きにくさを改善する試み,気になるネタは,自撮り画像を他人が撮ったように変換する技術「Unselfie」 Adobeなど開発
- 2020年8月第4週号 1位は,レスポンシブデザインとアダプティブデザインの比較,気になるネタは,C Channel,アプリサービスを9月末で終了へ--SNSでのコンテンツ配信にシフト
- 2020年8月第3週号 1位は,ユーザー体験を向上させるCSSアニメーションについて,気になるネタは,「顔が明るく見えるライトや壁紙を購入」――“オンライン映え”気にするのは20代男性? 賢く見えるよう本の購入も
- 2020年5月第4週号 1位は,古いCSSの問題に対する現代的なCSS解決策まとめ,気になるネタは,Housepartyは一緒にイベントを楽しむサービスでビデオチャットを超える
- 2020年4月第5週号 1位は,説得力のあるランディングページの作り方,気になるネタは,隔離生活で求められる自然発生的なコミュニケーションを生むソーシャルアプリ