こんにちは、デザイナーの藤田です!
毎回、同じことを言っておりますが、技術の進化と共にWebサイトの表現も目まぐるしく変わってきておりますね。
油断をすると次々と見たことのない表現が増えていく今日この頃なので、自身の備忘録も兼ねてサイト制作に取り入れたいWebデザインのトレンドをまとめてみました! よろしければ皆様もご覧ください。
2018年気になるWebデザイントレンド
画像を揺らす
デザインにひと味足す方法として、最近よく見かけるのがシェーダーで画像を揺らす手法。
アイキャッチに対して誘目性が高まりデザインに奥行き感が出るのが良いですね!
http://www.themustafacelik.com/
http://culture.basicagency.com/
パララックス
手前のものは早く動き奥のものはゆっくりと動く視差効果をスクロールアニメーションに取り入れるこの技術は4〜5年前に流行ったのですが、勝手にリバイバルするんじゃないのかなーって思ってます。
http://springsummer.gucci.com/
https://www.adidas.co.uk/speedfactory
テキストエリアの丁寧なアニメーション
テキストエリアのアニメーションといえばラインが出現しそのラインが抜けた時にテキストが出現するパターンと、下から上にアニメーションしながらテキストを出現させる2パターンが王道でしたが今年は回転や斜めのアニメーションを取り入れたサイトを多く見かけるようになってきました。
https://www.denso.com/jp/ja/innovation/technology/maas/
https://www.blues-d.co.jp/#/about/
モバイルビューを意識したサムネイルのアスペクト比
今まではWebサイトのサムネイルといえば横長画像を使用するのが主流でしたが、スマホで見ると画像の表示が小さくなってしまうので、縦長のサムネイルを使用するサイトを昨年頃から少しずつ見るようになった気がします。
https://www.open-wear.com/
https://supercrowds.co/projects
カーソルのオリジナルデザイン
こちらの手法も昨年頃から多く見かけるようになってきたと思います。
この辺のUIを変更すると「ユーザービリティが悪くなる」とか言われそうですけど、見た目のプライオリティーが高いような案件では取り入れていきたいテクニックのひとつですね。
http://twotwentytwo.se/
http://www.ronin161.com/
まとめ
どれもおしゃれなサイトばかりでしたね!
それではまた!
・
・
・
Web制作会社LIGではデジタルハリウッド社と組みWebデザインスクールも運営しています。ご興味があればこちらから詳細をご覧ください!
Webデザインスクール「デジタルハリウッドSTUDIO by LIG」
LIGはWebサイト制作を支援しています。ご興味のある方は事業ぺージをぜひご覧ください。