Uni-Q blog

うにきゅう ぶろぐ

カスタマージャーニーマップは横長で大変だから他のフォーマットでデザイン思考スッキリ。XDで。

今年の3月くらいAdobe XD meeting にて、XDでカスタマージャーニーマップ作るよ〜というお話をさせていただきました。

恐れおおくもそんな機会を〜。。。

そこで「長くなっちゃった場合どうしよう」なんて質問もあり、 また、現場にて、なかなかジャーニーマップにまとまりにくい状況もあったりで、 別の方法で、グニョグニョに迷わずスッキリ方向性が決められる方法ないか、ユーザーのあれこれを発見できる方法がないか模索してまして、 それについて書きます。

※ この記事は「Adobe XD Advent Calendar 2018 - Adventar 」の10日目の記事です。

やろうとしたきっかけ

とあるお仕事にて、すんごーーーーく完結なジャーニーマップを、エンジニアでもデザイナーでもないプランナー・ディレクターでもない関係者の方(サービスの問題に関わるユーザーでもあるかもしれない方)に共有したら、 自分にとって、「!!!」となるようなフィードバックがもらえたのです。

ただ、上記に述べたとおりで、ひとつのジャーニーマップにまとまりにくい状況になり、、 その一歩手前ぐらいの状況を図にして、 その関係者の方と会話ができたらいいなと思いました。

達成したいこと

  • 何を作ったらいいか
  • 何を優先したらいいか

これらの判断が自分でできるようになるような資料を作りたかった。

そのサービスを使う立場の人たちはけっこう多くて、自分には馴染みのない業界のツール。 その業界の人たちの価値観を知る作業が必要だと感じました。

また、その業界の方たちと、私の資料を使って非同期でお話できるような、、、コメントをもらえるような状況を作りたかった。

XD を選んだ理由

  • アカウントを別途作らなくても、コメントをつけてもらえる!
  • 図的なもの作れる。
  • デザイナー以外でも編集できそう。
  • たまにUI作って「どうでしょ?」っていう話もできる。

つくったもの1:関わる人達図

こっからはXDノウハウ関係ないですが〜><

最初はこういった図にしようと思ったんですが、関係者が多すぎてまとまらず…。

f:id:uniq:20181210231655p:plain
サービスに関わる人達図その1

登場人物は、このくらいになりました。

f:id:uniq:20181210231837p:plain
サービスに関わる人達その2

ポイントとしては、

  • 「いらすとや」さんの素材などを使い、イメージしやすくすること。(user icon 風だと想像しにくい)
  • 「こんなふうに考えてる。」「これに困ってる」「これをしたい」というのを思いつくまま書く。
  • ユーザー(人間)にとどまらず、「学校」「会社」「社会」「国」…「地球」なども関係あれば書く。

まだ関係者の方に共有してないんですが、PMさんの反応としては「反応あると思うよ!」ということなので、良さそう!

つくったもの2:残念シナリオ

f:id:uniq:20181210232311p:plain
残念シナリオ

とにかく、3〜4コマぐらいで、ストーリーを表現したかったので、こんなものを作ってました。 オチは必ず「残念な結果」にすること。 おもいつくまま、時間かけずに(10分以下でサクッと)、たくさん作ります。 カスタマージャーニーマップを長々とまとめてると、ここをずらしたから、あっちもずらして…と大変面倒だったので、3コマで収めてみました。

じつはまだ、資料としてまとめてません…\(^o^)/なので反応はまだなのですが、個人的な感触はいい感じです!

つくってるもの2:要件ツリー

f:id:uniq:20181210233403p:plain
要件ツリー

BeProudでconnpassのプロジェクトに関わってたときに、これと似てる?同じ?ことをしたんですが、、、探してみたら、 hirokikyさんがまとめてる!

blog.hirokiky.org

匠メソッドは左から右なんですが、私は上から下にしてます。。そのほうがツリーっぽいっていう理由だけですが…! connpassでやってた方法は、個人的に大好きで、いろいろ応用(というか簡潔?)にしながら使わせてもらってます!

個人的なポイントとしては、上部はユーザーさん主体で、下部は私達作る側がやること・出すものな流れにして、、、それぞれを線で結ぶことで、何を優先したらよいか、何がトリガーでできないのかなどがわかる感じ。

