何万人ものユーザーが使用する製品設計テンプレートはどのように作成されていますか?

この記事の合計:約6000語、乾物が多すぎるため、収集してからゆっくり読むことをお勧めします〜

瞬く間に「インクナイフ製品素材デザインコンペ」から約1ヶ月が経ちました。優れた作品はすべて素材広場にアップロードされています。

それらがナイフの友人によって継続的に表示、使用、および収集されているのを見ると、著者と私たちにとって非常に名誉です。
ここに画像の説明を挿入

最初の6つはこのコンテストの作品です

「ベストプロダクトデザインアワード」(記事を表示するにはここをクリック)と「最も潜在的なプロダクトデザインアワード」(記事を表示するにはここをクリック)にインタビューしました。

受賞者の発言から、イメージソーシャルプロダクトは若く、カラーマッチングといくつかの小さなデザインによって進化する可能性があることがわかりました。バックエンドプロダクトはカードベースで階層的で感情的である必要があり、旅行用品は実際には複数のビジネスをカバーできます。

ここに画像の説明を挿入

ここに画像の説明を挿入

本日もナイフの仲間たちと製品デザイン関連の内容について話し合い、今回は「大人気製品デザイン賞」を受賞した3名を招待しました。

彼らは私たちと共有します:どの医療製品に焦点を当てるべきか、子供の教育製品と他の教育製品の違いは何か、そして上司が愛するネットワーク全体で最も完全なAIカスタマーサービスシステムを作成する方法。

ここに画像の説明を挿入

ネットワーク全体で最強のAIカスタマーサービスシステム上司の好きな男

著者について:ボスのお気に入りの男、Hu Xiaodiは直立した北欧人で、特別な趣味はありません。彼は通常、少しのワインを飲み、犬を連れて、典型的な老年である珠江を散歩します。

ここに画像の説明を挿入
ここをクリックしてプロトタイプを体験してください

参加は純粋に偶然であり、主に経験を共有するためです。過去の経験と合わせて、前後に1週間かかって、ほとんどのシナリオで合計173ページを含む完全なカスタマーサービスがバックステージに作成されましたが、これにはある程度の実用性があります。

ここに画像の説明を挿入
10モジュール、合計173ページ

長い間ビジネスをしていて、豊富な経験を持っているので、最初の関数からプロトタイプを設計し、関数の設計と検討を行いました。

業務に不慣れな方は、機能を見逃し、手直しの可能性も高いため、おやめいただくことをお勧めします。正直に、製品のアーキテクチャ、マインドマップ、ビジネスフローチャート、機能一覧を出して、理解したいところでプロトタイプの設計を始めるのが一番です。

ここに画像の説明を挿入

具体的なプロセスは次のとおり
です。1.メニューにメイン機能をリストし、それらをジャンプしてリンクします
。2.次に、最初のレベルのページを1つずつ完了します。3.
最初の機能から最後のレベルに戻り、展開します(ここではインターフェースを設計する際には、適切にリンクする必要があることに注意してください。すべてのページを完成させてからリンクすると、非常に時間がかかり、正しくリンクされず、精神的な混乱を招きます)。

ここに画像の説明を挿入

プロトタイプを作成する場合、論理的な考え方が最も重要だと思いますが、プロトタイプの本来の目的は、機能要件を迅速、効果的かつ直感的に表現することです。

ドキュメンテーションと比較して、高品質のプロトタイプ相互作用は、開発者と上司に、より迅速に理解させることができ、これは私にとって非常に役立ちます。

2013年までは、基本的に原稿に頼っていましたが、大変でした。ホワイトボードには、原稿と画鋲がいっぱいでした。インクナイフがオンラインになったので、インクナイフに夢中になりました。時間を節約でき、会社を本当に助けてくれました。効率の向上とコストの削減の効果は、それ以来、私は上司のお気に入りの男になりました。

ここで、ナイフの友達と、インクナイフを使うためのちょっとしたトリックを共有しましょう。これにより、速度と品質がある程度向上します。

実際、これも簡単です。つまり、ログインと登録、キングコングエリア、プロンプト、リスト、パーソナルセンター、設定などのモバイル端末に対応するバックグラウンド管理の一般的なフレームワークなどのモジュールに従って、よく使用されるページを分類するミドルオフィステンプレートを作成しました。中央のステーションテンプレートに統合されており、直接コピーして新しいプロジェクトに貼り付けることができるので、とても便利です。

