00:01

はい、始まりました。デザインの味付け。この番組は、株式会社ajike代表の梅本と、その仲間たちがデザインについて、雑談を交えながら話す番組です。
今日のお相手は、神田さんです。神田さん、よろしくお願いします。

はい、神田です。よろしくお願いします。
先日会食がありまして、その方が私のプロフィールを調べてくださったみたいで、
梅本さんは奈良出身なんですよね、というふうに。
関西弁が全然出ないですね、と言われました。
確かに。

ただ、神田さんと喋ると、ほんま関西弁がすぐ出てしまうというか。
関西ラジオってことでお願いします。
そうなんです。なんか引きずられますよね。なんでやねん。

どこから…いや、わかんないですけど、自分は梅本さんは全然出てない。
2人で話してるときはすごい出てると思うんですけども、
みんなの前で話してるときとかは全然標準語だなと思ってるんですけども、
他の方から見てもそうなんですよね。
かもしんないね。隠れキリシタン的な感じになってる。
でも意識してるわけでもないんですよね。

意識してるわけじゃないですね。もうね、関西弁喋らないよう…
ビジネスのときも関西弁喋らないっていうのが当たり前なんでしょうね。
もう20年くらいになるかもしんないですね。

でも、北九州に移住してもう長いんじゃないですか。

7年くらいかな。

九州弁は出ないんですか?
九州弁はね、やっぱり聞かないんですよね。聞く機会がないというか。

地元の方々とか。
地元の方々と喋るときはあるんですけど、

そうやってちょっとしたご飯のときとか、
1日で言っても1時間2時間を、週に1,2回とかそんな感じじゃないですか。

だから、喋れるのかな。喋ろうと思ったら喋れるのかな。

お子さんはどうなんですか?

子どもはやっぱり学校の子たちと喋るんで、結構喋れると思います。北九州弁。
ああ、待ってるんですね。

でもなんか自分と話すときは標準語のような気がしますね。
たまに夜景なんとか。

かわいいですね。

自分の喋れない言葉を。

なるほど。
やっぱり前向上が長くなりました。
それでは今日デザインの話もまたやっていきたいと思いますけど、今日のテーマは何でございましょうか。
03:01

今日はARB触ってみたというテーマでお話したいなと思います。

前々回か、神田さんとARB&Bの話をしたのは。

そうですね。ラジオの回でいうともう1ヶ月前ぐらいにはなるかなとは思うんですけども。
ARBすごいぞっていうところはお話しさせてもらって。
これが何かというと、最近海外系の記事とかでインプットをしているっていうテーマの時に話したかなというふうに思うんですけども。
結構海外系のデザインの記事を見ていると、ARBに触れる記事っていうのは割合がすごい多いなっていうのを感じてたんですよね。
実際そのARBがこんなアップデートされたとか、ARBってこんな企業でこんなデザインチームがあるとか。
そういうのをすごい見るんで、みんな注目してるんだなっていうのがすごくわかりまして。
恥ずかしながらというか、自分はARBってほとんど触ってなかったんで。
これを機にこんなにみんなが噂するんだったらちょっと触らないとなと思って。
最近ちょっとアプリをインストールして、自分もちょこちょこ宿を探しみたいなのをしてみたっていうところですね。
なるほど。じゃあ福岡に遊びに来てくれるんですか?

それは全然予定してなかったですね。
福岡の宿は探してないですか?
福岡はマップから除外されてたんじゃないかな。

こんなこと言ったら怒られますね。
登録しとこう、俺の家を。

多分マンションの規定組合でダメですね。
すみません、余計な話でした。
じゃあ今日はARB&Bのアプリを実際に触ってみて、この辺が良かったよみたいな話を熱く語っていただけるという感じですかね。

そうですね。よかったら梅本さんもアプリ見てみてほしいなと思います。

わかりました。じゃあちょっとまず説明してもらっている間にインストールしますので、何がいいのか教えてもらっていいですか。

まず一つ目がですね、これは見た目がわかりやすいところなんですけども、
表装のデザインの部分がやっぱりすごく綺麗というのはベースとしてあるんですが、
立体的な表現というのがすごくふんだんに取り入れられているというのが特徴的だなと思いました。
前話したときも、フラットデザインが終焉に向かっているというのが記事としてあった話をしたんですけども、
06:12

