Cocoda!でアプリのサービスデザイン No.1 名刺作成・交換アプリ

2018年9月頭に、デザイナーを目指す人のためのUIデザイン学習サービスcocoda!が公式リリースされました。

日頃、もっとアウトプットの機会増やしたい、フィードバック欲しい、と思っていたので、とにかくやってみよう、とcocoda!のお題をやってみることにしました。

名刺が作れない大学生のための、「かんたん名刺作成・交換アプリ」

私が最終的に制作したのは、名刺が作れない大学生のための、「かんたん名刺作成・交換アプリ」です。(UIプロトタイプまで制作 日を分けて3h~くらい)

cocoda!に用意されていたのは、「モバイル名刺交換アプリを作って！」というお題と、以下の依頼詳細だけ。

大変です・・。僕は大学生で、関西の大学から、就活のために東京に出てきて、先輩に紹介してもらった人と会ったり、イベントに足繁く通っているのですが、その度に、名刺がなくて何となく申し訳ない感じになってしまいます。
あとは、もらった名刺に連絡をしようと思っていても、すぐにメッセージを送らないため、結局家に放置している間に無くしてしまったり。
たまに相手から連絡がきたりするのですが、聞き返すのも失礼で、どんな会話をしたのかも覚えておらず、簡単に思い出したいなと思っています。      名刺管理アプリのeightを使って見たいと思ってはいるのですが、自分の名刺を持っていないと使えないので結局使用出来ずにいます。ああ、次のイベントが90分後に迫ってる、、良い名刺管理アプリはないかな・・・。

ここから、依頼主が抱えている課題と解決には何を用意すべきか、45分で考えてみます。

私が上記から設定したのは以下の内容です。

ターゲット
名刺持ってない大学生、就活生 (一般職/営業/ 総合職 / ディレクタ)  名刺を自作するのは面倒、でも使いたい用途はある人のイメージ。

抱えている課題 
大学と企業がコラボする系のイベントを主催側。でも名刺がない。。。 折角の縁だから知ってほしい、次につなげたいけど、いきなりSNSは伝えづらい できるなら簡単に大勢の人に共有したい。

使用される場面
・大学生と企業が集まるイベントの場で
・1日インターンとか
・就活系イベント／年齢層の幅広い勉強会

ここからアプリのメイン機能と、どんな見た目/世界観でそれを利用してほしいのか、アプリの内容について考えます。

コア機能
・簡易名刺作成機能
　情報入力
　SNS登録
　テンプレート選択

・シェア機能
　URL/QRコード表示

アプリに持たせたい世界観
個性を売りにする/ちょっと意表を突く/付けるサービス
落ち着いてない/でも信頼感はある

ここから具体的な画面に落とし込んでいき、最終的に以下のような画面となりました。

コンセプトは、名刺が作れない、持ってない人でもすぐに名刺が作れる、自分を売り込めるアプリ。

予め情報入力、各SNSと連携しておけば、テンプレートを選択するだけで自動で名刺ができるアプリとしました。

公開までのステップを少なく。かつ作っておいたものはすぐに共有できるようにを大事にしています。

また、このアプリのゴールはアプリ利用者が第三者と繋がりを得られることまでがゴールです。お、なんだこいつ？と第三者が興味をもってもらうために、あえて信頼/誠実さを持たせるブルーを避けて、落ち着いた紫をキーカラーとして選びましたが、この制約が中々難しかったりもしました。

色ではないところで、引っ掛かりをもたせるほうが良かったのかもしれません。

課題と振り返り

制作時間 3h~強、3h通しでやっていたわけではないので、結局かかった日数自体は3日でした。

やってみた振り返りとしては2点。

・課題からゴールを見据えて、アウトプットを考えるのは一から自分で考えるより集中しやすく、捗った。( アイデアとアウトプットの評価は自己判断になるのでそこは積極的に外部の意見をひろっていきたい )

・ワイヤーまで落としてから、一人でデザイン詳細を詰めていくのに限界を感じた

二つ目はまだまだ自分の中のインプットが浅いのも理由かなと思っていますが、今回の場合に限っては名刺テンプレートのバリエーションなどが思いの外一人の頭では広がらず詰まってしまった、というのもありました。

制作途中の段階で、誰かに見せてみてアイデアをもらう、などしても良かったかもしれません。

「作り込む作業」が割いた時間の割に進まなかったので、もっと表現のバリエーションを増やす、ルールをインプットする、などしてから再度別のお題に挑戦してみたいなと思います。

次はDailyUIを作品例からインスパイアをもらいつつやってみるとかかな…。