児童教育商品・小学校パスの試作クリッククリック

著者について:何百万人ものファンを抱えるビッグVでも、業界のビッグプレーヤーでもありません。有名な学校からの祝福、ビッグネーム、ゴッドファーザーの体の保護、美しさを追求する普通の女の子はありません。To C、To B、To Gのフィールドでは、仏教が時々、常にパーティーAを愛しています(そうです、ここに間違いはありません)。

ここに画像の説明を挿入
ここをクリックしてプロトタイプを体験してください

このコンテストのエントリーは、人生、実際には人生に触発されています。

シンプルですが詳細は次のとおりです。

伝染病の影響で、私は家で仕事をしていました。ある日、家主がドアをノックして何か質問があると言いました。子供がリモートでクラスを受講したいと思ったことがわかりました。クラスシステムの操作方法がわからなかったので、助けが必要でした(実際、登録してログインし、コースを見るということです)コースをダウンロードするための簡単なプロセス)。

別の機会に、家主が再びドアをノックしました。それは、子供のクラスに関するものでした(実際、それは、子供が電話で英語の単語を読み上げ、WeChatグループに送信して先生にコメントしてもらうことの声でした)。

……

毎日、家主の助けを何度も求めた後、私は現在の教育製品の経験が家主の初心者のインターネットユーザーを満足させることができると同時に、小学生の学習問題と教師と生徒のやり取りを効果的に解決できることに気付きました。問題。

アプリストアの教育カテゴリで上位25のアプリをダウンロードし、ユーザーの評価を見て、垂直方向の比較を分析して、各アプリの主な機能と解決すべき主な要求を絞り込み、次に、子供向けの製品を水平方向に比較して、相互作用を絞り込みました。 、視覚要素の連続性。約3日間プレイした後、ついに電話が動かなくなった。最後に、この製品コンペティションの製品の方向性が決定されました。つまり、小学校の6〜12歳の子供向けの学習製品を作成し、4つの主要な機能を提供します。言語と数学の同時指導コース、高品質のコース、課外学習、およびオフライン活動です。目的は、祖国の花を上手に学び、楽しむことです。

製造サイクル全体で約30時間かかりました。詳細な製造プロセスは次のとおりです。

01ゴールを決める

(1)教育商品の現状の問題を考える

  • オフラインの数学コースの知識を思い出せず、学習を繰り返すことはできません
  • 学習に興味がなく、エクササイズが好きではない
  • オフラインの補足レッスンは時間とコストがかかります
  • 練習教材が混ざっていて、選び方がわからない
  • 他の教育用製品を使用するときに、どのように学ぶべきか、何を学ぶべきかわからない
  • 好奇心旺盛な子供たちは、課外の話をもっと読みたい、良い本のリストを持っていない、紙の本に飽き飽きしている、そして両親は蛍光スクリーンが目を傷つけるのではないかと心配している

(2)なぜこの製品を作るのですか?何を改善できますか?

  • 課外知識の学習を提供し、学生の知識システムを充実させる
  • オフラインのテーマ別活動を提供し、よく学ぶだけでなく、よく遊ぶことで、子供たちの幼年期の生活を豊かにする
  • 「デバッグとアップグレード」のメカニズムを提供し、学習への関心を高め、時間のかかる、労働集約的でコスト集約的なオフライン補足レッスンを補います
  • グレードに基づいてユーザーが必要とする可能性のあるコンテンツをインテリジェントに推奨
  • 音声検索により、読み書き能力に制限のある子供が欲しいものを見つけるのに役立ちます(コース、課外の読み物)

(3)最終的な結果は何ですか?

小学生に4つの主要な機能を提供します。同時指導コース、質の高いコース、課外学習、オフライン活動です。祖国の花はよく学ばなければならないだけでなく、花がうまく遊べるようにすることも必要です。

(4)ユーザー人口と心理学を定義する

正直に言うと、これらはすべてインターネットで見つかる既成の結論であり、時間をかけて詳細かつ詳細な調査を行っていませんでした。

(5)競合製品の水平および垂直比較分析

アプリストアで上位25の教育用アプリをダウンロードし、ユーザーの評価を読みました。垂直方向の比較と分析が行われ、各アプリの主な機能と対処された主な要求が洗練されました。次に、子供向け製品を水平に比較して、相互作用と視覚要素の接続性が洗練されました。 。

