週刊Webテク通信

2018年10月第4週号 1位は,スライダーがダメな理由と,どうしてもスライダーを使いたい場合の改善策,気になるネタは,iPadにPhotoshop“完全版”がやってくる--2019年登場,イラスト特化の新アプリも

この記事を読むのに必要な時間:およそ 2 分

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

1. Why Web Sliders Suck and 5 Ways To Fix Them - UX/UI Advicehttps://dconstrct.com/product-and-design/sliders-suck-how-fix-them/

スライダーがダメな理由と,クライアントがどうしても使いたいという場合にスライダーを改善する方法を紹介しています。

スライダーのUX的に悪いところ
  • 切り替わりが速すぎて読めないことがある
  • 広告に見えるので無視される
  • アクセシビリティが悪い
スライダーのSEO的に悪いところ
  • サイトが重くなる
  • コンテンツが押し出されて表示されなくなることで検索結果のランクが下がる
  • モバイルデバイスでうまく表示されない
どうしてもスライダーを使いたい場合の改善策
  1. メインイメージとして使わず,文字の入っていない画像だけのスライダーにしてメインコピーの横などに配置する
  2. スライドを3つ以下にして,最も重要なものを1枚目にする
  3. 自動再生をやめてユーザーの操作で次のスライドに移るようにする
  4. スワイプで動かせるなど,モバイルユーザーに配慮する。モバイル用に別画像を用意するなどファイルサイズにも気をつける
  5. A/Bテストをする

図1 スライダーがダメな理由と,どうしてもスライダーを使いたい場合の改善策

図1 スライダーがダメな理由と,どうしてもスライダーを使いたい場合の改善策

2. Top 5 Graphic Design Trends of 2018 (+ a Preview of 2019) | Design Shackhttps://designshack.net/articles/trends/graphic-design-trends/

2018年のグラフィックデザインのトレンドを5つまとめています。

  1. 明るい色
  2. 三次元の静物要素
  3. グラデーション
  4. 最小限のナビゲーション
  5. カラーオーバーレイ写真

また,2019年のトレンドとしては以下の項目が挙がっていました。

  1. ベージュ色
  2. VRとMR(Mixed Reality)
  3. スクリプトフォント
  4. 「バグった」ような効果
  5. ホンモノのイメージ

図2 2018年のグラフィックデザインのトレンド

図2 2018年のグラフィックデザインのトレンド

3. Everything you need to know about skeleton screens – UX Collectivehttps://uxdesign.cc/what-you-should-know-about-skeleton-screens-a820c45a571a

スケルトンスクリーンについて,その概要や定義から,効果的な設計方法までをまとめた記事です。

スケルトンスクリーンとは,データの読み込み中に表示する,骨組み状態の画面のこと。本当に読み込み時間を短く感じさせる効果があるのか,どのように設計すればより効果的かなどのテスト結果を報告しています。

図3 スケルトンスクリーンについてまとめた記事

図3 スケルトンスクリーンについてまとめた記事

4. The Evolution of Website Web Design Trends from the 90s to Nowhttps://line25.com/articles/website-web-design-trends-evolution

90年代から現在までのウェブデザインのトレンド・進化をざっくりとまとめた記事です。

  • 1995~2003年 クリックしてください
  • 2000年 ホワイトスペース
  • 2003~2010年 Web 2.0
  • 2010~2012年 スキュアモーフィックデザイン
  • 2014~2016年 無限スクロール
  • 2012年~現在 ミニマリズムデザイン

図4 90年代から現在までのウェブデザインの進化のまとめ

図4 90年代から現在までのウェブデザインの進化のまとめ

5. The Hidden Power of Reward Systems In Design – UX Planehttps://uxplanet.org/the-hidden-power-of-reward-systems-in-design-78e2dd7b6bf6

アプリやサービスをデザインする上での,リワード(ご褒美・報酬)の秘めたる力について解説しています。

リワードには以下のようなものがあります。

  • 記事を全部見終わったら特別なメッセージが出る
  • Facebookなどソーシャルメディアでの「いいね!」の仕組み
  • ゲーム的要素を取り入れる
  • 商品や金銭などの報酬を与える

図5 リワード(ご褒美・報酬)の秘めたる力について

図5 リワード(ご褒美・報酬)の秘めたる力について

そのほか,最近の記事の中から,気になるニュース記事を紹介します。

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

Planable | Social Media Collaboration and Approval Platformhttps://planable.io/

Planableは,ソーシャルメディアのコンテンツ管理のためのWebサービスです。Instagram,Facebook,Twitter,LinkedInのアカウントを管理できます。

この手のサービスはいくつかありますが,各ソーシャルメディアに投稿したときの見え方をプレビューできるのが特徴です。非公開のアカウントで実際に投稿して,画像の見え方などを確認している人もいるくらいなので,簡単にチェックできるのは便利ですね。

チームでコンテンツを管理したりコメントのやり取りができ,ユーザーごとに権限を変えられます。スケジュール投稿も可能です。有料のサービスで,一番下のプランは24ドルからとなっています。

図6 ソーシャルメディアのコンテンツ管理ツール

今週の気になるWebネタ

iPadにPhotoshop“完全版”がやってくる--2019年登場,イラスト特化の新アプリも - CNET Japanhttps://japan.cnet.com/article/35127035/

ついに来年にはiPadでパソコン版と同等のPhotoshopが使えるようになる予定です。タッチ操作&Apple Pencilで,パソコン版より使いやすそうという声も出ています。

作業内容にもよりますが,Photoshopでのレタッチにペンタブレットを使っている人も多いですし,タッチ操作&Apple Pencilとの親和性は高そうです。マンガ制作ソフト・CLIP STUDIO PAINTのiPad版登場のときも大騒ぎになりましたが,今回はそれ以上の衝撃となるでしょう。

個人的には一緒に発表されたイラスト制作アプリ「Project Gemini」も気になります。ビットマップとベクター両対応というところが魅力的です。こちらはまずはiPad版が出るようですが,パソコン版,スマホ版も出るようで楽しみです。

著者プロフィール

芦之由(あしのよし)

Webデザインやサイト制作に役立つブログ記事やニュースをほぼデイリーでお届けするメルマガ「デイリーWebテク」発行人。フリーのWebデザイナー兼イラストレーター&ライター。シャープMZ-80Bからのパソコンユーザーで,Macintosh IIciからのMacユーザー。嫌いな言葉は「IEで見ると表示が崩れてるよ」。

デイリーWebテクの購読やバックナンバーについては,以下の紹介サイトをご覧ください。

デイリーWebテク - Webテク関連の話題を毎日配信 -
URLhttp://www.rgs680.com/dwt/

コメント

コメントの記入