本日（4/22）の作業
本日はナビゲーションデザインをFramerで試しに作り、その流れでどうにも閉まらないのでロゴタイポのデザインも着手しました。
✅ ロゴタイポデザイン（第一稿）
✅ ナビゲーションデザイン
🚴 日報の画面設計・実装
🚴 設計
🚴 実装
サインインの実装
認証画面実装
認証ロジック実装（主にClient側）
Server側の認証チェック実装
Client側の認証チェック実装
ロゴタイポデザイン
とりあえずロゴマークは後でやるとしてタイポだけそれっぽくしてみた。もうちょいバランスの修正とか必要なのでその辺は適当な時にやる。ロゴマークは案はあるけど時間ないので後でやる。
ナビゲーション
日報画面デザインを進める中で、よくよくナビゲーションをあまりちゃんと設計していなかったのでまとめました。
このサービスは次のような構造を持つので、
プロダクト
サークル
開発者（プロダクトオーナー or 開発メンバー）
日報
内容
関連する話題・技術スタック
悩みごと・困りごと
任意の分報
明日以降のタスク
分報
内容
フォロワー
投資家・応援者
ナビゲーションはこんな感じか
プロダクト（切り替え）
─────────
日報
分報
サークル
メンバー ：人数
フォロワー：人数
─────────
ユーザアカウント（ユーザ自身）
要するにプロダクトに開発者が紐付き、開発者に日報と分報が紐づくという構造なので、ナビゲーションもSlackのようにワークスペースにメンバーとしてユーザが紐付きみたいなあれと近い感じ。
というわけで、コンテンツはないけどナビゲーションだけFramerで組んでみました。アイコンとかは適当に当ててるのでこの後ちゃんと整理します。
その他、メモなど
Framerをデザインに使う
Framerで雑に仮組してそれをベースにして画面実装も進めてます。細かいところまで作り込まないのは、自分がデザイナーでもあることと最終アウトプットはコードでデザインツールのデータは基本完全に追随することは不可能なためよほど開発における承認フローがレガシーなプロジェクトでない限りは全画面作るとかはしません。
あと、最悪実装と追随させるならコンポーネントをbitで共有できるようにしておけばできなくはないですが、結局ビジネスロジックとの結合とか絡み出すとなかなか難しいので大人しくコード書いた方が早いよと個人的には思います。
FramerのCode Component（React Componentが組み込める）がGitでバージョン管理できるようになったらもしかしたらもしかするんですけどねー。多分Webサイト向けの最適化の方にFramerは舵を切っているのでそういうのはできたとしてももっと先の話ではと。