フラットデザインが終わると次に3Dが取り入れられてくるっていう、そういう話だったんですね。
Airbnbのアプリを実際触っていると、ベースはフラットデザインなんですけども、
やっぱりところどころ3D表現というのが使われてまして、特にイラストの部分ですね。
部屋のイラストとか、あとは本のイラストとか、そういうものが使われている箇所があるんですけども、
ここは結構立体的にリアルな感じで描かれているっていうのが特徴的だなと思っています。
今入れて、棚田さんの話何も聞かずに入れてました。

何も聞かずに聞いてください。
すいません。本当にすごいね。こんな表現初めて見たかもしれない。

本当ですか。

しゃべると、確かにアルバムがちょっと立体的にフラットじゃなくて、
少しスクリューマーケットじゃないんだけど、ちょっと立体的にしたやつを触ったら、
でもモーダルに上がってくるんだけど、ハーフモーダルで上がってくるけども、
そこのアニメーションがちょっと見たことないようなアニメーションだよね。

そうなんですよね。こういうギミックもすごいですよね。
ここら辺本当に日本のデザインではもちろん、自分はあんまり見たことないなと思いますし、
例えばYouTubeとかFacebookとかすごくグローバルなアプリとかもあると思うんですけども、
そこら辺にもない新しさを感じる表現だなと。

これ見てたら話できないかもしれない。
今のは1回目ぐらいかな。表装のデザインというかギミックも含めての。
立体的であるっていう、そういう話ですね。

ちょっと新しい表現ですね。他にすごいポイントは何なんですか。
もう一個自分が触っていてすごく気持ちいいなと思うポイントが、マイクロインタラクションがすごいっていう点ですね。
マイクロインタラクションっていうのは、アクションに対して細かいアニメーションだったりとか、
ちょっとバイブレーションが作動したりとか、そういうアクションに対してのフィードバックっていうところなんですけども、
09:10

これも本当に作り込まれているなと思ってます。
ユーザーは結構一個一個のアクションに対してフィードバックを欲しがるっていう、そういう原則とかがあったりしますけれども、
そこら辺にすごく忠実にというか、本当に細部のデザインがされているなと思っていて、

特にバイブレーションのデザインっていうんですかね、これも自分ほとんどやったことないんですけども、

これやっぱりアプリ並べではというか、すごくいい表現だなって触りながら思ったりします。

確かに。プレイステーションのゲームとか、自分たまにやるんですけど、
やっぱりコントローラーの振動をブンブンってくるんですが、
このアプリ触ってみても確かに気持ちいいね。

そうなんですよね。これも本当に一つのマイクロインタラクションだと思うんですけども、
ページを開くときとか、検索するとき、お気に入りに入れるとか、
そういうようなアクションをしたときの細かなデザイン。
本当に結構作り込まれているし、気持ちよくできているんで、
こういうところがすごいなと思いました。
なるほど、なるほど。
というのが二つ目ですね。

はいはい。いいですね、いいですね。
もう一つあります。
もう一つだけ言わせてください。
もう一つ言いたがるな。

はい、じゃあ三つ目お願いします。
はい、三つ目がですね、

世界に旅行できる感がすごいっていうのはちょっと変えてるんですけども。

世界に旅行できる感、どういうことですか?
これがですね、アプリの通り、
一番目立つボタンが地図っていうボタンになっているんですね。
フローティングアクション、そうだね。
そうですね。

この地図で探すっていうことをすごくこのAirBは推してるっていうことの現れ、

そこら辺がちょっと構造デザインに現れていると思うんですけども。
はいはい。
そうするとですね、やっぱりこの世界中にピンが打たれていて、
世界中の窓っていうのがもうすぐパッと見れるんで。
この?
すぐにこの綺麗な写真が見えてですね、
実際はなんかこの地図の中にピンが打たれていて、
世界中の窓っていうのがもうすぐパッと見れるんで、
12:00

この?

はいはい。

すぐにこの綺麗な写真が見えてですね
すごく、そこからついつい詳細ページに遷移してしまって
素敵なお部屋の写真が目に入ってくると
これはすごいワクワクしますし
行きたくなるなぁと
なんかちょっと近くも感じられるというか
これすごく錯覚ですけども

確かに思い出しますね
世界中の家を宿にするとか
今から覚えてないですけど
確かに世界中のどこでも価格がついてるから
ホテルというか宿になってんねんな

