# ボタンの角丸から体験設計まで——UI/UXデザイナーの仕事範囲 のんちゃんと、きーくんと、てらでぃーのボイコード Voicyエンジニアの声と出会えるチャンネルボイコード このチャンネルではVoicyエンジニアの日々の活動をお話ししています ロボットみたい なんか今何か違うこと言うようになって間違えました いやーきーくん久しぶりですね 久しぶりですね。我々の会員は久しぶりですね そうですよ。ちょっと最近きーくんとチーム離れちゃったから そうですね 毎日話してたのに そうですね。今までは そうそう。食べきった?みたいなやりとりを そうやってたんですけど ということで今回はなんとゲストをお呼びしております ゲスト、てらでぃーさんです はい てらでぃーさんです ボイコード出るのは? 初めてです お待ちしておりました コート書いてないのに呼ばれてどうしましょうって感じなんですけど 私もほとんど書いてないです そうですよね。基本エンジニアだと入社した時とかに挨拶放送みたいな とか撮ったりしてるんですけど てらでぃーさんはUI UXデザイナーということで プロダクト側でいつも私たちと毎日やりとりを繰り広げてるのに ボイコードにはまだ まだ出てなかった ということでちょっと 夜に目あったから誘ったって感じなんですけど 話をどうしますの延長で そういえば ということで今日はてらでぃーさんをお呼びしまして いろいろUI UXデザイナーって何?みたいな話とかしていければと思いますので よろしくお願いします まず早速なんですけど UI UXデザイナーを知らない人いるかなと思って デザイナーって一括りに言ってもめちゃくちゃ種類あるなってことは私も知らなくて 何の?っていう デザイナーです 何の?っていう 確かに 全てデザインできるから 確かに 大型社場のビジネスデザイナー 確かに 飛行回路 飛行回路をしてるし 組織のデザインとか 組織デザインとか 絵を描いてグラフィックを作ってますみたいな人もいるし 車とかね 確かに プロダクトって言った時に物理のプロダクトもあるし アプリをプロダクトって言う場合もあるし どういうとこで言うと? 私は ボイシーとか アプリのボタンの角丸をいくつにしようかなとか そもそもこの機能を企画されてるけど これでいいんだっけ?とか いいんだっけ?っていうのは 決めるのは別にデザイナーではないかもしれないですけど こういうインタビューとかでユーザーさんがこういうことを言っているから この体験だとちょっと微妙かもねとかを 観点を足していくみたいな そんな感じの 分かりにくいな UIがユーザーインターフェイスか インターフェイスですね ボタンとか 見た目 文字のサイズとか すごい細かいところとか UXまでいくと インタビューをもとに 例えばこういう流れで使うから この画面の縫製はいいですよねとか そこもUIじゃUI UIを考えようとするとUXになるし そう考えるとUIになるんで 2つは1つだねって言って どっちかをやるってことはあんまりないかもみたいな UI UXデザイナー そういう感じの名前になってる 確かにUI UXデザイナーって 1個のものとして 名前付け けど全然違うもんじゃんって思ってたんですよ UIはUIだし UXのユーザーさんがどういう体験をするから Voicyをどんどん使ってくれるのかって 全然違うじゃんって思ってたけど 確かに片方ずつでは 存在できないのか 例え間違ってるんですけど 体と精神どっちよみたいな どっちかが独立してることってないんですか そういう感じだなって個人的に 外側と内側 内側とか 内側とはみたいな コア 確かに だから私たちが 私たち開発エンジニアが もの作るときに 最低限のボタンとかを 最低限の動きだけ考えても 使いやすいねとか これもっと もっと使いたいと思える体験 みたいなのは こういう専門家がいるから 作れてるってことですよね ということなんだと思います 代表するものではないのに 私はそうだと思っています なるほど ありがとうございます 具体的にどういうものを使って 生成化物を作って どうやって仕事を進めていくか これは最近どんどん変わってるんで 説明が難しいんですけど 昔話からすると 昔は紙にペンで こういう画面はどうでしょう みたいなのを書いて そういうのをやってた時代もあるし 画面を紙に書き出して カードで並べるみたいな 付箋で壁にみんなで貼って あれはどうだこうだ このボタンを押したら次 この画面に行くより こっちの画面に行った方がいいよね そういうところを アナログでやってた時代もあったらしい 私は通ってないんです その次に出てきたのがフィグマです フィグマ フィグマはどっちもできるんですよ 紙に書くのと同じように 結局コードに裏側はなってるんだけど ボタンとかを絵で作る ここは8ピクセルで ここは16ピクセルで それをもとにエンジニアさんに実装してもらう できるしみんなで付箋をペタペタ貼る フィグジャムって 紫色のやつがあるんですよ っていう 時代だったんですよ まずフィグマは生きてるんですけど 今も使うことあるんですけど 最近はデザイナーが デザイナー以外のプロダクトマネージャーも 作りましょうみたいな GitHub使ったことないけどどうしよう みんなバチャバチャやってたりする 動いてるもの見たほうが早くね 最近は AIの高まりによって 高まっている 去年から今年にかけて コードで何やってるか何も分からないまま それを作ってるから 裏偉いことになってる それで言うと 私たちも変わってるなと思ったのが 開発のやり方 2年前とか3年前って UI UX デザイナーが 起こしてくれたものを フィックスとして ここから変わらない これを私たちエンジニアは 開発していきましょう 最近はみんなで話しながら こっちの方が良くないとか この方が良いよねみたいなのを どんどん変わっているから 今の使用最新どれだっけみたいなのになる FIGも使用書として使うと 更新が大変 プロダクトマネージャーが最終決定してるのに デザイナーがそれに追いついてなくて 結構 # デザインよりも先にやること はい、あとは仕事のもうちょっと中身の話を深掘りしていきたいなと思うんですけど いいデザインって何?って うわーすごい質問だ どうやって決めるんですか? この体験というかこういう機能を作りましょうってなった時に何から考え始めて どういう基準でとか センスだけじゃないじゃないですか?なんかデータ元にしてとか すごい概念的な話をしちゃうんですけど そもそも国語みたいなものだと思ってて 国語の成績が悪いとデザイナーはきついって話があって まず文脈を読みましょうっていう つまり文脈を読むことと文脈に合わせて作ることの2種類があって仕事として そのまず文脈を読みましょう つまり今回のプロジェクトだとどう自分が動いたらいいのかなとか 何から考えるのかってそこが何ならデザイナーと結構中心だったりするんですよ仕事の プロジェクトの目的とかこういうことをやりたい人だから このデザインを考えようかっていう話ですね それを言語化してくれる人ほぼいないんですよ デザイナーが形にできるレベルで細かく だからまず言語化をしてもらうヒアリングするみたいなところが結構そこかな ケースバイケースっていう そもそもなんでこの機能を作るんでしたっけみたいなことから わーそっかじゃあ私たちが見てるのは本当にその思考の最終形態のだけであって 一番大事なのがその思考の過程とか もっと話を広げるとUI UX デザイナー私はそうなんですけど さらにもっと範囲を広げてプロダクトデザイナーみたいな概念もあって そういう人たちはもう自分から数字を見に行ってとか つまりなんでやるんだっけと 誰かに依頼されてそれをやるんじゃなくて 自分からもうそれを取りに行きますみたいな人たちもいるらしい 私はやってない だからもっと次こういう機能作りましょうよっていうぐらい みたいなプロダクトマネージャーとデザイナーをもう混ぜましたみたいな すごい そこまでやる人はやる でもそれってやってることに名前がついてる たぶんボイスみたいなスタートアップだったらできる環境ではありますよね 私はもっと頑張ればできると思うけど あとあれですね それをじゃあどういうものをとかっていう時に 材料になるのがユーザーインタビューになったりするんですかね そうですね 今回のプロジェクトってこうこうこうだとか もっと言えばボイシーってこういうプロダクトだよねとか 昔からこういう問題ありますよねとか その辺の文脈をヒアリングして じゃあもうちょっとユーザーの解像度を上げないとダメだよね だったらインタビューしようよっていう 手段の一個として ユーザーインタビューって横で聞いたことしかなくて 何やってるかとか動画とかを後で共有もらったりはされたことあるんですけど 実際どういうことを考えて何を聞くんですか なんか3つ段階があるっていう 話長くなったと思うんですけど どんな人なの?ユーザーさんってどんな人なの?っていうところ 特にボイシーとかって そこら辺のSNSと若干違ったりするじゃないですか ユーザーさんの色というか パーソナリティーさんもそうだし どんな人?誰が使うの?みたいな こういう生活をしてるからこういう機能あった方がいいよとか 今こういうことはしてないけど こういうことできたらたぶん喜んでくれるよねこの人は まずどんな人っていうところが一番大事 今の行動をどんな操作してるの?みたいな この機能は絶対使うから ここを触ってはいけませんみたいなこととか 全部網羅すんのめっちゃ大変ですけど でもそこは外すと偉いことになるっていうところもあるから 私その機能をどう使ってるかっていうことだけじゃなくて なんでそれをそう使ってるの?っていう心理 ここで心理学とかちゃんとやってる人たちは強いんだろうな そう思うんですけど私はそんなにやってません 総合格闘技だ そういうのをチョイスしてデザインを反映する 全部は反映できないから どこを反映しますか? なるほど取捨選択をしてくんだ ありがとうございます 全然違う話なんですけど どうやったらUI UXデザイナーになれるんですか? 美大に行ったらみんな行くんですか? 私はもう美大は行ってなくて 高校がデザインをなんとなく学びましょう 紙に絵の具を塗って色彩感覚とレイアウトの感覚を養いましょうみたいな すごい基礎だなみたいなところをやってたんですけど そこから私はグラフィックデザインを最初やってて 全然UIとか分かんねえわけじゃなかった ウェブサービスの会社に転職したら なりゆきで今ウェブデザイナーとかUIデザイナーとかやる人いないからやってみたいな感じで 今こうなってるんで やる気があって機会があればなるんじゃないかなみたいな 気づいたら 資格とかは特にないから 免許とかないんですよ デザイナー免許ないから 実際寺木さん個人としては グラフィックデザインって 多分センスというか 自分の創造性をわかってると思うけど 確かに理由は唯一は 使う人がいてそこをベースに考えると思うんですけど どっちが好きですか? まずグラフィックデザインの話から手入れさせていただきたい 僕の話がずっと違うかもしれない グラフィックデザインの中で色々あって 文脈がそれこそ色々ある アーティスティックに自分の世界を 表現できる仕事もあるし そうじゃない仕事もあるし アートとデザインが違うのか 見る人を意識してやる方もありますよね 意味がより近いような 高校のデザインを勉強してる時に 社会の先生に言われた話があった 高校だから社会の 普通の授業がある 時に世が世なら プロパガンダポスターとか作れみたいな ユーザーとかじゃなくて 人の心を奮い立たせるとか 国がこうしろって言ってる 俺はこれを作るみたいな 文脈がすごい色々あるんですよ グラフィックとしても だからUIだろうが グラフィックも紙だろうが あんま変わらなくて 色んな仕事があります っていう感じなんですけど そうですね 私はアーツ系は そもそも経験としてないから あんまり比較がそれで言うと できないかなみたいな あんまり知らない世界だから これもっとどんどん聞きたいんですけど そろそろお時間になりまして テラディーさんの今後の ボイシーの展望などありますか? そのことやりたいな なんか なんでしょうね みんな幸せになって 争いなく 争いなく インタビューとかで やっぱり私も人間だから 会った人には必ず 幸せになってほしいなって 思います本当 ための方法 素敵ですね 今日は 突然お呼びしまして 出演いただきありがとうございます # コメント返信 では今週もコメント返ししていきます。 コメントは1件いただいています。 キングダムさんからありがとうございます。 ともさん、うささん、いつもありがとうございます。 まさかの不具合報告、すみませんでした。 今日は泣ける映画を見て累活十分です。楽しく過ごしていきましょう。 ということでコメントありがとうございます。 まさかの不具合報告。 前回の放送で不具合報告をしていただいて すみません。 こちらこそありがとうございます。 しかもともさん、うささんは iOSをメインで開発をしていたことがある。 そうですね。 今はもう全員プロジェクトエンジニアとして アプリに詳しい人たちが iOSアプリに詳しい人たちがたまたまね。 ありがとうございます。 泣ける映画を見ましたと。 最近映画とか見ましたか? いやー、あんま見てないですね。 でもあれですね。 グローブ見ました。 グローブ? スターウォーズの。 マンダロリアンとグローブみたいな。 あれも結構感動というか。 スターウォーズはよかったです。 スターウォーズ見てない。 マンダロリアン。 このヨーダがちっちゃいの。 かわいい。 これだけ知らなくて見たらちょっと怖くなるけど ひわがあんまないんだ。 マンダロリアンがちっちゃいの。 マンダロリアンがでかいの。 人間。 そうなの? ヨーダのちっちゃいやつ。 そのコンビの話。 そうなんだ。 ポケモンみたいなのが肩に乗ってるもんね。 なんもしかなくて面白かったです。 見たことなかったですけど。 すごいよく言ったね。 見たことないけど。 私はあれ見ましたよ。 プラダを着た悪魔2を見ました。 いいですね。 20年前とかだけどよかったですね。 懐かしい気持ち。 いいですね。 女性が好きな感じの。 おしゃれだしね。 ルイカブいいですね。 大事ですよね。 心穏やかに日々やっていきましょう。 ということで、 今日もありがとうございます。 次はどの子へと繋がりますか? 引き続きボイシーでお楽しみください。