02情報フレームワーク

製品機能部門を整理し、レベルを整理します。
ここに画像の説明を挿入
機能プロセスの一部

03出力プロトタイプ

(1)紙のプロトタイプ

製品のメインプロセスインターフェイスの概要を説明し、機能と相互作用プロセスを決定します

(2)低忠実度プロトタイプ

a。最初に、紙のプロトタイプに基づいてプライマリインターフェイスの忠実度の低いプロトタイプを
出力します; b。残りのインターフェイスの忠実度の低いプロトタイプをすばやく出力します(約40);
c。製品ロジックプロセスを実行し、エッジシーンを改善し、スムーズな相互作用を保証しますクローズドループ(もちろん、時間は厳しく、一部のページはペイントされていませんが、私の心の中で形成されます);
d。製品のトーンに合うコピーライティング、感情的な要素、および分類された統合を収集します。

(3)高保真原型

a。製品スタイルの傾向、視覚的なトーンを決定し、設計目標とユーザーに応じてメインビジョンを出力します;
b。メインビジョンに従って基本的な視覚要素(コピーライティング、画像スタイル、レイアウト、アイコン、色、フォントレベル)を
定義します; c。ビジョンを定義しますルールとパフォーマンス(グリッドシステム、設計仕様);
d。グローバルコントロールを抽出して再利用を促進し、スケーラビリティと実用性を検討する;
e。出力5〜8のセカンダリインターフェイス、インクナイフを使用して実際のマシンで全体的なビジョンをプレビューする調性が均一であるかどうか、チェック、画面エラー、最適化、繰り返し最適化;
f。残りのインターフェースを出力し、さまざまな実際のマシンを使用してプレビューおよびチェックします;
g。ビジョンを改善し、エクスペリエンスを最適化し、ブランドの一貫性(ブランドの遺伝子、視覚的なスタイル)を確認します。

ここに画像の説明を挿入
ここをクリックしてプロトタイプを体験してください

プロトタイプツールの場合、ホイールを再作成せずに一般的なコンポーネントとコントロールを検索して再利用できることが重要です。次に、インターフェースの可視性により高効率とシンプルさを確保できます。また、プロトタイプをプレビューしたり、解凍html圧縮を行う必要はありません。パッケージ化してから拡張機能をインストールすると、非常に面倒なプロセスになります。

さらに、インクナイフに付属するすべてのショートカットキーを理解しておく必要があります。このパートの基本原則は次のとおりです。ソフトウェア使用の習熟度、および必要なシーンに適用するための適切なマテリアルを見つけることができるかどうか。

しかし、プロトタイピングの難しさの本質は、設計の詳細についての考え方の深さ、ビジネスロジックの理解、およびユーザーの問題点への洞察にあり、これらの部分が効率のボトルネックです。

インクナイフを使用するスキルは人それぞれですが、私も同じです。

この作業では、最初に主要なインターフェイス要素とコンポーネントを簡単に整理し、再利用可能なコンポーネントを抽出して、インクナイフですばやく再利用して時間を大幅に節約できるようにします。

同時に、マテリアルスクエア内の膨大な量のマテリアルは、怠惰になる機会にもなりますデザイナーの急速な専門性の向上の核心は、正しい方向に向けて、賢い方法で愚かな仕事をすることだと思います。Mo Daoはたまたま私が怠惰になる機会を作りました。

ここに画像の説明を挿入

胡清氏がコメントで述べたように、私はこのコンテストに参加できて光栄です。これは、プロの能力と思考能力の見直しであり、商品のより高い次元から製品を考えることができるためです。そのように:「商品価値と上陸の可能性を検討しましたか?」

これは、今後のキャリアで継続的に改善する必要があるポイントだと思います。デザインとは自信ではありません。ビジョンや相互作用がどれほど優れていても、商業的価値やユーザー価値をもたらすことはできません。また、自信の産物でもあります。**

良い商品とは何ですか?

ユーザーの問題点を効果的に解決できる優れたアイデア、優れたアイデア、またはスムーズでスムーズなやり取りで、快適で自然なエクスペリエンスを実現できます。また、優れたビジュアルエクスペリエンスにもなります。 、ユニークな視覚体験をトリガーします。

たとえば、鋼線のニーズを満足するDeyun Societyの仕事は、私の意見では良い仕事です。

ここに画像の説明を挿入
ここをクリックしてプロトタイプを体験してください

