インタラクティブなプロトタイプ。 既存のユーザーインターフェイスモデル、パート2。プロセスアプローチ

素材の最初の部分では、インタラクティブなプロトタイプを作成する目標の概要を説明しました 。 次に、当社での作業のプロセスについて説明します。 インタラクティブプロトタイプの作業は、ページレイアウト(ワイヤフレーム)が設計され、視覚的なデザインが描かれた後に始まります。 このプロセスは平均して数週間続き、その後独立した水泳を始めます。 インターフェースモデルは、顧客、ユーザー、開発者によって検討され、コメントされます。





プロトタイピングアプローチ



インタラクティブプロトタイプ自体は、HTMLで相互接続されたシステムのキーページのレイアウトです。 2つのアプローチがあります。



ページレイアウトに基づく白黒プロトタイプ



モノクロプロトタイプサイトUI Modeling Company 特にAxure RP ProやMS Visio Intuitectプラグインなどのラピッドプロトタイピングツールを使用する場合は、迅速かつ安価に実行できます。 ビジュアルデザインが描画されるのを待たずに、デザインの初期段階で既に入手できるのがさらにクールです。 そして、それはユーザビリティテストを開始することも意味します。



しかし、第一に、多くの経験は、原材料(同じワイヤフレーム)を訓練されていないクライアントに見せることは危険であることを知っています。 これはシステム設計ではなく、今後も異なるものであると彼に納得させるために多くの時間を費やすことができます。 第二に、相対的な値やアウトラインではなく、非常に特定のピクセルになると、インターフェイスの認識が劇的に変化する可能性があります。 そして第三に、設計時には、1つの「レイヤー」の作業のみを処理する方が適切です。 異なる性質のタスク間の絶え間ない切り替えが始まるとすぐに-ダイアグラムとダイアグラムを熟考し、クリックとマウスのホバリングを計算すると、生産性、品質、学習の深さが減少します。



予算が非常に少なく、最も単純なモデルにのみ十分なお金がある場合、そのような場合に行う価値があります。 またはその逆、両方のプロトタイプに十分なお金と時間がある場合-初期の黒と白の両方、および通常の色。 初期モデルの適用には別の優れた事例がありますが。 最近、Axureプロトタイプ製品を持ってきたクライアントが私たちのところに来ました。 将来のサービスのすべての重要なページが含まれており、設計と開発の条件とコストをすぐに評価するのがはるかに簡単でした。 どのような場合でも「クリーンな」設計段階が必要でしたが、プロジェクト前の分析は大幅に簡素化されました-最初のプロトタイプはすでに多くの答えを出しました。



顧客が受け入れた視覚システム設計に基づいたカラープロトタイプ



インタラクティブUIモデリング会社のウェブサイトのプロトタイプの設計 最終結果に可能な限り似たインターフェースモデルを手元に持つことで、顧客、ユーザー、開発者とのコミュニケーションがはるかに容易になります。 ここでは、資料の最初の部分で説明されている視聴向けのボーナスが機能し始めています。 顧客は、プロトタイプを投資家や経営陣、パートナー、広告主に見せることで、はるかに大きな成功を収めることができます。 ページレイアウト(ワイヤフレーム)の場合のように、各段階で長い間説明する必要はありません。これは必ずしも生産的ではなく、これが設計ではないことを説明するためです。 使いやすさのテストも予約数を減らして行われ、その効果は現実に近いものになっています。 開発者とコミュニケーションをとることは、常に役立ちます。



確かに、カラープロトタイプの作成にはかなりの費用と時間がかかります。 この段階では、クロスブラウザの問題に対処しないようにします。通常、IE7と、場合によってはFirefoxを使用します。 まず、時間がかかります。 第二に、プロトタイプで進行中の実験があり、それらを迅速に行う必要があるため、コードの精度とロジックを維持する時間がありません。 したがって、いずれの場合でも、ゼロから再配置する必要があります。 実践では、開発中のhemoと虫の雲はやり直しを節約する価値がないことを示しています。 そのため、ここではレイアウトデザイナーにとって多くの作業があります。



HTMLレイアウトを含む、Web開発の多くの面を訪れました。 テンプレートは、通常のサイトのプロトタイプと類似した形で配置および結合されます。 しかし、これらは非常にシンプルで理解しやすいものであり、インターフェースを試すタスクはそこにありません-むしろ、開発サポートを提供するだけです。




場合によっては、プロトタイプのユーザビリティテストに煩わされるのではなく、システムのベータ版をすばやく起動する方が有利な場合があります。 そして、すでにフィードバックを受け取っているので、すぐに調整を行います。これは、webdanolevoyの恒常的なベータ版の場合のみです。 たとえば、EPAM PMCの新しいバージョンの開発の場合は、まさにそれを行いました。 ただし、このアプローチは、強力な競合他社との流通(販売数やトラフィック量)製品よりも、保証された忠実なオーディエンスを持つプロジェクトに適しています。



プロトタイプの構成



完全に完成したプロトタイプに多額の予算を費やし、準備するものはほとんどありません。これは非常に長期的なプロジェクトにのみ意味があります。 そのため、インターフェイスモデルに入るページとインタラクションの最適なセットを選択することが重要です。 重点的に取り組むべきものは次のとおりです。



主な機能



プロトタイプでは、少なくともシステムの基本的な機能を示して確認する価値があります。 たとえば、求人検索サイトの場合、履歴書と求人の管理、適切な求人と候補者の検索、求人と求人、新しい求人と履歴書に関する情報の迅速な受信が行われます。 そのため、少なくとも雇用主と申請者のプロフィールのページ、空席を追加して履歴書を編集するためのフォーム、オファーのリストとそれらのページ、応答と求人のアーカイブ、通知を設定するためのページが必要です。



システムのユーザーシナリオ



これを行うには、システムのすべての重要な機能を組み合わせて、実際に動作するシナリオにする価値があります。 サービス機能を初期構成に追加する必要があります。 たとえば、同じ求人検索サイトの場合、求人情報ページからサイトに応答を送信できる必要があります。 そして、送信後、ユーザーにはすべてがうまくいったというメッセージが表示されます。 そして、彼はすでにこの雇用主の別の欠員に応答を送った可能性があります。 そのため、成功メッセージを含むジョブ情報ページのバージョンを作成する必要があります。 または、たとえば、このメッセージが表示された非表示のブロックを表示する必要があるCookieにデータを送信します。



より複雑なシナリオが示されている場合はさらに良いです。 たとえば、ユーザーがサイトに登録するための招待状を受け取りました。 登録フォームに記入した後、彼は履歴書に記入するように頼まれました。 そして履歴書に記入した後、いくつかの基準に従って適切な空席を見つけます。 プロトタイプに必要なページのリストに、招待状の入力、登録、承認、履歴書に基づく求人検索が追加されます。 まあ、応募者に加えて、雇用者もいることを忘れないでください-彼は空席の配置サービスのために支払う必要があるかもしれません。



顧客は、将来のパートナーまたは投資家に将来の製品の追加機能を示す必要があるかもしれません。 たとえば、MS Excelファイルまたはイントラネットシステムからジョブリストをインポートします。 そのため、必要なページのリストが再び展開されます。



これで、何を、どのような形式で、どのボリュームで行う必要があるかが明確になりました。 構築ツールに取り組む時が来ました。



インタラクティブプロトタイプの分類に関する資料の最初の部分と、 作成プロセスの特徴を含む3番目の 部分をお読みください。



オリジナル: インタラクティブプロトタイプ。 既存のユーザーインターフェイスモデル、パート2。プロセスアプローチ




All Articles