出会えて良かったWebサイト2023
自身のnoteで掲載させていただいた2023年に「これスゲー!出会えて良かった!!」と思うサイトのまとめ(一部掲載)。
一覧のレイアウトを選択する
メモ
圧巻の景色というか見応え。これだけの世界をスキャニングしてしまう技術が素晴らしすぎる。ライチョウが手前から奥にとんでいくシーンとか思わず声が出てしまった。すべてが映像的なリアルな表現ではなくデジタル的なエフェクトや場面の切り替えがあるところとかすごく好き。ずっと観ていられる。
メモ
Webのお仕事をしている人からすると「あーこれ観たことある!」と思わず言ってしまう写真の数々で別の意味でもテンションが上がるサイト。サムネイルの段階で1カトゴリーに作品が複数点ある場合は重なった表現になっているところとか面白い。
メモ
文章で使用されているテキストサイズが12PXで、個人的に12PXはキャプションに使用するサイズで文章とかに使用する場合は16PXにすることが多く、読み物コンテンツが多いわりにテキストのサイズが攻めているなって思った。文字が小さめなぶん余白の美しさが際立っている部分はとても好き。
メモ
KV下部のお知らせ欄に「今回、ウェブサイトへの顔出しOKなコーダーは3人だけでしたm(_ _)m」って書いてあってめちゃくちゃ笑った。KV下のAboutの部分のビジュアルに3人のうちの1人をまったく使わずにマネキン1体で対処しているところとかとっても好き。撮影楽しかっただろうな。
メモ
なんていうかもう…なにがなんだか理解できない異次元の空間ができあがっているのでただひたすら凄い以外の感想が全く思いつかない。マジで異次元だ…。ちなみにTopページのインパクトが凄すぎるんだけどAboutページのスクロールで背景がパーっと変わる感じもめちゃくちゃカッコよくて好き。
メモ
僕がデザイナーになったころからネットストーキングを続けている会社の最たる例ともいえる会社であるシフトブレインさんの20周年記念サイト。シフトブレインさん20周年おめでとうございます。これからもハードなストーカーでい続けさせていただきます。
メモ
ロゴをふんだんに活用したOVのアニメーションがとにかく素敵。OVだけではなくAboutページのグラフのアニメーションなどいたるところにサッと出てくる感じもとても好き。あとMenuを出した時に背景がピンクになる仕様は初めて見たかも。細かいところまで素敵。
メモ
もう最初のローディングやコピーの登場の演出からフッタでのQRコードの登場の仕方まで全部がカッコイイ。デジタル的なインタラクティブな要素もあるなかでグラフィック的なレイアウトもバリバリあってすごく素敵。これはシビれるな。
メモ
これは完全に好みの問題かもしれないけど、スクロールした瞬間に出てくる青っぽいグレー(#a2a9ac)の背景色と彩度低めなピンク(#dfc8bf)の2色をみただけで「ここ絶対に素敵。行きたい。」って思ってしまった。
メモ
CG自体の可愛さやコミカルな動きも素敵だけど、個人的にはタイトルやUIの明るめなカラーに対してCGの彩度を抑えた配色がとてもバランスが良くて好き。それぞれの記事の詳細に入ったときにメインのビジュアルというかアイコンにはなりつつもそこまで主張していない感じが絶妙だなって思った。
メモ
完全に日本の文化が好きな海外の会社だと思っていたら日本の会社だったんだ。会社の説明が最後の最後に出てくるんだけど、きっと最後までスクロールしてくれるという想いからそうしているのかな?もちろん最後までスクロールしちゃったので、そうだとしたら大成功ですとお伝えしたい気持ちでいっぱい。
メモ
どういう基準というかコンセプトでこのTopの背景動画にしたのかわからないけど、個人的にこういう感じがめちゃくちゃ好き。ロゴの使いかたもとても好き。あとgnaviにOVするとしないで、お問い合わせのボタンのサイズが変わるのとても良いなって思った。
メモ
Topで最初にスクロールをしたときに左下のテキストと罫線がフッと消える感じがすごく好き。これが消えることによって次のエリアに移動するときの見えかたが全然違う気がする。LATEST NEWSのエリアのテキストとサムネイルの配置の仕方もめちゃくちゃ素敵。
メモ
Topのマニフェストのレイアウトをみてこういう組み方は画像ならではの魅力で、最近テキストで全部組んでしまっているけどメッセージの力強さや伝わりかたとかを考えるとチャント選択して表現を使いわけるべきだなと改めて感じた。あと商品画像のパッケージと中身のレイアウトの仕方がとても好き。
メモ
心から素敵と思えるというか観ていて楽しい気持ちにさせてくれる。最初のマニフェストの「九州は鹿児島の南はじ。」の横にブリッジしている子供の写真があって、「僕も絶対にここに使いたくなるこの写真!!」ってなった。こういうレイアウトやこういう写真を撮れる人って本当に素敵だなって思う。
メモ
観ているだけで「この会社楽しそう」感がバンバンにつたわってくるデザイン。写真のイラストの組み合わさった画像やちょっとしたアニメーションがとにかく魅力的。あと個人的にはTopの画像がすごく好き。特にメガネの人のネイルと時計のバンドと服の色の合わせかたとかめちゃくちゃ素敵。
メモ
画面が曇る仕様ってどちらかというと雪とか結露でつかわれることが多いけど、湯気っていうのは初めてみたかもしれない。カーソルを動かして曇りをとったところで時間が経つとまた戻ってくる感じとか面白いなって思う。
メモ
白背景と黒いテキストの明度差、白黒なエリアとカラフルな画像のエリア。スッキリとした世界だからこそ画像の華やかさが際立って素敵。見出しの黒が真っ黒(#000000)のようなそうでもないようなという不思議な印象がしたので調べてみたらほとんど黒に近い緑(#000300)だった。
メモ
とにかくKVが素敵。めちゃくちゃわかりやすいし「テクノロジーで時間価値を高める」というコピーがなくてもなんとなく意味が伝わってくる。
メモ
Journalページのレイアウトがとても好き。個人的にシンプルに見せたい記事は左右いっぱい使わず、noteのように中央にレイアウトしがちだったけど、サムネイルを左固定にするという発想はなかったな。ぜひ取り入れたい。
メモ
サイトをみるというよりもワークスのひとつひとつをみてどれもくそカッコイイな…って思っていたら、急に「オレの“領域(テリトリー)”へようこそ」っていうメッセージが画面いっぱいに出てきて一気に引き込まれた。
メモ
Topにおける情報量が多めだなと思いつつも、順序立てた構成と文字量のバランスが素晴らしいなと思う。最後までだれることなく読めてしまうの本当に素敵。こういう流れだからこそ同じフォーマットで展開される感じが良いのかも。
メモ
もうこの画力の凄さよ…ハイテンションすぎて本当に好き。サイト内を自動で進む感じもすごく良い。これメインのビジュアルどうやって決めてんだろう…CDかADの人が「前回はサイだったし…今回はロバかな?」とか会議でいうのかな?サイト内に流れるBGMもサイトのテンションに合ってて好き。
メモ
このCONTACTやVIEW MOREのボタンの見せかたがとにかく好き。ボタンとしての高さはテキストリンクぐらいなのに圧倒的に目立つしなによりも可愛いしカッコイイ。超好き。インスタの導線での写真のみせかたも素敵。
メモ
コピーからくるアイデアとして面白いなと思いつつも、下層まで全部、CAPTCHA(キャプチャ)認証をしなきゃいけないのはすごくダルい。でもそこのダルさもふくめて面白いのかもとさえ思える。
メモ
KVのこの3Dのロゴのディティールが素晴らしいのはもちろんなんけど、このTopのロゴの間を文字が貫通しているんだけどこれってどうやってどうやっているんだろう?文字も3D表現なのか、それともロゴが文字の前にある場所でマスクをきっているのか?…まったくもって謎。
メモ
なによりもまずこのコピーをみてビビった。これ画像とかじゃなくてテキストなの…?こんなに美しく組めるものなの?縦のグリッドが見えてきてしまうほどキレイな余白。これくらい余白があるというか情報が詰め込まれていないからこそこのくらいのテキストサイズでもしっかりと入ってくるのかな?
メモ
いやもうファーストビューでとにかくカワイイ。この並んでいる感じがとても好き。パッ見で一瞬、ボタンとかテキストの背景色を黒にしているのかな?と思ったら紺だった。Eventエリアの背景と同じ色だと思うけど面積によってやっぱり見えかたって変わってくるものだなってあらためて思った。
メモ
赤いパーカーで麺をすするKVがとにかく素敵。「麺・汁・肉」のパートの画像の上のマージンがない感じあまり見たことがないので新鮮。飲食店のサイトにおけるメニューって料理のメニューを想起させちゃうからヘッダのメニューを言葉で載せるのってムズいんだなって個人的に思った。
メモ
文字の組みかたとか動きも含めてすごく好みというかカッコイイなと思ったらRYDENのサイトを手掛けてらっしゃるかただったんだ。Contact下のクレジットを見てコーディング以外のパート全部手がけてらっしゃるんだ…と思い自分とのスキル差にゲッソリとしてしまった。…もっと頑張らなきゃ。
メモ
全体の美しさはもちろん、UIの細かい挙動が本当に素敵。フッタのボタンをホバーするとエリアが変わる仕様や、Contactのメールアイコンが紙飛行機のアニメーションになる発想は自分では思いつかない。こんな細部まで丁寧に考えられる人になりたいな。
メモ
なんというかまずこのサイトがヘアサロンのサイトであることに驚く。Topで読み物コンテンツような展開をするヘアサロンのサイトを見たことがない気がするのですごく新鮮。写真もひとつひとつ美しくて最後まで引き込まれて読んでしまった。
メモ
色数を抑えた中で綺麗に映えるネオンカラーがすごく素敵。円や四角のようなシンプルな形で構成されている中で、形が変化したり奥行きが出るような動きをしたり、その変幻自在さに会社としての強さが表されているような気がしてシンプルに観ていてカッコイイなと感じた。
メモ
イラストやカラースキームの世界観も素敵だけど、個人的には写真に特に惹かれた。被写体がモデルや慣れている人でないと笑顔を作ることはなかなか難しいと思うけど、笑顔が多い仕事環境なのか写真家やADの力なのか、どれも素敵な写真ばかりで引き込まれる。
メモ
右側に出てくるアンカーリンクがセグメントごとに内容が変わっていく仕様が素敵。ヘッダと右側でアンカーの役割を変えている感じが実用的だし面白い。ABOUTの空抜けの画像背景に白でテキストが入る感じって、視認性の観点で迷ってしまうけど僕もここは白を入れたいって思う気がする。
メモ
KVをスクロールしてABOUT部分に出てくるビジュアルがKVの動画をマスクしたものという発想めちゃくちゃ頭いい!ボタンに使用されるグラデーションに給電されるような演出がはいっている感じが好き。Serviceエリアのサムネイルがちっちゃい3Dみたいになってるのすごいカワイイ。
メモ
テキストの演出にここまで驚いたのはNURO DEVILMAN以来かも。これだけの演出があるのに文字組がキレイで読みやすいのは驚き。上下に演出があって読みにくいかと思ったけど、音と文章がリンクしてゆっくりとテキストが頭に自然と流れ込んでくる。この体験をWebでできるのは本当に凄い。