1
/
5

【TechBlog】Design Document Tool 3選 & 検討の流れ

こんにちは!
コーポレート・マーケティング室、デザインチームの「チェン ・ルイ」と申します。
普段は社内製品のアプリケーションのUIデザイン業務を行なっています。

現在、アプトポッド製品UIのデザインシステム運用の一環として、デザインガイドラインを明文化するツール、「Design Document Tool」を検討しています。

今回は検証した3つのツールを紹介します。

  • Zeroheight
  • InVision DSM
  • Confluence

着眼点はデザインガイドラインの管理の課題から「Design Document Tool」にたどり着くまでに、上記の3つのツールをを使用した感想です。
(具体的な操作方法を割愛します。)

「Design Document Tool」選定の参考になれば幸いです。

目次

  1. 【背景・問題】
  2. 【デザインガイドラインをSketchでまとめてみた】
    1. Sketchの制約
  3. 【Design Document Toolを導入したい】
    1. Design Document Toolの選択基準
  4. 【ツール検証1:Zeroheight】
    1. 特徴1:デザインデータをアップロードしてそのままドキュメント化
    2. 特徴2:操作が直感的
    3. 特徴3:内容自体に集中できる環境
    4. 特等4:気軽にルールを記入できる
    5. 特徴5:プロトタイプツールと連携できる
    6. 特徴6:挿入できるファイル形式が豊富
    7. 特徴7:Lottie Animationも入れられる
    8. 特徴8:見出し、本文などの余白が適切、読みやすいデザイン
  5. 【ツール検証2:InVision DSM】
    1. 特徴1:デザインデータをアップロードしてそのままドキュメント化
    2. 特徴2:アセットの階層管理できる
    3. 特徴3:無料版でも無制限でデザインガイドを作成できる
    4. 特徴4:InVisionのデザインファイルと一括管理
  6. 【InVision DSMとZeroheightの比較】
    1. 共通点
    2. 相違点
    3. 所感
  7. 【ツール検証3:Confluence】
    1. 特徴1:文書の構造化しやすい、すらすら書ける
    2. 特徴2:Zeplinのリンクを埋め込み可能
    3. 所感
  8. 最後に:ツールは新しい可能性をもたらす
  9. 参考記事

続きは、弊社のテックブログからご覧ください!


--

株式会社アプトポッド's job postings

Weekly ranking

Show other rankings
If this story triggered your interest, go ahead and visit them to learn more