【產(chǎn)品經(jīng)理修煉手冊(cè)】第五篇-Axure繪制原型

時(shí)間：2023-07-23 10:42:02 | 來源：網(wǎng)站運(yùn)營(yíng)

時(shí)間：2023-07-23 10:42:02 來源：網(wǎng)站運(yùn)營(yíng)

【產(chǎn)品經(jīng)理修煉手冊(cè)】第五篇-Axure繪制原型：

1.1 七大定律與產(chǎn)品設(shè)計(jì)

1.1.1 菲茨定律

菲茨定律所提出的人機(jī)界面設(shè)計(jì)法則，主頁定義了游標(biāo)移動(dòng)到目標(biāo)之間的距離，目標(biāo)的大小和所花費(fèi)的時(shí)間之間的關(guān)系；

產(chǎn)品設(shè)計(jì)的啟示：

一句話啟示：目標(biāo)要大，要近。

1.1.2 席克定律

一個(gè)人面臨的選擇（n）越多，所需要做出決定的時(shí)間（T）就越長(zhǎng)。在人機(jī)交互界面中選項(xiàng)越多，意味著用戶做出決定的時(shí)間越長(zhǎng)。

產(chǎn)品設(shè)計(jì)啟示：

一句話啟示：分類分布，選擇最小化。

1、分類選擇提高用戶效率；

2、限制選擇數(shù)量，減少用戶決策時(shí)間；

3、分步解決，提示用戶操作體驗(yàn)。

4、隱藏/刪減很少使用的選項(xiàng)，降低錯(cuò)誤點(diǎn)擊率。

1.1.3 奧卡姆剃刀原理

如有兩個(gè)功能相等的設(shè)計(jì)，那么選擇最簡(jiǎn)單的。

產(chǎn)品設(shè)計(jì)啟示：

一句話啟示：“l(fā)ess is more”

1、只放必要的東西；

2、減少不必要的段落；

3、減少多余彈框設(shè)計(jì)；

4、小白規(guī)則；

1.1.4 泰思勒定律

該定律認(rèn)為每一個(gè)過程都有其固有的復(fù)雜性，存在一個(gè)臨界點(diǎn)，超過了這個(gè)點(diǎn)過程就不能再簡(jiǎn)化了，你只能將固有的復(fù)雜性從一個(gè)地方移動(dòng)到另外一個(gè)地方。

產(chǎn)品設(shè)計(jì)啟示：

一句話啟示：把簡(jiǎn)單留給客戶，把復(fù)雜留給自己。

1、復(fù)雜總是存在的，唯一需要確定的是讓用戶復(fù)雜還是系統(tǒng)復(fù)雜；

2、從體驗(yàn)感的角度，應(yīng)該讓系統(tǒng)復(fù)雜，但是需要考慮技術(shù)層面能否實(shí)現(xiàn)系統(tǒng)復(fù)雜；

1.1.5 神奇數(shù)字7+-2法則

人類大腦最好的狀態(tài)能記憶含有7（+-2）項(xiàng)信息塊，在記憶5-9項(xiàng)信息后，人的大腦開始出錯(cuò)。

產(chǎn)品設(shè)計(jì)啟示：

1、 用戶的記憶上限是9項(xiàng)，超過這個(gè)就不容易記住；

2、 結(jié)合席克定律，如果要讓用戶快速記住選項(xiàng)，那么選項(xiàng)盡量不要太多，最好別超過5個(gè)；

1.1.6 接近法則

當(dāng)對(duì)象離的太近的時(shí)候，意識(shí)會(huì)覺得它們是相關(guān)的；

產(chǎn)品設(shè)計(jì)啟示：

一句話啟示：物以類聚，人以群分

1、形似的信息和功能，互相更為靠近；

2、接近法則也就是所謂的分類原則，包括信息分類和功能分類；

1.1.7 防錯(cuò)原則

通過設(shè)計(jì)來將過失降低到最小化，該原則及時(shí)地告訴用戶哪里操作錯(cuò)了。比如在填寫表單時(shí)候，系統(tǒng)給出及時(shí)地報(bào)錯(cuò)提示；重要、謹(jǐn)慎的操作，系統(tǒng)通常會(huì)有二次確認(rèn)；為用戶提供撤銷的機(jī)會(huì)，為用戶提供糾錯(cuò)的機(jī)會(huì)。

產(chǎn)品設(shè)計(jì)啟示：

一句話啟示：及時(shí)報(bào)錯(cuò)機(jī)制

1、在關(guān)鍵操作上，給用戶提供容錯(cuò)的空間，提供緩沖空間；

2、犯錯(cuò)設(shè)計(jì)要考慮到用戶體感感，不要為了緩沖而緩沖；

1.2 移動(dòng)端產(chǎn)品設(shè)計(jì)規(guī)范

目前市面上主要有兩大移動(dòng)操作系統(tǒng)：

1.2.1 扁平式導(dǎo)航

1）APP底部常用的導(dǎo)航模式，包括無導(dǎo)航、2個(gè)、3個(gè)、4個(gè)和5個(gè)導(dǎo)航；

2）APP底部導(dǎo)航數(shù)量可以增加，但是盡量不要減少。所以，對(duì)于0-1的產(chǎn)品，除非功能特別多，否則不要一上來就5個(gè)模塊，最好從4個(gè)開始；

1.2.2 分層式導(dǎo)航

