ウェブサイトのアニメーション・スクロール編

みなさまこんにちは。原田です。
ウェブサイトにはスクロールした時にアニメーションをつけることができます。
様々なアニメーションがある中で、今回は画像に動きを付けるアニメを作ってみたのでご紹介したいと思います。

こちらより見てみてください。

普通の状態だとスクロールしたタイミングに合わせて画像が上下しますが、このアニメを付けることで少し画像がずれて動いているように見えますね。
上下にスクロールを繰り返してみると画像がふわふわ浮いているように錯覚すると思います。

ウェブサイトの中に少しアクセントとしてこのようなアニメーションを取り入れてみると、よりサイトを見るのが楽しめると思います。

WEBデザインに「真っ黒」はNG?

11月も後半に差し掛かり、暖かくなったり寒くなったり気温の変化に体調が全く追いついていない小松でございます。

さて今回は「黒」についてお話していきたいと思います。

WEBデザインにおいて黒色は欠かせない存在と言っても過言ではないでしょう。
時にはかっこよく、時には上品にオールマイティでとっても重宝されるカラーです。

WEBデザインに「真っ黒」が避けられている理由

そんな黒色ですが、実はWEBデザインで「真っ黒(#000)」は使わない方が良いと言われているのをご存知でしょうか?

代表的な理由は…
目が疲れるからです。

真っ黒は強いコントラストを生み、画面を見ている人にとっては目に負担がかかります。
特にデジタル画面ではバックライトの影響で、真っ黒が「目を痛める」色として感じられることがあります。
これが長時間の閲覧になると、ユーザーにとって「疲れやすい」画面になりやすいのです。

そのほかにも
WEB画面に置くと少し「不自然な黒」に見えてしまうことや、ディスプレイによって見え方が変わってしまうことから真っ黒が避けられています。

見やすさとスタイリッシュさを両立!おすすめの「黒に近い」カラー

真っ黒を避けたいときに使えるおすすめの色には、#111111(オフブラック)や#333333(チャコールグレー)があります。
どちらも黒に近い色ですが、画面上で目に優しく、かつ高級感のある印象を与えてくれます。
これらの色は、白やその他の色ともなじみやすく、コントラストが強すぎないため、ユーザーに優しいデザインになります。

まとめ

WEBデザインで「真っ黒」を避けるべき理由は、ユーザーの目に優しく自然な見た目を実現するためです。

強すぎる黒よりも、やわらかく洗練された黒に近いグレーを選ぶことで、どんな環境でも見やすく、スタイリッシュな印象のデザインを作れます。
少しの違いのように見えてユーザビリティに関わる大切な部分なので意識にしていきたいですね。

もちろん「真っ黒」を使ってはいけない訳ではありません。
見出しや重要なパーツを際立たせる効果もあり、あえて使うことで他の要素とのコントラストが引き立ち、視線を誘導することができます。

黒を使う際は、「デザイン全体の見やすさ」と「メリハリをつけたい部分」のバランスを意識することで、より洗練されたWEBデザインに仕上がります。

黒を効果的に生かしたデザイン…研究のしがいがありそうです。

寒さに負けないために白湯

こんにちは、今週の担当の梁瀬です。
先週は木枯らし1号が吹き、急に冬の寒さがやってきましたね。
今回は、これから訪れる冬に備えて、体調を崩さないための対策について、
チャットGPTから勧められたアイデアをご紹介します!

白湯を飲む!

白湯を飲むことで、体を内側から温めるだけでなく、代謝を高め、免疫力をサポートして
くれるそうです。
朝一番に飲むと、消化器官を整え、デトックス効果が期待でき、
おやすみ前に飲むと、リラックス効果が得られて、快眠を促してくれるとのことでした。

少し気が早いですが、
これから年末に向けて忙しい時期になりますね。
白湯を取り入れて、元気に新年を迎えたいです!

名作ドラマ

こんにちは。今週は瀧浪が担当です。
我が社の休憩室にひっそり存在しているDVD「恋のチカラ」をお借りし、初めて観たお話です。

1990年代の名作ドラマで、人生やデザインの仕事に向き合う姿勢が心に響くドラマでした。
主人公が恋愛や仕事で悩みながらも、自分自身を見つめ直し成長しくストーリー。
同じデザインを仕事をしている人間として仕事面で通じる部分もあり勉強にもなりました。
特に作中に作られるパッケージデザインは今の流行りとは違う良さがあるので見ていて面白いですよ!
そしてとにかく主人公役の深津絵里さんが素敵すぎます!可愛い!
おすすめのドラマのひとつになりました。