そうなんですよ
この地図で地図から探すっていう
この構造と情報設計のデザインっていうのが
結構エアリーは大事にしてるんだなっていうのが
画面を見てても伝わりますし
実際ワクワクするポイントになっているんで
ここもすごいなぁと思いました

確かに開いたときは普通にリスト型で
綺麗な写真を上下に並べてるけども
フルーティングアクションは地図になるんですよね
だから一回旅行に行ってくださいみたいな
メタファーにもなってるかもしれないですね

そうなんですよね

よくできてますね確かに

すごく特徴的ですし

勉強に
一番上が全部検索エリアだけど
検索もこういうしやすさがあるんだな
2段目でね
アイコンで結構使ってるんだよね
フィルターの検索要素
このアイコンもすごくいいですよね表現が

結構勇気いるよねこのヘッダーの高さね
確かにそう言われてみると
まあまあ大胆にここ使ってますよね

3分の1とまでは言わないですけど
4分の1は使ってるんじゃないかな
ヘッダーエリア使ってますね
アンドロイドなんでiPhoneわかんないですけど
下は普通にタグバーというかメニューが並んでます

並んでます

コンテンツエリアで言うと結構小さい
一つの写真を見れるくらいのコンテンツエリアなんですね

そうですね
この写真の見せ方
画角とかっていうのもキーですし
15:03

実際ページの詳細に遷移すると
ヘッダーフッター消えるんで

予約するボタンだけにして
あとはコンテンツエリア

そうですそうです
すごくよくできてますよね
なんでいろんな海外系のクリエイターが
AirBに対して来てるのもすごい
改めて思いました

なるほど
予約したらどうなるかっていうのがちょっとわかんないんですけど
多分真ん中の旅行ボタンが
計画というか
しおりみたいになってるんじゃないかな

旅のしおりみたいな

そうですね

作り込まれてるんだろうけどね
旅行計画というか
そちら側のページも気になりますし
あとはホスト側のページっていうのもあるんで

確かに

それもちょこっと触ってたんですけども
これもまた良さそうなんですよね

すごい
確かに月にいくらぐらい入るよみたいな
収入が見せてくれるね
そうなんですよ

できてますわ
見始めるのは結構
終わらないかもしれない
面白いですよね

面白いね
そしたらまとめいきましょうかね
神田さんまとめお願いします

そうですね
すごく改めてアプリを見たら
AABがUI UXデザインを牽引して
先をいってるんだなっていうのを感じたんですけども
牽引していく企業に
必要だと感じたことっていうところで言うと
2点ありまして
1点目がデザイン品質として
素晴らしいものを作っていると
2点目はそれだけではなくて
デザインの品質だけではなくて
それだけ事業として成長していっているっていうのが
すごく必須だなと思ってまして
それが両立することで
初めてクリエイターからも
すごくずっと注目されるような
デザイン企業というか
そういうような企業として認識されている
っていうことになって
18:01

思いましたと

改めてAABをベンチマークとして
何か自分たちがプロジェクト関わるときは
これぐらいのこだわりと
デザイン品質っていうのを目指してやりたいな
っていうのを思ったっていうような
まとめになります

なるほど ありがとうございます
いいまとめですね
確かにデザイン品質もいいし
それだけ事業としてもでかいことやってあるよっていうか
目指すべき企業の一つではありますね
はい ということで
今日のテーマはAABを触ってみた
でした
聞いていただきましてありがとうございました

ありがとうございます

編集後期
お疲れ様でした

お疲れ様でした

編集後期って言いながらも
編集の後に言ってるわけじゃないんですけどね

どういうことですか
編集の後には言ってないですね

編集後期って普通はね
ザーッとものを作って編集終わった後に
気づいて欲しいと書くんでしょうけど
普通に話した後に
もう一回仕切り直して違うテーマでザラッと話すみたいな

最後のおまけみたいな感じですね

おまけですね
今日は神田さんの奥さんの声がよく入ってました

本当ですか
それは大丈夫ですかね

できるところだけちょっとだけやっておきます

すみません
同じ部屋で作業してるもんで
背中向けもあってますけど

なるほど
背中を預けてるわけですね
そうですね
わかりました
ということで今日も聞いていただきまして
ありがとうございました
ありがとうございました