ここでは、私の個人的な付加価値のある学習体験をナイフの友達と共有したいと思います。

付加価値の仕方

自分に付加価値を付けたいのなら、自分を価値あるものにしなければなりません。自己成長に関して、あなたが取るすべての挑戦、あなたが学ぶすべての新しいことは、自己強化の方法です。仕事の面では、付加価値を付けたい場合は、専門家から学び、自分自身の反省と復習を行う必要があります。問題を本当に解決し、チーム内で自分の立場を見つけ、同時に自分の力を発揮することができます

学習方法

1.職場での方法論を改善する

調査の質問、洞察、発散のアイデア、方向の決定、アイデアの収束、計画の形成、計画の継続的な最適化の検証。

2.トレーニングデザインロジック

次のような小さなトピックを毎月調査します。ページのロードとプルダウンリフレッシュのロードの違いは何ですか?これを上司に報告することをシミュレートしてから、それを書き、伝え、2年間トレーニングします。設計ロジックを大幅に改善する必要があります。

3.読書

読書は非常に強力です。読書は私たちの多くの疑問に答えることができます。しかし、問題を発見して問題を解決するまでの過程で、私たちはまだそれらを自分で使う必要があります。知識を習得するだけでは、目的はありません。目的はそれを使うことです。

4.階下の老人と老婦人の話を聞くことも一種の学習です

最後に、将来の製品設計の傾向を大胆に予測します

1.新しいテクノロジーの出現により、新しいプレゼンテーション手法の出現が促進され、VRなどのウェアラブルデバイスがより普及するようになります。

2.情報の開発により、ユーザーの行動や好みの多様化がもたらされます。APPの寿命は3日を超えることはできません。この3日間ユーザーを維持するには、製品設計者がユーザーの心理と行動を深く理解する必要があります。

3.新たな遊び方を模索する必要があり、携帯電話以外のインタラクティブデバイスも存在する可能性があり、現時点では製品のデザインが新しいデバイス形態に適合している必要があります。

医療製品のモバイル高忠実度プロトタイプは何歳ですか

著者について:厄介なスキルを学んだプロダクトマネージャーおよびインタラクションデザイナー。

医療関連商品として4年以上の歴史があり、業界での注意点もあるので、応募しました。

医療製品の日常業務では、パーティーA(病院のリーダー、ビジネスユニットのリーダー)に直面する必要があることを知っておく必要があります。現時点では、忠実度の高いプロトタイプとデモンストレーション効果により、多くの場合、より良い仕事の認識と意見収集の効果が得られます。ワイヤーフレームそして、純粋な画像デザインのドラフトは、一般的に象徴的に見ただけです。

ですから、簡単な修正とデモンストレーションのために、普遍的な医療テンプレートのセットを作成したいと思います。

ここに画像の説明を挿入
ここをクリックしてプロトタイプを体験してください

白黒モードについては、アニメーションが好きで別のことをしたいのですが、本来の目的は「マジックモーション」アニメーションを使用して徐々に別の状態に変更することですが、最終的な効果はまだ少し固まっています。さもなければ、伝統的な医療のページがあまりにも普通に見えるかもしれません。

実際の製品機能ではなく、単にデモ用に設計された機能。同時に、白黒モードのみを使用する場合は、テンプレートから「状態1」または「状態2」を削除します。

ここに画像の説明を挿入

制作には約1週間半かかり、制作プロセスは以下のとおりです。

1)質問を確認する

ゲームのルールを読み、ゲームの目的を理解し、プロトタイプが達成したいことを確認する

キーワード:マテリアルライブラリ、テンプレート、再利用性、高忠実度

2)業界の位置づけ

実際、モバイルアプリケーションに統一された標準がある場合でも、アプリケーションのタイプごとに、ユーザーの年齢層とユーザーの必要な機能に大きな違いがあります。

キーワード:医療、高齢者、高齢者、安心して医療を求める

3)機能的脳マップ

業界のニーズに応じて、プロトタイプが基本的に必要とする厳密な機能を整理し、ページ構造を整理します。医療のことをよく理解しているので、よく使われる医療機能のほとんどを整理しており、実際の製品はテンプレートよりも横長です。プロトタイプは重要な部分を整理しており、テンプレートを使用する人がインターネット病院だけのように不要な水平機能ページ全体を削除するのにも便利です。
ここに画像の説明を挿入
キーワード:予約登録、専門家による製品発表、オンライン相談、インターネット病院(ホットスポットとして、流行により遠隔医療が促進されます)

