このセッションでは、初心者向けUI-UXのデザインのヒントとして、デザイナーだけでなく、ディレクターやエンジニアを知っておくだけで、より良いUI-UXを提供できるポイントについてお話いただきたいと思います。それでは、佐坂義さん、よろしくお願いします。はい。佐坂です。よろしくお願いします。今回のスライド、先にお伝えしますと、この場で見せる気のないスライドというのが出てきます。ただ、この場で見れないと気持ち悪いという方がいるのも分かります。なので、10分前くらいに私のブログの家庭にツイートが流れていて、WC東京CDというハッシュタグで探していただくと、このスライドを既にアップしてある記事にたどり着くことができるようになっておりますので、手元で見たいぞという方あるいは、座席の通行帳ちょっとちゃんと見えないんだという方がいらっしゃったら、もう見ていただいて全然構いません。先にお伝えしておきます。ということで、このセッションのテーマは誰でもチャレンジできるワードプレスにおけるUI UXのヒントということなんですけれども、正直なところ、最初の一業は今回のテーマに合わせて後から付け足します。なので、誰でもチャレンジできるかどうかは分かりませんが、きっかけにはなり得ると思っていただけたらと思います。で、あくまでもヒントということもありますので、まず最初に今回ご紹介するのはセオリーの部分が多いです。なので、すべての案件に必ず使えるというわけではありません。その中で必要なものを手車選択する必要があったり、あるいはアレンジする必要があるというのは大前提です。なので、案件ごとに両方よりを守って正しく使っていただくようにお願い致します。で、あくまでも初心者向けです。なので、ペルソナあとCJMって書いた瞬間に、あ、アレねって分かった人に関しては、たぶんここにいるよりもグーテンベルグとか、グルグル回すとかそっちに行った方が皆さんの身のためになる可能性があります。なので、この辺も分かってるよという方はこの辺の話しかしませんので、ほぼなので必要に応じて今のうちに他のセッションに行かれてください。ということで、まず自己紹介からしていきたいと思います。ささかはと申します。Twitterなどではささぴよという名前が出ておりますので、必要に応じて探していただければ見つかると思います。フリーランスでいろんなことをやっております。ケント&カンパニーという野郷でやっておりまして、Twitterはこのアカウントです。ワードプレイズのブルグももちろんやっておりまして、あんまり記事書いてる方がないんですけど、なんか思い立った時にズラーッと書いてドーンと上げるという感じにしております。先ほどご紹介の時にも出していただいたんですけれども、オンラインスクール、テッカー・アカデミーというところでメンターという名の元に講習をやっておりまして、UIXのほか、Webデザイン、ワードプレイズ、あとNodeJSを皆さんにお伝えしているというところ。そして、公認エヴァン・ジェリストという方々を一応いただいております。1年くらい前からですね、YouTubeでゆるゆるとゲーム実況したりとかということをやっております。すっごい下手ですけど、興味がある方、後で声をかけてください。なんだかんだ言ってですね、言語の幅もそうなんですけれどもデザインもやっていて、もともと出身とした印刷系のデザインもやってきてますので、そこもやり映像もやり、大学では音響、作曲やったりとかというのもやってましたので、わりと何でもやります。とりあえず、何かこれどうしたらいいのかな?みたいなのを思ったら是非声をかけていただければと思います。ということでデザイナーでもあり、プログラムでもあるんですけど、あとワードプレイズWPCLIというものがあるというのをご存知の方、すっごいありがとうございます。このタイミング基調、デザイナーですよという方。ご自身のメインの職がデザイナーですよ。ありがとうございます。コードを書く、プログラムも含めてコードを書きますという方。なるほど、それ以外の方、マーケティングとか営業とかそっちの方が多いのかな?わかりました。ありがとうございます。ディレクションとかもいらっしゃるかなと思うんですけれども、私はあまりディレクションとかやんないんですけれども、デザイナープログラマっていうの当たりはやったりしますというところで、プログラムの方ならCLIということがでわかると思うんですけれども、いわゆる黒い画面ですね。黒い画面に文字をパタパタ売っていくと、それでワードプレイズの管理をする。この後、次のセッションでありますけれども、サーバー会社さんが裏側で簡単インストールとか、そういうのを用意してくださったりしてますけれども、その裏側で覚えている仕組みのベースですね。WPCLI、ワードプレイズをCLIのところから操ってやろうというようなツールがあるんですけれども、それのコントリビューターを先日、今年の6月にあった大阪のワードキャンプの際にコントリビューターになれましたというところです。あとはワードプレイズ本体としては本役もやっておりますので、コントリビューターになっております。東京のワードキャンプもちろんいますけれども、関西の方が参加している回数が多くて、普通に東京の人です。関西に行くと、視界の人ねって言われることが多いです。このような視界とかまでやりますので、わりと何でもやる人、大事なことがあまりで2回目です。ということで本題にそろそろ入っていきましょう。皆さんUIUXって説明できますか?と言われて、程々に自信を持って母入って言える方手を挙げてみてください。あ、いらっしゃることはいらっしゃる。なるほど。わかりました。ありがとうございます。多分その後、この後、多分40分ぐらい無駄になっちゃうかもしれないので、他行っても大丈夫ですからね。はい、というわけでUIUXデザイン。まずはUIUXというふうに言われますがUIUXから見ていきましょう。UIUXは何の力か、ユーザーエクスペリエンスですね。ユーザーの体験をデザインするということになります。最近デザインという言葉がすごく広くなってきましたね。なんか絵描いたり、ものの配置して綺麗に見せるということだけでなく、いろんなことを設計するようなことをデザインと言われるようになってきました。まさにそのうちの一つ、体験をデザインするということです。で、それはじゃあどういうことなの?という話になりますが、作っていくもの、それは何かにもよります。例えばアプリなのかサイトなのか、あるいはお店なのか、そういったものも含まれてきますけれども、そういうものに関わるすべてが対象になってきます。なので、アプリを使っているその瞬間だけではなく、あるいはサイトを見ているその瞬間だけではなく、それをシェアして友達との話に出すところだったりとか、あるいはそのことについて考える時間だったりとか、というのも含まれてくる。あるいはあのツール使ったらできそうなのか、あのサイトを見たらわかりそうだなって思ってもらうこともこのUXには含まれてくると、すごい幅広いということをなんとなく感じていただければと思います。それが今お伝えした直接的に触れていなくても検討しなければいけないことが多いというところにつながってくるわけですね。いわゆる今概念的なところでざざっと説明したんですけれども、やっぱりイメージしづらいと思うので一般化して考えると建物を建てるときの基礎、あるいは骨組みを建てて壁入れるぐらいのところですかね。壁やねが出来上がるぐらいのところまでというのがなんとなくUXデザインの繁中だと考えていただくといいのかなと思います。じょじょじょじみなさんの見見がこうなってくるんですけど、つたまってるから大丈夫かな。正直、私このセッション、この半分いないと思ってたんで、ちょっと圧倒されてる感じは否めないんですけど、最後に質問する時間取ろうと思うので今のうち何か書き出しておいてください。UXデザインということに関してなんですけれども、やっぱり体験を作り上げるってすごい大変なんですよね。一人一人やっぱり違うことをしますし、あるいはそれぞれのバックグラウンドは違う、そういったことを考えるとやっぱり難しい。ということはやっぱり人それでそれのことを考えていかなきゃいけないんだったら、考える人が一人っていうのもかなり大変だということになる。なので大変なんです。大変なんです。なので割と会社とかだと、このプロジェクトのUXはじゃあ誰々さんでみたいなことを言われることはすごく多いと思うんですね。リーディングしていくという意味でその人が刺されているのであれば構わないんですけれども、実際その人一人で全部やるというのはかなり厳しいと考えていただけばと思います。何ならヒアリングをするなのか、あるいは色々な人と一緒にUXの部分を設計をしていくのかというのは一人でやっていくのはかなり厳しいぞというのをなんとなくこの後の話でもイメージしていただけたらと思います。体験を作ることにどういうことが有効かってよく聞かれます。URUXの勉強って何したらいいんですかっていう話ですね。オンラインスクールにいるということもあって、よく聞かれる質問のされ方としてはURUXこれから先勉強していくのにいい本ありますかっていう質問がよくあります。私は別に悪い本ばかりだという意味ではなくて、本はどうしてもその書かれたタイミングでの情報からなかなかアップデートされづらい、万言ったら書店さんに置かれているものは古くなることも多いっていうこともあって、あんまり本で勉強することを私はおすすめしてないです。素晴らしい本もたくさんあるので、見ること自体はとても大切だとは思います。ただ体験に関してっていうことで言ったら皆さんが普段やっていること、それがすべてインプットになりうるっていうことになってきます。ここに来るまでに皆さん何をされたでしょうか。朝起きて目覚ましを止めた方もいるでしょう。止めた方もいるでしょう。歯を磨いた方もいるでしょう。そして少なからずここで受付を通ってきたりしました。その時の皆さんの体験だったりとか。あるいはここに座る時の椅子の選び方の体験だったりとか。っていうのもインプットにはなりうる、ヒントになりうるというところでは皆さんの日々の生活がすべてのUXを作り上げるベースになりうるということになります。なので、日々の何気なくやっているいろんなことをぜひ意識的に見ていただきたいんですね。例えば、私がよくUXの話で出すところではひねる形の着地、最近にこう上げたり下げたりってのがありますけど、ひねる形の着地。どっちにひねるとしまいますか?だいたい時計マージマースをしまうんですよね。あれって右利きの人が多くて親指で押した方が締めやすいから締まりやすいようにしている。っていうのがもともとの設計としてあるそうです。なので、締める、開けるっていうのを何かひねる動作で締めしたいって思った時にはそのような方向を意識してあげる。着地と同じように作ってあげるみたいなことが日々の生活からインターフェースへの活用方の一つになっていきます。なのでそういったところが本当に積み上がって色々なことを考えることができるようになるんだぜというのがここでのお話になってきます。それがワードプレスだとどこにあたるの?という話。ワードキャンプラでワードプレスの話をしないといけませんね。ワードプレスでは大よそです。大よそです。PHPあるいはJavaScriptなどのプログラミングの部分が割とになっていることが多いです。技術的な部分というところが割と大きい。UXという部分で考えるとですね。なので考え方によっては諸説ありますもちろん。なんですけどざっくりこんな感じだよと思っていただけたらと思います。それを踏まえてUIはじゃあUXで全部終わっちゃったじゃんみたいな感じがあると思います。がUIは見た目をデザインすることですねルーザーインターフェイス見た目の部分ですね。なのでじゃあそれは何なの?というとUI-UXというふうに言われています。並列ではないUXの中に含まれる一部UXを作り上げるための一つの手段というふうに考えていただけるとわかりやすいんじゃないかなと思います。一般的にはいわゆるデザイナーさんがやるようなことというのがここにあたります。今やるウェブデザイナーさん、アプリのデザイナーさんも含まれてインターフェイスのデザインをすることというのがUIデザインになってくるわけですね。ということはワードプレスにおける部分でいくと最終的にはHTMLとして出力される部分あるいはCSSの部分というのがになっているということになってきます。もちろん一部ジャバスクリプトが入ってきたりというのも含まれてくると思います。こういうことを言っているんですけど本当にそれだけのお花っていうのは後でまたお話が出てきますので改めてちょっとその時にお話していこうと思います。今出した順番でまずはUXについてちょっとまた早いって人話早いよ。おせいよって人おどよいよって人大丈夫そうよかったよね。よくしゃべりが眠くなりやすいって言われるんで寝てもいいですからね別に。来ました。見せる機能ないスライドです。大丈夫ですよ皆さん。ちゃんとスライド上げますからね。上がってますからね。昨日の段階で準備しておきましたからね。これはUIUXの中でも有名な方でハセガワーさんという方がいらっしゃいます。その方が書かれた絵をもう一度に改めて描いてもらった私は絵を描けないので描いてもらった図になります。UIUX何してるの?って言うと見える部分と見えない部分がすごい分かれている。で見える部分でいわゆる標山の一角でしかなくて通りに関してあれやこれやと勉強してあるいはできるようになってますって見せられる状態があってっていうようなところあるいは成果物も見えるものですよね。それに対してセオリーとかも説明できればわりと見える部分だと思います。それ以外のここ。これがもう本当の一言で言ったりやばい。やばいですよ。いわゆるビジネスの考え方だったりとかあるいはデザイン思考こういうものがありますとかいわゆる引き出しの部分。脳内の引き出しの部分っていうのがこの部分に入ってきてどうやったら必要な調査ができるかなとかどういう心理でこういうことをしていくんだろうかっていう部分だったりとかっていうのを考えていく目には見えづらい部分っていうのがUXにすごくいっぱいあるっていうのがなんとなくこの敵にはどっちもどっちっていっぱいある感じで見えるんですけど下のほうがちょっと広告数としては多いというのでなんとなく感じていただけたらとは思います。本当に書いてある通りここにはそこなし状態と書いてあるんですけどもまさにそこなし延々とアップデートも必要なしこの時にはどうなんだあの時にはどうなんだっていう話が毎回出てくるというレベルですねというところがこの絵で示したいところになってきますじゃあそれを考え抜いた例って例えばどんなものがあるのっていう話ですねイメージしやすいものをご紹介していきましょう地域性もあるので一応二つ並べております東京ディズニーリゾートあるいはそういったところを含めてテーマパークでの体験っていうのは割と考え抜かれていることが多いですただこの二つ実は方向性が結構違います両方行かれたことがある方おー半分ぐらい片方だけしか行ったことないからやっぱり半分ぐらいどっちも行ったことないからいらっしゃるはいらっしゃるですねなのでそういう方にはイメージしづらいかもしれないんですけどもまず東京ディズニーリゾートということで考えてみましょうちょっと本当に商品の部分すごい不安ではあるんですけども悪口は言ってませんので東京ディズニーリゾート待っている間比較的飽きさせないような努力がされています待っているところでもそれぞれのアトラクションであったりとかあるいはレストランだレストランはあまり対策しきれてないところもありますけれどもアトラクションの並んでいる間例えば120分待ち私は過去に240っていう数字を出したことがあるんですけれども240分待ちとかってなってるところで並んでいる間ですねただの通路に並んでいるわけじゃないんですよね今日のワードキャンプの受付みたいにねあそこの通路につらっと並んでいるみたいなわけではないその周りにも何かしらいろんなものがあってその世界観に入っていくための準備がされている場合によってはそこにストーリーができている皆さんがなかなか見ないであろう会中時計1つその時間がさしている時間が意味があったりだとかっていうようなことも実はあったりしますそれぐらい考え抜かれていてかつこんなことしてもらったあんなことしてもらったっていう話いろんなところでシェアされたりしますよねなんだったら本になってるぐらいっていうことはやっぱりあの体験良かったなっていう気持ちが残るような仕組みがあるということになりますそれに対してエミファサルスタジオさんはコミュニケーションをとってどんどん仲良くいろんなことができたその世界の中に入っていけるっていう方向性が主人公として入っていくっていうよりもみんなと一緒になっていくっていう考え方の入っていき方っていうのがエミファサルスタジオジャパンでの体験の作り方同じような楽しかったなの気持ちあれは中にしっかり入り込めたという感覚を作るための方向性の違いがあったりしますそして私も先ほどゲームの話ちょっとしましたけれどもスプラトゥンばっかり割りとやってるんですけれども一緒に遊んでくださる方後で名刺交換すると下にフレンドコードがありますので後で名刺を渡しますねニンテンドースイッチこれも割と確信的な部分ではありますね今までは家庭用ゲーム機って言われると家で遊ぶあるいは持ち出すことが前提しかなかったところを家でドッグに置いてあげれば家庭用ゲーム機として遊べるなんだったらそのまま途中でバッと持って外に行くこともできるというような遊び方ができるというところは新しい体験を作り出していてかつフラストレーションがたまりづらいような仕組みができているということにもなりますそれも一つの体験の作り方ということになりますちなみにニンテンドーさん割とすごい例えばそこまで来ていたいろいろなところで家庭内で一人で遊んでいるとかそういうようなところを指摘されたらWIUで家族でみんなで遊べるゲームどうですか?というふうに出していきたいですとかねあるいは建物の中にこもって遊んでいるじゃあ持って出れるようにしたらどうでしょう?バンという感じにニンテンドースイッチを出してきたみたいなところがありますかなり考えの限り優秀なところついてらっしゃるんだなというのは体験というところでいくとスターバックスコーヒーのカップの話はよくそれこそSNSでもシェアされたりすると思いますずっとこの中にの窓でお仕事されている方もいらっしゃるかもしれませんけれどもカップでね仕事頑張ってくださいって書かれたとかっていうのを写真にとってインスタにあげる方とかいらっしゃいますよねああいうのもまさに一つの体験を作り出しているわけですねそしてみなさんのなっていう気持ちを作っていくっていうところが考え抜かれている例最近はちょっとシールになっていてそういうシーンも減ってきているようではあるんですけれどもこういうのも一つ考え抜かれたしかも会社としてやっているというよりはねそれぞれがやっているというところで特殊な例のかなという風に思います一番目と一番下は過去に私が仕事をしていた場所になりますというわけでこんなのをご用意してみましたユーザーXペニスUXのご回送というものを見たことがある聞いたことがあるという方いらっしゃいますかいらっしゃらないあ、良かったいる意味があるかもしれないもちろんGちっちゃいのでここで見せている気がないスライド第2弾でございますざっくり言いますと上から見た目にかかわっていくそして下のほうが深い内容になっていきますで、作業として進めるべきは下からですどういうことかというと下のほうに戦略とかがありますどういうふうにしていこうかなというベースですね何を達成させたいのかどういうことをやりたいのかということを考えてそれを要件にします要件としてまとめていきます具体的に何ができなきゃいけないのかどういうふうになっているべきなのかということをまとめていきますそれを構造として整理して骨格を組み上げ表面を作るという流れになっていますなので1番上がUIですそれをこの5回素を全部合わせてUX1番上がUIと思っていただければと思いますで、また同じようなことを繰り返しちゃうなそれらを作るためにできることさっきもいくつかご紹介しましたが普段触れているものに理由を探すというのは先ほどお話した部分ですで、あとは見た目のことに関してどうしても問われることはありますなのでですし実際問題今UXの話をしていますけれどもUXデザイナーという仕事をしている人って多分そんなに多くないUIUXデザイナーということでUIの言葉で求められるというシーンはすごく多いと思いますなので例えばデザインのなんかこれいいなと思った例えば今回のお渡ししているこのパンフレートがいいなと思ったそしたらこれなんで自分はこれが気に入ったんだろうということを改めて考えるということをやってあげるとなるほどねこういうところが自分には合っているんだなっていうのは見えてきたりします逆に自分がいやもう本当このデザイン向け付けないんだけどって思ったものもその理由を探ってみましょうもしそれが気に入ってるっていう人物像がいるのであればその人にもその人に聞くなりあるいはその人のことをイメージしながらどこがこの人に対していいんだろうということを考えてみましょうあとは体験を作るというところで行きますとたぶんデザインさんとは謎の動きしますよねその辺で水こぼしたりとかしてるのに平然と他の人の飲み物とか食べ物とか運んでから最後に掃除みたいな危なくねそれっていうようなこともあったりすると思いますそういうのがなんでこの人こういう風にしたんだろうなっていうのをちょっと考えてみるそうすると自分ではパッと思いつかない行動の理由が見えてきますそうすることによって最終的に結局作るものって自分が使うことがメインではなくていろんな人に使ってもらうことがメインなのでその時に気にするべきポイントがどんどん増えていきます自分の中でそういう風に考える人もいるなあいう風に考える人もいるなっていうことが見えてくることによって最終的にこういうものを作る時にはここでこう思う人もいるかもしれないからじゃ例えばボタンはこういう風に配置しようだったりとかそういう風につながってくることがありますなので日々の生活の中で本当に一日一つでもいいのでこれをこれはなんでだろうこれは何のためにしてるんだろうこれは何がいいんだろうっていうのを見つけて理由探しをしていって見てください実際私が私も別にUI-UX含めデザインに関しても誰かに教わったわけではなく日々これをやった結果あってきるじゃんってなったっていうところがありますなので多分誰でもお金をかけずにできる私あんまりお金かけなくないのでできるだけ抵抗するできるものっていうことでこういうものがありますよというご紹介をしていきましたこれをやっていってじゃあいざ案件に入りましょうとなると案件に入ったときにやっぱりさうちはこれを見せないからこうしたいんだよねみたいな話って絶対出てくるんですただユーザーXセニーズUI-Xという名のもとで考えたらあくまでもユーザーが主体ですあくまでもユーザーが主体です絶対に私たちがこうしたいからっていう理由で決めてはいけませんだって使うの自分たちじゃないんだもん使ってもらうんだもんあるいは見てもらうんだもんっていう話ですねなので例えば売り込みのための周り道は絶対にやってはユーザーXとしてはやってはいけないということですよくある例はニュースサイトですかねニュース記事飛んでみたらこの広告をスキップするっていう全画面が出てくるみたいなありますよねあれはユーザーXの観点から行ったらなしですで割と最近になったのは下から出てくる広告とか禁止になりましたけれどもそういうのもユーザーXとしてはあってはならないというふうに考えられていますがとはいえ案件ですからそして企業さんが作る提供するサービスのサイトを作ったりだとかそういうことがありますのである程度は私たちが見せなきゃいけないものっていうのも決まってきますそういうところに関してはバランスをとって判断していく必要はありますがユーザーの離脱率が上がるというのを皆さんはわかりになっていると思いますのでそこでのバランスはとても大切ですじゃあそれらを判断するのにどうしたらいいのかというのはもうちょっと後でお話をしていきます例えばどんなことがユーザーXのためにできるのというところでキーワードになりそのものを紹介しましたこれはまさにタイトルにあったヒントの部分ですね例えばWBAPIご存知の方WBJSONとかもりと少ないあまり知られてないありがとうございますワードプレイズにはAPIの機能がございます特に今はプラグインを引き入れる必要もございません例えばカテゴリーが欲しいなと思ったらカテゴリーチラン欲しいなと思ったら特定のURLを叩くことによってカテゴリーチランがJSON形式で帰ってくる仕組みがございますそれを使えばJSでいろんなことができるわけですセンチャマスクリプトでいろんなことができるようになるそのAPIのエンドポイントと呼ばれるどんな情報を提供するのかというのを決めていく部分は自分でも作れますなので親カテゴリーの情報を渡してあげたら個カテゴリーの情報を返してみたいなことももちろんできるこういうことを使うことによってユーザーの体験がスムーズになってくんですよねフラストレーションがたまらない例えばワードプレイズという選択をした後ズラートワードプレイズに関するいろんなカテゴリーが出てきてわりとフラストレーションだと思いますでもそれがAJAXを使ってセレクトボックスワードプレイズで選んだら自動的にセレクトボックス更新されてというのが繰り返されていたらかなりスムーズにことが運びますよねなのでこういうことがわりとポイントになってくる可能性はありますしわりと使いやすいと思いますもしWPAPI使ったことがない方がいらっしゃったらこれきっかけに今日とは言いません1ヶ月いないぐらいに一回ぜひちょっと情報を探してみてくださいあとは検索のさせ方とかもありますよね全部なのかあるいはタイトルだけを対象にするのかそれによって調べやすい見つけやすいということがあったりすると思いますあとは見せたい情報が適切にアクセスできるかアクセスできるかどうかというのも一つのポイントになりくると思いますなのでユーザーが流れてくる内容を判断してこれはマーケティングの部分もかかってきます例えばアナリティクスで分析した結果公益検索技が多いということであればこのページにたどり着くにはそういう情報を欲しがっている人がいるじゃあ今まで見せていたこの項目を順番を入れかえてみようとかそういうことにつながっていくこれも一つのエクスペリエンスです情報にたどり着くまでが早ければ早いほどユーザーは安心しますいいものという認識をしていきますなのでぜひこの情報が適切に配置されているかっていうようなことも見直してみるといいかもしれませんあとはそれが今の下の話につながってくる部分ですね実際にしましたというわけでさらにUIの話をしていきましょうか先ほどもお話したというのよりUIはUXを成立させるための操作版というようなところがありますなのでこれをしたらこうなるということを適切に整理してわかりやすく見せてあげるということがメインになってきますここでもう一回います日々の生活に日々の生活で慣れている動きにできるだけ合わせてあげましょうそして似たような機能を持つものに見せてあげましょうそういうふうにしていくことによってユーザーは自然とできるっていう意識をせずに言うので最終的に使いやすいあるいはいいものだという認識をして言ってくれますなのでOKボタンとCancelボタンどっちをどっちに置くんだとかそういったこともここでの話をベースに決めていくことになりますがじゃあその基準ってどうなるのっていうのは後で出てきますUIについてもう本当にザラッといきましたけれどもダメなUIの話をしてみましょうダメですね読めない読めないっていうのはアウトさっきの見せる機のないスライドとかアウトのやつですあとはちょっと前にTwitterとかで話題になってたんですけどフォバーに頼ったデザインフォバーしないとクリックできるかわからないようなデザインこれもあんまり理想的ではないですクリックできるかわからないのでレスポンシベでわざわざ変えているのであれなんですけどもスマートフォーム時どうすんのみたいな部分もあるいは今だとタブレットPCという形でWindowsを使われている方もいらっしゃるでしょうそういった方々はマウスを使わずにタッチで操作するというシーンもあるかもしれませんじゃあそういう人たちはどうやったらリンクに気付けるのという話になっていきますののでフォバーはじゃなきゃわからないようなデザインっていうのはあんまり使わないほうがいいあとは普段使ってるものと異なる動きですね例えば今日帰りエレベーターでボタンを下にあるボタンを押したそしたら実はそれが上を呼ぶためのボタンだったら皆さん衝撃じゃないですかそういうことですそういう今の極端な例ですけども上と下のボタンが逆転していたらそれはびっくりするとなんだこれとなるわけなので例えば戻ると完了のボタンの位置だったりとかそういうスマートフォームだとあったりしますね特にアプリはそういう傾向がありますけどそういうものの位置とかというのは私ですということで日々の皆さんのインプットというのはとても重要ですよというのがここまででもう散々を伝えしたかったこと逆にそれができればわりといろんなことができるようになります多分皆さんの頭の中で整理していけばあの時のって引き出しさえ開けられればあとのことは正直できるような気がしますじゃあそれを具体的に業務の中でどうやって行ったらいいのがここからの話になっていきますそれはですねこういう順番で一つの例ですあとはアプリの場合にこういう部分にやることがわりと多いまずペルソなアスカマージャーリーマップそしてワイヤーフレームデザインカンプコーディング下3つはもういいでしょう他の皆さんが散々喋ると思うのでその辺はちょっと活躍します上の2つが初めて見この2つのキーワードどちらかでも結構です初めて見ましたという方どれくらいらっしゃいますか3分の1まで行かないぐらいはいらっしゃるという感じですねわかりましたまずペルソな一言で言うと一言チーム全体で共有するターゲットソンの中でこれ一般論です最も平均的な人物を具体化したものです存在しうる存在しそうな人物像でドセンターターゲットソンのドセンターにあたりそうな人物を作り上げることですなので例えば30代女性主婦というターゲットがあったとしますカタワラに30代女性主婦がいらっしゃったあっじゃあこの人でいいじゃんこの人のことを書いていいわけではないんです30代女性主婦はこの世の中にたくさんいらっしゃいますその中でどういう人が多いのかっていうのを調べてまとめて具体的に書いていくということですなのですごい調査が必要ですしできるだけ具体的な方がいいです例えば共通の知人がいたとしますその人に横に行ったときにこの見上げ良さそうじゃないっていう話ができるわけですね一緒に行った人と共通の知人が一人いるっていう状態だったらあの子にこれ買ってってあげるよいいんじゃないっていう話ができるこれぐらいの関係性の人物ゾーンがペルソナとして出来上がるのが理想ですチーム内で共通の知人として話ができるぐらいのイメージだから旦那さんの年齢だったりとか旦那さんの職業だったりとかっていうのももちろん子どもがいるんだったら何歳なの男女どっちなの保育園行ってるの幼稚園行ってるの行ってないのお弁当作ってのいつもみたいなそういうのも具体的にできるだけ決めていくなんだったらA4、3、4枚になったりすることもあるような内容になっていきます高校が結構大変ただこれは調べてやってみないと絶対にできるようにはならないのでぜひ何か一つ題材を決めてやってみてくださいターゲットスをこういう人物って決めてやってみてくださいちなみにこれをやるときに何から調べたらいいか分かんないという方がよくいますもちろん統計局とかの情報も使えますが一番使えるのはファッション雑誌ですすでにターゲット装が分かれていますどの装の人なのかっていうのを見てそれをその雑誌を見てみましょう広告を見て広告会社の広告がオーストラリアって言ってるじゃあオーストラリア行きたいっていう人が多いんだろうなっていうのを想像でできる方法がひっそりまとまってますから分かりやすいですすごくめわりやすいと思いますそしてカスタマージャニーマップこれは今作ったペルソナが目的を達成しようとしたときに何をしてきますか具体的にっていうところを並べてフェイズボートに書いていくことですそしてその中で私たちが気をつけるべきことっていうのも一緒に書いていったりします調べるといっぱいサンプラー出てきますのでカスタマージャニーマップぜひよかったらどん書き方が正解っていうのはあまりないですただフェイズをまとめていて具体的にどんな行動をしてそのときに何をしていて例えばサービスアプリあるいはサイト見ている使っている時じゃないときにもこの達成に対して何をしているのかっていうのも書いていくことになってユーザーがどういうふうにしたら便利そうかっていうのが見えてきますこれも割と作るの大変かもしれないですけどベルソナができているとペルソナがさっきの建物と基礎に当たるのでこれをどうしようって思ったときには全員でさっきのペルソナのとこに戻っていきますペルソナがこうしたいって思うはずだからこうするという流れで考えていくわけですねちょっと話前後にしちゃいましたね失礼しましたでここでポイントになるワードプレス制作でのユーザーって何って話なんですこれはちょっと見方によりますサイトにというのももちろんユーザーなんですけれども私たちからしたら制作側からしたらクライアントももちろんユーザーです管理画面を使う人もユーザーになりえますということは私たちにできることは管理画面も適切に作っていくということここも割と重要になってきますサイト作るときにどうしても見た目の方クライアントさんから突っ込まれてそればったりということになることは多いと思いますただ色と作ったりグーゼンベルグのブロック使ったりあるいは色んなことを見えるように管理画面作り直したりそういうこともできるようになったほうがいいということですねこういうのを使いますというのが座って書いてありますちょっと時間的に厳しいのでとりあえず一旦見といてくださいで気になった方はスライドを見ていただけたら改めてスライドを見ていただけたらと思います色々こういうことをやったら解決できるかもよというのがグーゼンベルグの話ちょっと出したので一応お伝えしておきます今隣でもやってますけれどもグーゼンベルグのセッションがいろいろありますこれから先グーゼンベルグは標準になりますのでぜひ今のうちに今後に備えて準備をしておいたほうがいいとは思いますグーゼンベルグ知らなかった方はぜひ今日の機会にいろんな人に聞いていってください今年中にセイキリリースに入るはずの機能になっていますそしてその体験も引き出しになり得るというところで抑えておきましょうということでそろそろまとめますまず日々の生活でインプットって意識的に今までしてましたかどうですかというところですねそして毎日の生活の中で何をどういうふうに操作したり触れたりしていて何をしているのか改めて意識的にやっていってみましょうで作ろうとしているものに似ているものがあったらその引き出しを開いて参考にするということがポイントになってユーザーになり得るというのは割と見落としがちなポイントになりますのでそこも気をつけていきましょうということで質問ありますかっていうスライド一応用意したんですけどもう1本切ってるんでフラフラしてますこの後もアフターパーティもいきますのでもし何かあれば基本的にはネットワーキングルームにいるようにしようと思うんですけどもし何かあればお伝えしけれなかった部分結構あるんでよかったら声をかけていただけたらと思いますというわけでご清聴ありがとうございました佐々川さんありがとうございました