しかし、実際は、まだ今のお仕事でここまでまとまっておらず〜。ちょいちょい作業しながらすすめていこうかと。。。

最後に

要件ツリー! クリスマスツリー!ということで、、、目標のお星様をかざせるように、今年もあとちょっとがんばるぞい。

おそまつさまでした。。。m( )m

↓ぜひぜひ他の記事も〜。

adventar.org

Illustratorの画面がすごくでかくなって老眼の私にAdobe Senseiが合わせてくれたのかと勘違いした

通常はこうのハズ…

f:id:uniq:20181121182322p:plain

…なのに…

f:id:uniq:20181121182518p:plain

どうしちゃったのー。老眼の私に合わせてくれたの!?!?Adobe Sensei おそろしす…

…と思ってたら、設定でもとに戻すことができた

f:id:uniq:20181121182928g:plain

なぜこのような設定になっちゃったのかは分かんないですが、私が何かのショートカットか、カーソルやらスクロールやらぐにょぐにょトラックパッド動かしてこのような設定になったのかも。

荷物を軽くしよう→読書が苦手を克服するためにグラフィックレコーディングに辿り着く

ラフ書きなどはmarumanのクロッキー帳が大好き! 仕事道具はMacBookProとクロッキー帳。

最近、そこにiPad Pro+apple pencilさんが仲間入りしました。 私がオフィスにいないときでも、オフィスにいるデザイナーのバイトの方に指示だすのに、手書きでサササーと書いて、バイトさんに送ること…がメインです。

便利なんですが、リュックが重い。 フルートのレッスン(最近はじめた)がある日なんかは、フルート本体と楽譜も持ってます。

そこで、、、marumanのクロッキー帳を持ち歩くのをやめました。
iPad Pro+apple pencil は毎日持ち歩くつもりで。 クロッキー帳がわりのアプリをいくつか試して、Noteshelf 2 が気に入りました。

Noteshelf 2

Noteshelf 2

  • Fluid Touch Pte. Ltd.
  • 仕事効率化
  • ¥1,200

お仕事面では、画面のラフ書き、ユーザーストーリー、ヒアリングした内容などなど。
プライベートでは、部屋の模様替えや、お庭のスケッチとかとか。

いろいろかきかきして気がついた。 グラフィックレコーディングだな。

そして、グラフィックレコーディングしたら、読書の内容が頭に入ってくるのでは? …と、積んである本を見ながら思いついたのでやってみました。

すごくいい感じかも。きたない絵だけど。

描いてて気がついたんですが、「研修転移」を「研修移転」と間違えて読んでましたよ。

研修開発入門 「研修転移」の理論と実践

研修開発入門 「研修転移」の理論と実践

お仕事に必要なので、「研修」や「学習」的なものを、ちょいちょい読んでおります。。

「文字しかない」という本を読むのがすごく苦手なんですよね。。。

1行、2行読み進めるうちに
「あれ?今までどんなことが書いてあったっけ?」
といった感じで、なかなか頭に入ってこないんですね…。

漫画だったらスラスラ楽しく読めるので、 脳内で漫画(っぽいもの)に変換すればいい話なんですね〜。

よかったよかった。。。

「Adobe XD meeting 14」で話してきたよ…!

f:id:uniq:20180323154818j:plain

「ほぼ毎月Adobe XD勉強会」で話してきました!すてきな機会をありがとうございます。m( )m

xd-study.connpass.com

スライドです。

sketchでもXDでもどっちでも出来そうですが、今回はXDで〜。 カスアマージャーニーマップは、作ったら作りっぱなしで更新しない、忘れられちゃう問題ありますよね。 そこらへんの運用の話もできればよかったかなあと思いつつ、、、。

かいしゃfacebookアカウントさんも記事をかいてくれました。ありがとうございます。m( )m

DIST.18「Sketch時代のWebデザインワークフロー」でグラフィックレコーディング

いまは12月ですが、2017/11/10(金)のイベントについての記事です。

DISTではスタッフやっているのですが、発表が見れそうでしたので、試しにグラフィックレコーディングしてみました。

続きを読む