figmaこんにちは。仙台オフィスでデザインとマークアップ、Nuxtで少しTsを書いてるOです。今回はデザインツールのFigmaのデザイン管理について述べたいと思います。チームで共同作業をする場合は管理ルールを定めないと煩雑になりがちです。この数ヶ月間にFigmaを使用した中で考えたオススメの管理方法をご紹介します。基本的には以下で述べる構成にして案件やチームの環境で使い方をカスタマイズすれば良いでしょう。1000ページを超えるようなボリュームのあるWEBやアプリの場合は別の管理が必要かもしれませんのでご了承ください。1.機能単位でファイルを作成する[File]こうすることで以下のメリットが得られます。ファイル名で何を作成しているファイルかが一覧で理解できる。カラースタイル、親コンポーネントが集約されているので整頓しやすくなる。ファイルを複数開く場合、タブで開けるのでデザインの比較がしやすくなる。ファイルを検索しやすくなる。他人数で同じファイルを編集した際に発生するloadingを少なくできる。2.ページの使い方[Pages]ページは現状以下のような使い方をしています。機能の中の機能で分ける例えば会員登録の場合は無料、有料などの機能パターンがあるのでこのパターン毎にページを作成します。紐づいていることが理解しやすくなります。レスポンシブデザインの場合はページごとに各デバイスのデザインを作成すると良いでしょう。デバイスごとのデザインで分けるレスポンシブデザインを主軸に置いたページの分け方です。PC、SP、TABとページを分けることで各デバイスのデザインを比較確認しやすくなります。各デバイスのデザインがページに煩雑に並びにくくなるので、マークアップをする際にも便利です。ページ数が多くなると目当てのデザインを探すのが困難になりますし、動作が重くなるので出来うる限り最小限に抑えて管理しましょう。以上、今回は[File],[Pages]の管理についてご紹介しました。今後はフレーム、レイヤー名等の命名規則についても最適な管理を考えていこうと思います。株式会社ビデオマーケットでサーバサイ...2021-04-15Generambaを使ってiOSアプリ開発を効率化するこんにちは、仙台オフィスでiOSアプリの開発を担当しているはん...2021-02-02iOS/Androidアプリから複数のFirebaseプロジェクトを使用するこんにちは。Guidelin...仙台からこんにちは。7はてなブログをはじめよう!vm_creatorsさんは、はてなブログを使っています。ブログを報告する引用をストックしましたストック一覧を見る閉じる引用するにはまずログインしてくださいログイン閉じる引用をストックできませんでした。再度お試しください閉じる限定公開記事のため引用できません。