00:01
どうも、ハリーです。
どうも、ヤーマンです。
あのー、新しいiPhoneとか出てましたね。
あ、そうなの?
Apple新製品が、9月の頭ぐらいに。
あ、マジっすか。
iPhoneとAirPodsかな、今回は。
ほうほう。
あとApple Watchか。
へー、Apple Watch欲しいんすよね、今ほんとに。
お、いいじゃないすか。
持ってる人からみんな口を反れっていうのが、
あの、めっちゃ便利やでってみんなに言われるんですよね、Apple Watch。
まあ便利だね。
だからね、欲しいんすけどね、まだ買えてないっていう。
でも、サイト見たらめっちゃいい感じですよ。
へー。
サイト見てます?
サイト見てます。
Appleのサイトかっこよくないすか?
Appleのサイトかっこいい。
Appleって普通にね、iPhoneとかMac屋さんなんですけど、
うん。
なんかそこで革命、革命みんな言ってるじゃないすか。
はい。
Appleの実は真の革命、サイトデザインの革命がめちゃくちゃあるんじゃないかなと思ってて。
なるほど。
まあiPhoneとかその今の一押しの商品の詳しく見るみたいなとこ押すと、
うんうんうん。
紹介ページ行くじゃないですか。
行きますね。
すごいんすよ。
見たことみんなありますかね、Appleの公式サイト。
すげー、すげー。スライドさせていったらめっちゃ動くやん。
そう、めっちゃ動くんすよ。
うん。
僕の覚えてる限りiPhoneが出た頃から、なんで2007年8年頃にAppleのサイト一回リニューアルされてて、
うん。
その頃からもう明確に一段上に行ったなっていうのがね、めちゃくちゃあるんですよ。
うーん。
で、もうそれゆえこのAppleのサイトを追っかけるフォロワーがドバッと増えたっていうので、
はいはいはい。
ウォブデザイナー界で革命的な事件が起きたんですよ、2008年頃から。
2008年すか、もうじゃあ20、え、12、3年前から。
ですね。
ちゃう、14年ぐらいか。
で、特に一番最近の革命で言うと、
うん。
ページごにゃごにゃスクロールしないと見れないじゃないですか。
で、なんかスクロールに合わせてめっちゃ動くでしょ。
動く、これかっこいいねこれ。
これ何かって言うと、
うん。
もうなんか動画みたいじゃないですか。
動画みたい。
これ動画なんですよ。
へー。
どういうことかって言うと、スクロールに合わせて、
うん。
動画が再生される仕組みを入れてるんですよ。
あー、なるほど。
例えば100ピクセル分スクロールしたら1秒分流れるとか、
そういう設定をしてるんですよ。
はいはいはい。
面白いね、なんかこのめくる、何て言うの、
スクロールしていく楽しさみたいなのがね、
そうそうそうそう。
ありますもんね。
なんか次に行きたくなるというか、
そうそうそうそう。
どんどんこう見たくなっちゃいますよね。
ワンマとハマってますね。
03:00
ハマってるね。
この人差し指止まんないもん俺今これ。
はははは。
めっちゃクリクリしちゃってる。
このね、
Appleのウェブサイトがデザイナーに与えた影響、
エグいんすよ、もう本当に何度も言うけど。
確かに確かに。
いやいや僕もね、デザインの仕事で、
ウェブデザインとかするときあるんで、
Appleのこのサイト参考にしたことありますね、何回か。
ありますよね。
ありますあります。
で、ちょっと歴史を遡ると、
その先2008年とかそれぐらいの頃、
うん。
いわゆる、これ知ってるのかな?
ウェブ2.0風デザインっていうのが、
めちゃくちゃ流行ってた時期なんすよ。
へー。
で、何かって言うと、
どこもかしこもみんなグラデーションをかけて、
テッカテカにしてたんすよ、ボタンとか。
はー。
ウェブ2.0風デザインとかでググったら、
多分普通に出てくると思います。
あ、これねって。
あー。
はははは。
これね。
はははは。
これねってなった。
なるでしょ。
はいはいはい。
グラデーションでテカテカにしてるとしか、
わかるわかる。
僕の語彙では。
ちょっと立体的なボタンだよね、このね。
あ、そうそうそうそう。
うんうんうんうんうん。
これでも、
まだこういうデザインのサイトたくさんありますよね、
この行政とかさ。
ある。
ね、あるあるある。
当時の最先端だったんすよ、もう。
はー。
このなんか表面にニスでも塗ったかのような。
はははは。
テカテカのギター。
なんかちょっと可愛くプリンってなってるよね。
そうそうそうそう。
うーん。
でもこれを、
あるある。
これまたAppleだと僕は思ってます。
へー。
なぜかというと、
初代iPhoneのアイコン、
アイコンというかそのー、
なんていうの、
アプリのUIとか、
いわゆるそのリアルにいかに寄せるかっていうところを、
うん。
完成させてしまったんですよ。
うーん。
専門用語で言うと、
スキューモフィズムっていうデザイン用語。
うん。
あるんですけど。
フキューモシズム。
スキューモフィズム。
スキューフォーシズム。
全然言えてない。
全然言わないね。
スキューモフィズム。
スキューモが何の意味か全然わからないですけど、
どういうものかっていうと、
出てくるね検索すると。
他の物質に似せるために行うデザインや装飾を指す用語。
うん。
と言われていて、
具体的に言うと、
例えばその電卓アプリとかだったら、
本当にそのリアルな電卓に寄せた、
このボタンがちょっと立体感あるとか、
メモ帳アプリだったら、
本当に紙を破ったような、
施しがされていたりとか、
なんかちょっと木目帳みたいな、
そういう質感がテクスチャーで入ってたりとか。
はいはいはいはいはい。
そういうのが流行ってたんですよ。
うん。
でまあそれがね、
もうオシャレだと。
このスキューモ?
スキューモフィズム。
スキューモフィズム。
いや確かに。
昔のアプリのアイコンとか全部これでしたよね。
06:03
ちょっと立体的で影があってみたいな。
そうですね。
今はなんかフラットですもんね。
そうですね。
おっしゃる通り、
今はフラットデザインと呼ばれるやつが流行ってますが、
なんでこれ廃れたかっていうと、
やっぱりなんかみんな過剰な装飾に走りすぎて、
使いにくい。
なんじゃかんじゃこれシンプルな方がいいよねっていうのが、
一周回ってきて、
フラットデザインと呼ばれるグラデーションとかほぼ使わず、
平面のみを表現するみたいな。
なるほどなるほど。
これがね、流行っていったんですね。
うーん。
まあなんかこの辺の歴史多分、
その建築士のなんか歴史とかを追うと、
割とイメージしやすいのかもしれないけど、
うんうんうん。
なんか僕も全然詳しくない絵アップなんですけど、
アールヌーボーみたいな、
めっちゃゴテゴテした木の枝みたいなのを模したような、
机とか鏡とかがあるじゃないですか。
レトロなやつ。
ありますね。
めっちゃアンティークなやつね。
っていうのから、
もうちょっとシンプルな少し工業的っぽいバウハウスとか、
そういうのに流れていったみたいな歴史が多分あるんですよ。
うんうんうん。
に近いのがそのさっきのスキューモフィズムとか、
そのさっきのスキューモフィズムからフラットデザインみたいな。
なるほど。
まあでもこの辺のなんかそういうトレンド作ってんのもアップルなんですね。
いやこれね、作ってるかというと、
別に作ってないと思うんですよね。
うーん。
作ってはないのか。
作ってはないけど、
一個完成させるのがいつもアップルの仕事なんですよもう。
うーん。
これって多分そのiPhoneとか、
そういう製品の方でもそうなんですけど、
うん。
アップルが発明したものって別にないんですよ。
うん。
ないけど、
うん。
この技術はこの使い道が確かに正解だねっていうのを出すのがアップルのお仕事。
うーん。
なんかARとかVRとか、
いわゆる新しい技術、
アップルが発明しましたみたいな言い回しするじゃないですか。
するけど、
そういうのは他の人たちが一生懸命種をまいて育ててた技術をアップルがバサーッと刈り取って、
めっちゃいい感じにまとめて、
うん。
これが発明ですみたいな感じで、
はいはいはいはい。
ポーンと出すと。
なるほどね。
だからまあ種をまいた人たちは、
やられたーみたいな。
もうありつつ、
うん。
ありつつ、
確かにそんな使い道あるねっていう。
あー。
まあでもそこまでいったらなんかあっぱれだけどね。
だからその最初に言ってた、
スクロールに合わせて動画再生するなんて、
うん。
これが何の役に立つかは、
別に誰も初見よく分かってなかったと思うんですよ。
うんうんうん。
よく分かってなかったけど、
アップルがそのウェブサイトを使って表現したいことって、
09:03
うん。
まあすげえ技術で、
すげえオシャレで唯一無二の製品だよと。
それゆえ、
すごい体験ができますよっていうことを、
うん。
まあ多分言いたいわけなんですよ。
うんうんうん。
そうしたときに、
他と同じようなもの作っていたら、
やっぱそういう体験を、
リアルに信じてもらいにくいんじゃないかなと思っているので、
他ではない表現っていうのを、
いかにこのブラウザ上で演出できるか。
なるほどね。
そこの本質を表現してるんだ。
このサイトのインターフェース上でも。
たぶんね。
知らんけど。
うん。
いやでもこれは、
楽しさがある。
ほんまに何回も言うけど、
俺もうずっとさっきから人差し指、
もうマウスクリックしてるから。
そうそう。
もうだから、
あれなんですよ。
もうアイマックスですよ。
4D。
アイマックス。
4D。
あー。
わかんない。
知らんけど、
なんかその他のサイトがこの文章、
小説だとしたら映画ですよ。
うん。
このサイトは。
なるほどね。
4Dね。
そう。
確かにこの、
あれですね。
サイトの作りは、
革新的。
新しいことも既に体験させられてるもんね。
うん。
サイト上で、
ブラウザ上で。
ここまでやるの、
他ないですからね。
うーん。
多分えぐい大変だと思いますね。
僕ももう。
そのやっぱ真のApple信者はね、
うん。
Appleの公式サイトのソースを読むっていう。
うーん。
やっぱすごいの?
この、
すごい、
すごい、
すごいですね。
すごいんだ。
なんかだからそのくるくる動くやつとかも、
うん。
まあその動画使ってるのもあるし、
AirPodsとかがスクロールするとこう、
部品にパーンって分かれるみたいな演出があったりするんですよね。
うんうんうん。
で、この部品はこんなことをしている、
こんなことをしているみたいなのを、
それで説明するみたいなのがあるんですけど、
うん。
それとかもは、
えーと多分動画じゃなくて、
画像をその一個一個、
うん。
配置して、
バラバラのパーツごとの画像を、
で、スクロールに合わせてこう、
パンと弾けたように、
うん。
合わせるみたいなことをしてるんですけど、
うん。
めんどくさいんですよ。
そんな。
うふふふふ。
ちょっとめんどくさいどころじゃない、
はいはいはい。
かつそのどのiPhoneで見ても、
パソコンで見ても、
タブレットで見ても、
うん。
それが当然ね、
ちゃんと見えないといけないわけですから、
うんうんうん。
みたいなことを考えると、
まあ膨大な労力がかかってるってことですね。
途方もないですね。
いやーすごいなアップル。
まあでも最近だとね、
やっぱそのスクロールに合わせていかにやるかって、
あとはあれですね、
いわゆるスティッキーみたいな呼ばれる、
このスクロールしていくと、
うん。
その要素がピタッと止まる。
スティッキー。
スティッキーかな。
スティッキー。
多分スタイルシートとかを触る人だったらね、
うん。
スティッキーっていう設定を一回は使ったことあるんじゃないかなと思うんですけど、
えーとなんか広告とかでも、
12:01
最初上からフィーってきたけど、
うっとうしいところで止まるとかあるじゃないですか。
あるあるある。
まああれですね。
あーはいはいはいはい。
ピタッとくっつくみたいな意味だったと思うんですけど、
うん。
英語ではなんかネバネバするとか粘着するみたいな意味ですね。
あ、そうなんや。
うん。
張り付いてくるやつね。
そう、ピタッと止まって、
そのiPhoneとかクルクル回りだしたりするじゃないですか。
はいはいはいはいはい。
ああいうことが、
その一個一個の要素を回転させるだとか、
うん。
そういうスティッキーで、
要素止めるとかは知ってたんですけど、
うんうんうん。
そんな使い道あったかっていうのが、
もう、
悔しい。
ふははははは。
なぜ思いつかなかったんだろう。
なるほどね、
うーん。
まあiPhoneはそれをやってくるわけですか。
なんかあるんですよ、
たまにとてつもなくすごいものを見たときに、
悔しいって思うみたいな。
はいはいはいはい。
いやわからんでもない。
こんな使い方あったんだみたいな。
うん。
なんかもう全然話変わるんですけど、
5年ぐらい前だったかな。
コロナの前だったんですけど、
なんか椎名林檎のコンサートに行ったんですよ。
うん。
コンサートそんなに行かないんですけど、
うんうんうん。
まあ何度か行ったことあって、
うん。
椎名林檎のコンサート行きましたとなった、
帰り道思ったこと、
うん。
悔しいです。
なんでなんでなんで。
ふははははは。
何が起きた椎名林檎のコンサートで。
まあ大体2時間ぐらいあるじゃないですか。
うん。
で、2時間あるコンサートってやっぱ途中だれるんですよ。
どっかで。
うんうんうん。
えみーみたいな思うんですよ。
もうどんだけ好きな歌手のコンサートに行ったとしても。
うん。
全くないどころか、
うん。
ここまでできるんだっていう1回の図のコンサートで、
みたいな技術を浴びまくったせいで。
うん。
うん。
悔しい。
だから電車乗って帰って一緒に行った人に、
お前はなんだって言われて。
いやそれね、
あの、
俺が一緒に行っても同じこと言ってた。
お前はなんだって。
どこに対抗意識出してんの。
またあの曲良かったねみたいな話しようぜっていう。
はいはいはい。
感じだった。
まあでもちょっとこう見てる視点がやっぱりあれだね。
全然違かったよね。
うーん。
っていうのと似たような感覚を、
このApple新製品が出るたびに見て思うっていう。
なるほどね。
いや僕は正直そんな視点であんまり見たことなかったんで、
すごく刺激的でした今日のお話は。
そうですか。
ちょっとこれから注視してください。
わかりました。
これからのトレンドは大体Appleが握ってるんで。
なるほどね。
いやでもこのサイトは本当に、
そう聞くと本当にすごいですね。
いやこれは本当にね、
周りに詳しい人がいないとわからん世界ですわ。
今度HTMLの解説でもしようかな。
はい。
多分ついていけないと思うけど。
はい。
ということでねちょっと。
いやー。
これからHTMLとか勉強しようかなっていう人は、
Appleのサイト見るのはやめた方がいいと思います。
15:00
特殊な。
影響力が。
これは参考になるようでも参考にならないのかな。
真似できないものなんだね。
異次元の。
まあでもね慣れてきたらやってみるといいと思います。
はい。
ということでAppleの起こしたもう一つの革命、
ウェブサイトのデザイン革命というお話を今日はしてみました。
すごいねやっぱAppleは。
すごい。
ということで今回の感想をメールまたはAppleポッドキャストのレビューでお待ちしています。
二人でコメント欄を全て読んでいますので、
今後の番組をより良くするためにあなたの感想をお待ちしています。
よろしくお願いします。
それではまた次回お会いしましょう。
さよなら。
さよなら。