4)プロトタイプの建物

実際、このステップでは、各ページのユーザーエクスペリエンスとマスターのみを考慮する必要があります。しかし、テンプレートの再利用性と実際の使用価値を考えると、ユーザーが特別なプロトタイプを作成する他のいくつかのことを想像しました。

キーワード1:再利用性

実際、ほとんどのプロトタイプのイメージ広告は、純粋な灰色のボックスまたは純粋な画像です。使いにくいと高精細になりません。グレーに変更しても高精細にはなりません。写真の場合、中のテキストが現在の商品と一致しない場合があるため、制作時に写真のコンテンツやアイコンをネイティブにし、いつでも変更できるようにしました。

キーワード2:白黒モードのデモ

業界の理由から、従来の医療ページは比較的伝統的ですが、高齢者にとって、ページフローの調整と学習のコストは非常に高くなります。したがって、特別な機能は、生産のための脳の穴の下でユーザーの純粋なデモンストレーションの白黒切り替えを選択しました。

プロトタイピングの最も重要なことは個人的に機能プロセスの設計であると私は思います。プロセスは基本的に各ページの機能を決定し、次に機能と統合された再利用可能なモジュールマスターの確立に関するユーザーエクスペリエンスを決定するからです。通常の作業では、経験が悪いためにプロセスが変更され、最終的にアーキテクチャと機能のすべてのやり直しが発生したことにも気づきました。実際、最初の機能プロセスが十分に考えられていなかったためでもあります。

シニアインクナイフのユーザーとして、共有するいくつかの良い習慣があります。

1)マスターを使用して、通常のリストやコレクションセンターのリストなど、各ページの機能を組み合わせて共通部分を抽出し、最初にマスターとして定義できるため、詳細を変更する必要がある場合は、マスターの変更は、効率を上げるためにワンクリックですべてのページに適用できます。

2)12ポイント以下のフォントの使用には注意してください。自分で見たり、デモしたりすると、血教訓がよくなります。そのため、アップロードしてコンテストに参加すると、多くの場所が変更され、審査員からも批判を受けました。実際、多くの作品には同じような問題があります。また、実際の作業に適用した場合は問題ないと思い、XX Hospitalの学部長がデモ版を見て、新しい行の結果を見つけることもできます。

このコンテストには良い作品がたくさんあると思います。自分の作品がこのセットで使用できるので、ピアについて話しましょう。結局、私の会社も非常によく似たセルフサービスマシンを作りました。

ここに画像の説明を挿入
ここをクリックしてプロトタイプを体験してください

オンライン登録からオフライン番号検索(ウィンドウ番号検索またはセルフサービスマシン検索)まで、病院の一連の手順全体で、登録からオフライン番号検索まで、セルフサービスマシンに依存して医療プロセス全体を完了する必要があります。

私のプラットフォームの統計:55歳以上のユーザーは30%以上を占め、セルフサービスマシンの使用率が高くなります。 。

**現時点では、セルフサービスキオスクはユーザーエクスペリエンスの明確なガイダンスにとって特に重要です。**このプロトタイプページでもプロセスが非常に明確になり、良いと思います。

実際、照合と協力の後、医療での使用に適した閉ループテンプレートの完全なセットを形成したいと考えています。これは、誰にとっても便利です。

ここに画像の説明を挿入

製品とインタラクションの付加価値語は、一般に、自分の実務経験、踏み込んだ落とし穴、成功した機能が蓄積され、同じ問題の効率と解決策が形成されます。

したがって、価値を高める方法は、製品の傾向に関する記事やディスカッションなどを読むことだけでなく、仕事の内容以外でより多くの経験を蓄積したり、コンテストに参加したり、一般的に使用されているものを変更して最適化したりするための練習も必要だと思います製品は見た目よりも作るのが難しいです。

製品の学習は実践を通して行われます。対話する場合、完成した製品仕様の学習と外国のWebサイトでの概念的な対話の設計を確認します。概念的な設計には実用的なアプリケーションの価値はなく、見栄えがよいだけですが、実際のシナリオを通して、インスピレーションの源として実際に使用できます。の組み合わせが新しいインタラクションに変わります。

おすすめ

転載: blog.csdn.net/Lemonliyi/article/details/106839249