アプリ模写100本ノック_Eight #54

今回はEight(iOSアプリ)です。
Eight(iOSアプリ)は、名刺管理や名刺交換ができるビジネス向け名刺アプリです。デバイスで撮影した名刺から、名前や連絡先、住所などの詳細情報を自動で登録できます。また、スマートフォン同士をかざすだけで名刺交換することも可能です。

自分は今まで名刺を持ったことがなかったため、サービスを知らなかったのですが、友人が利用しているところを見て今回アプリ模写してみようと考えました。

アプリ模写100本ノックとは

目的

1. そのアプリのコア体験について製作者の意図を考察し、気づきを通じてデザインパターンの引き出しを広げることが狙い。

2. 自分の知識として定着させる

なんでやるのか

デザインを作る上で瞬発力が必要
そのために以下のスキルが重要になる
・対象を観察する
・事象から法則性を見つけ出す
・即興で形にする

参考文献

Miwa Kuramitsuさんのこちらの記事です。頑張ります。

アプリ模写100本ノックやり方

上記の後にまとめとして「やってみて感じたこと・気づいたこと」を画面ごとに書き出しています。

アプリを触りながら、気になったことをメモ

• 名刺交換

  • 画面左上に「eight」, 右上にメッセージアイコンと通知アイコン

    • メッセージはeightで繋がっているユーザーとやり取りが可能
      →紙の名刺ではできないことをデジタルでカバーしてる印象

    • 画面左上にサービス名を配置する理由ってなんだろう。サービス名を想起しやすくするため？

  • コンテンツエリアに「Eightユーザーとタッチで名刺交換」セクションと「Eightを使っていない人にデジタル名刺を渡す」セクションの２つがある

    • タッチで名刺交換

      • 背景色が薄い青色で、中央軸に沿って通信ができることを伝えるアイコン、自分の名刺、説明文言
        → 名刺の配置やドロップシャドウがかかっていることからタップしたら何らかのリアクションがあるのかなと思い、何度かタップしてしまった

    • デジタル名刺を渡す

      • QRコードをタップすると、ハーフモーダルが下から画面一面に表示される。画面離脱はバツボタンのみ
        →なんでQRコード画面端たすワイプで閉じられないようなデザインにした？

      • URLをタップすると、ハーフモーダルで共有画面が表示される
        →なんで「URL」を「共有」にしなかった？

やってみて感じたこと・気づいたこと

名刺交換_カメラ_自分

　スマホをかざすだけで名刺の交換ができたり、管理している名刺が昇進・異動・転職などの変動にも対応しているため、日常的に名刺を使って連絡を取る方にとって便利なんだろうなと感じました。自分も友人と名刺交換を体験してみたのですが、紙での管理より便利だなという印象を受けました。

　名刺交換画面では、相手との名刺交換の際に使う画面が表示されています。名刺交換する際には何かタップをする必要はなく、画面を開いてかざすだけで完了します。また、相手がEightをインストールしていなくても名刺が共有できるような機能も揃っています。
いいなと思った点は、コア機能である名刺交換が簡単にできるようにするための施策です。本来の名刺交換は名刺を渡すのに、「①名刺入れを取り出す→②名刺入れから名刺を取り出す→③名刺を渡す」の３ステップ、eightの場合「①スマホを取り出す→②eightを開く→③名刺を渡す」の３ステップになると思います。自分の予想ですが、本来の紙で行うステップ数より多くするべきではないと考えたのかなと思いました。 いくらアプリが便利でも、名刺交換までのやり取りをするためにはスマホを取り出してアプリを立ち上げるという２ステップがあるということに今回気付けました。
気になった点は２点あります。１点目は、サービス名がが「Eight」なのか「eight」なのか分からなかったことです。画面左上にはeightとありますが、アプリ名ではEightと表示されており、何のためにサービス名の表記を変えているんだろう時になりました。
２点目は、画面中央に配置された名刺です。配置箇所やマージン、ドロップシャドウからタップできるものなんだなと認識し何度かタップをしたのですが反応がなく、何かエラーが起こってるのかな？と錯覚しました。クレジットカードのサービスや交通系ICのサービスを利用しているユーザーは多いと思うので、実物をデザインで表現した場合タップしたら反応があるものだと思っている人はいるだろうなと感じました。個人的には、タップしたら名刺を渡したユーザーから見える自分の紹介画面が表示されたら嬉しいなと思いました。

　カメラ画面では、紙の名刺をかざして写真を撮ることで、名刺に記載された情報を取得し、自分の名刺コレクション群に保存できる画面画面です。複数枚同時に読み込むことも可能なため、一枚ずつ写真を撮る必要もなくスムーズに保存することができます。
いいなと思った点は、名刺をかざした時のフォーカス機能です。「枠内に名刺を入れて撮影してください」といったサービスはよく見かけるのですが、自動で名刺を検出してフォーカスし、撮影できる状態に変化するという機能がすごいなと思いました。名刺を撮影する前の状態の際に「名刺を検出中…」という文言が画面に表示されていることで安心感にもつながっているなと思いました。

　自分画面では、名刺交換した相手に表示される自分の情報を登録することができます。所属に関する情報だけでなく、キャリアサマリや職歴、学歴、スキルタグ、自分の近況など紙の名刺では知ることができない情報を多く相手に伝えることができます。
アプリ模写をしている際に、使い方を変えたり、何種類かの項目が増えれば自分のキャリアに向き合えるサービスにもなり得る画面だなという印象を受けました。調べてみたところ、キャリアプロフィールアプリから名刺交換アプリに移行したという情報を得たので、そういうことかーとなったと同時に、この移行が強みになっているのかなと思いました。
気になった点は、仕事内容のテキストエリアのUIです。notionでいうコールアウトのような目立たせるための工夫をしているのですが、今のUIだとコメントやメモ欄のように感じました。相手にどのように表示されるかが感じられるUIの方が安心して入力できるのかなと思いました。

初めて名刺関連のサービスを触ってみて、すごく勉強になることが多かったため、他サービスも触ってみたいと感じました。以上です。