1）用于用戶不經(jīng)常使用但是目的性很明確的模塊或者頁面，比如設(shè)置頁；

2）頁面特點(diǎn)：簡(jiǎn)潔，分類清晰；

1.2.3 舵式導(dǎo)航

在扁平式導(dǎo)航的基礎(chǔ)上增加一個(gè)更扁平的入口，方便用戶在不用模塊之間跳轉(zhuǎn)時(shí)，隨時(shí)可以進(jìn)入這個(gè)舵式模塊，并完成使用流程后還可以回到剛才的位置。

1） 用一個(gè)多功能鍵，把同等級(jí)的操作收納到一起；

2） 適用于社區(qū)發(fā)布類的產(chǎn)品；

3） 導(dǎo)航入口在底部，也可以在右上角；

1.2.4 抽屜式導(dǎo)航

一般采用將導(dǎo)航主體隱藏在APP側(cè)邊的方式，以一個(gè)按鈕來呼出導(dǎo)航，在使用完成之后再使用相同的按鈕隱藏起來。

1.2.5 沉浸式導(dǎo)航

又叫“內(nèi)容驅(qū)動(dòng)式”導(dǎo)航，或者“體驗(yàn)驅(qū)動(dòng)式導(dǎo)航”，是沉浸式設(shè)計(jì)的一種表現(xiàn)在內(nèi)容中自由地轉(zhuǎn)換，或是內(nèi)容本身定義導(dǎo)航。游戲、閱讀以及其他沉浸式APP一般都采用這種導(dǎo)航結(jié)構(gòu)

確定好導(dǎo)航架構(gòu)，相當(dāng)于就是確定了產(chǎn)品的骨架，接下來應(yīng)該在產(chǎn)品中添加界面元素。

1.2.6 欄

主要包括：狀態(tài)欄、導(dǎo)航欄、分段欄、標(biāo)簽欄

1.2.7 內(nèi)容視圖

主要包括：列表視圖、卡片視圖、集合視圖、圖片視圖、文本視圖

在列表中，信息的傳遞方式?jīng)Q定文字和圖片的權(quán)重，如果信息依賴于文字傳遞，則文字權(quán)重更高，如果信息依賴于圖片傳遞，則圖片的權(quán)重更高。

1.2.8 控制元素

主要包括：按鈕、輸入框、分割符、線條、彈框、toast

在頁面起到某種作用的，都可以叫做控制元素，比如一個(gè)可點(diǎn)擊的按鈕，一條用于區(qū)分界限的線條等。

1.2.9 臨時(shí)視圖

定義：讓用戶只有在完成當(dāng)前的任務(wù)或者關(guān)閉一個(gè)信息或者頁面之后，才能去做其它的事情，降低了交互層級(jí)。

臨時(shí)視圖特征：當(dāng)屏幕上出現(xiàn)臨時(shí)視圖時(shí)，用戶必須通過點(diǎn)擊按鈕或者其它特殊方式才能退出；

臨時(shí)視圖的種類：模態(tài)視圖、警告視圖、操作列表、吐司（Toast）；

模態(tài)視圖

警告視圖

操作列表

Toast 吐司

關(guān)于彈框和toast的區(qū)別：

1、 彈框需要用戶做操作才能消失，toast會(huì)自動(dòng)消失；

2、 當(dāng)需要用戶對(duì)信息做抉擇時(shí)，用彈框提示，當(dāng)僅僅是告知用戶某個(gè)信息，用toast;

3、 Toast可以稱為吐司、跨文案。

臨時(shí)視圖的使用規(guī)則：

使用臨時(shí)視圖時(shí)的注意事項(xiàng)：

數(shù)據(jù)鍵入的臨時(shí)視圖：

1.3 小程序設(shè)計(jì)規(guī)范

1.3.1 定義

一種不需要下載安裝，即可以使用的應(yīng)用；主要分為：Andriod、ios、H5 三種類型。

1.3.2 特點(diǎn)

1、開發(fā)成本低；

2、流暢的使用體驗(yàn)；

3、龐大的流量池可供使用；

4、用完即走，不占用手機(jī)內(nèi)存，但是有使用記錄供用戶柯方便的再次找回產(chǎn)品。

1.3.3 接入微信小程序流程

包括：注冊(cè)、小程序信息完善、開發(fā)小程序、提交審核和發(fā)布；

1.3.4 設(shè)計(jì)規(guī)范

包括：重點(diǎn)突出、流程明確、小程序菜單、頁面內(nèi)導(dǎo)航、導(dǎo)航顏色定義規(guī)范、頂部標(biāo)簽欄、頁面加載、結(jié)果反饋

（1）重點(diǎn)突出

（2）流程明確

（3）小程序菜單

（4）頁面內(nèi)導(dǎo)航

（5）導(dǎo)航顏色定義規(guī)則

（6）頂部標(biāo)簽欄

（7）頁面加載

（8）結(jié)果反饋

1.3.5 特殊功能

包括：客服消息、掃碼功能、模板消息；

客服消息

掃碼功能

特殊功能

參考視頻：B站黑馬程序員《產(chǎn)品經(jīng)理基礎(chǔ)入門》，感興趣者，可前往學(xué)習(xí)！https://www.bilibili.com/video/BV13z4y1m7UQ/?vd_source=b4d9c097dca348fa06f85a578660ca02