web-dev-qa-db-ja.com

「モックアップツールキット」をエンジニアリングチームに提供する最良の方法は?

私は最近、テクノロジーや機能に重点を置いた会社でデザイン文化をシフトする責任を負いました。 (当社の「製品」は、顧客がデジタル証明書のライフサイクルを管理するために使用するWebポータルです)

現在、当社の「技術チーム」(ソフトウェアエンジニアおよび製品所有者)は、既存のUIのスクリーンショットを取り、図形を描画/メモを作成することにより、Excelで新しいタスクフローのモックアップを作成します。この慣行は最終製品に通知するものであり、それから離れたいと思います。

今後のオーバーホールでTwitter Bootstrap UI要素を採用する予定であり、モックアッププロセスをそれらの要素のみに制限したい(つまり、技術チームが新しいタスクのみを作成できるようにする)このグループのUI機能を使用したフロー)

私の漠然とした計画は、いくつかの一般的なレイアウトグリッドテンプレートと共にビットマップ画像(ベクトルとしても持っていますが)としてアセットを配信し、それらがすべて(一貫性のために)動作する必要がある1つのソフトウェアを推奨することです。

だから私の質問は:

  • このモックアップツールキットを最適に配信するにはどうすればよいですか?

  • 私は単に反Excelになっているのですか、それとも彼らが知っていることに固執させるべきですか?

  • この場合、PowerPointはより優れたツールとなるでしょうか(レイアウトに使用できるソフトウェアの例として、既にインストール済みで使用されているソフトウェアの例として)。

  • 努力を払って、ワークフローを変更し、タスクに固有のツールを使用するように努めることは価値がありますか?それは何でしょうか?

(私は彼らがすべて英語を母国語としないので、それは考慮事項であることを指摘しておきます)

7
dennislees

私は過去にExcelプロトタイプに出くわしたので、モックアップツールキットを提供する必要がある理由を理解しています。 Rahulは正解です。プロトタイプ/モックアップの目的を考え、使用するツールを決定する必要があります。

要素のセットを提供するという考えは、最初はモックアップを改善することができます。現在、エンジニアリングチームはExcelに夢中になっているからです。より長い視点では、特定のプロトタイピングプロセスとそれに対応するツールを決定することをお勧めしますが。

通常、モックアップはどのツールでも作成できます。重要なのは、人々がこのツールで快適に食事をすることです。そうでなければ、それは目の前のタスクに対する彼らの創造性を制限します。 Excelは本当に広く使われています。それが、人々がそれを使ってプロトタイピングを始める理由だと思います。シンプルなモックアップのための本当に簡単なツールが利用可能ですが。これらのツールは、ワイヤーフレームの外観ではなく、光沢のあるデザインをエクスポートしません。これは、機能と相互作用を定義し、どのボタンフィールドを決定し、必要なリストを作成するのに最適です。それについて合意したら、ビジュアルデザインから始めることができます。

4
Matt

モックアップは成果物ではなく、チームメンバー間のコミュニケーションを促進するためのドキュメントです。したがって、モックアップの問題ではなく、ドキュメントの問題としてこれに取り組むことをお勧めします。

製品の所有者は、使い慣れたツールの機能とフローについて引き続き説明したいと思うでしょう。これらのドキュメントはコミュニケーションを円滑にするために使用しているだけなので、Excelを使用してもかまいません。彼らが彼らの意図と期待を伝えるのを助ける彼らのために働くものは何でも。

ただし、エンジニアはHTMLとCSSを完全に使用できます。そのため、モックアップを設計プロセスの一部として見て、できるだけ早くHTMLに実装するように彼らを支援することをお勧めします。これにより、関係者と話し合うことができるドキュメント(HTMLプロトタイプ)が得られるため、コミュニケーションも向上します。特にタスクフローの場合、これは非常に重要です。 Excelスプレッドシートや物事の写真の領域に飽き飽きするのではなく、このフェーズにすばやく入る必要があります。

最後に、BootstrapでUI要素のみを使用するようにチームを制限しないでください。 Bootstrapは出発点であり、目的地ではありません。これはあなたの環境を支援することを目的としていますbootstrapあなたが何かを視覚的にスタイリングすることを心配する必要がないようにするためです。これは、ビジュアルデザイナーにアクセスできず、魅力的なものを望まないエンジニアリングチームに最適です。製品の制限を規定する標準化されたUI要素のセットを意図したものではありません。

代わりに、あなたの責任は、関連するUIコントロールのライブラリを決定し、それらの使用を推奨する方法を概説するドキュメントを作成することです。しかし、チームはこれらのガイドラインの外に自由に出て行ける必要があります。そうしないと、適合しない製品所有者の要望に対応するために、特定のコントロールを悪用するように彼らに強いるリスクがあります。

特定のツールを探しているなら、私がお勧めできるツールはいくつかありますが、最初はツールを探すべきではないと思います。チームの設計とコミュニケーションのプロセスを改善する必要があります。使用するツールは副次的です。

3
Rahul

Twitterブートストラップに基づいてプロトタイプまたはモックアップを構築するためのツールキットを探している場合は、PowerPoint用のKeynotopia UIコンポーネントを使用することをお勧めします。こちらから無料でダウンロードできます: http://keynotopia.com/bootstrap/

2
Gordon Kennedy