整理整頓

思考を整理するためにアウトプットするブログ。

社員紹介アプリ 調査&ワイヤーフレーム作成

React デザイン

作業概要

会社のチームメンバーで開発力を高める取り組みとして、新入社員向けの社員紹介アプリを作ることになった。まずは仕様を決めるために既存サービスの調査とワイヤーフレーム案をFigmaで作った。慣れない作業だと見積もり狂うなぁ。

作業時間/見積：9h / 6h

f:id:h_310ma3:20200408100519p:plainf:id:h_310ma3:20200408100531p:plainf:id:h_310ma3:20200408100542p:plain

学び

メモ

  • 人を紹介するページの調査
  • 要件定義
    • メンバーを探しやすくする
      • 検索機能（ソート、フィルター）
        • チームフィルター
        • ソート
          • 名前
          • ニックネーム（複数あるので微妙）
          • slack名
      • 顔写真とslackアイコン
      • 名前とslack名
    • 魅力を引き出す
      • 自己紹介（まずはここ）
        • 写真
          • 顔がわかるメイン写真
          • OFFが見えるサブ写真
        • 一覧画面に載っている情報
        • 趣味や経歴など既存の情報
      • 他己紹介（追加機能なので後）
        • 投稿機能
      • ほかサービスとの連携（追加機能なので後）
        • Uniposの投稿
        • Slackの投稿
      • スマホからも見れるように
      • 英語版（言語選択のロジック次第で後回し）
    • GoogleSlidesと同じぐらい簡単に編集できる
      • 認証機能（社内用なら不要か？）
      • 更新フォーム
    • この内容でチームの承認を取ったのでこれで進める
  • ワイヤー作成
  • デザインの方向性決め
    • pinterest - 社員紹介
    • 写真のテイストをどう合わせるかについては開発力を高めるという趣旨からズレるのであんまり時間使いたくない
    • いったん分類して方向性を固めた f:id:h_310ma3:20200408100156p:plain
  • 未調査
    • GraphQL
    • プロトタイプベース言語
    • create-react-appがやってること
    • yarn test用いた開発フロー

学習計画