最新欧美精品一区二区三区,在线天堂中文最新版,亚洲一,二,三区在线观看,制服丝袜另类专区制服,亚洲熟妇少妇任你躁在线观看无码

Moqups:低保真與高保真線框:您應(yīng)該使用哪個(gè)?

Moqups文章圖片

要為您的團(tuán)隊(duì)建立有效的工作流程,了解低保真線框和高保真原型之間的區(qū)別非常重要。

如果您已經(jīng)在使用線框,或者只是為團(tuán)隊(duì)的線框和原型制作需求尋找合適的解決方案,那么您可能已經(jīng)遇到過(guò)“低保真”和“高保真”這兩個(gè)術(shù)語(yǔ)。

lo-fi 和 hi-fi 的一般含義并不難直觀。但是,如果您是創(chuàng)始人、設(shè)計(jì)師、開(kāi)發(fā)人員、業(yè)務(wù)分析師、產(chǎn)品經(jīng)理,或跨職能團(tuán)隊(duì)的任何成員,深入挖掘可能會(huì)很有用。

在 UX 設(shè)計(jì)的特定背景下了解保真度可以幫助您建立更好的產(chǎn)品和更高效的團(tuán)隊(duì)。那么,讓我們來(lái)看看線框圖在開(kāi)發(fā)中的重要性,解釋低保真和高保真線框圖的區(qū)別,并討論如何將它們兩者發(fā)揮到最大效果。


什么是線框圖

“線框”一詞早于其在數(shù)字設(shè)計(jì)中的當(dāng)前使用。Web 和應(yīng)用程序設(shè)計(jì)師從 CAD(計(jì)算機(jī)輔助設(shè)計(jì))和 CGI?? 動(dòng)畫領(lǐng)域借用了這個(gè)術(shù)語(yǔ)。反過(guò)來(lái),他們從早期的汽車建模、定格動(dòng)畫和雕塑領(lǐng)域借用了它。 

事實(shí)上,大多數(shù)人在小學(xué)時(shí)就第一次接觸到線框圖,并使用鐵絲網(wǎng)為他們的紙制木偶、面具和恐龍搭建框架!

在每種情況下,線框都有相同的用途:在添加最終元素(如表面、皮膚、顏色、紋理、照明等)之前,充當(dāng)最終產(chǎn)品的粗略近似。 

將線框視為最終設(shè)計(jì)的藍(lán)圖。在設(shè)計(jì)過(guò)程的早期嘗試這種骨架是有意義的,在大量時(shí)間和金錢投入到拋光產(chǎn)品或最終編碼開(kāi)始之前。

為了了解網(wǎng)頁(yè)設(shè)計(jì)中的線框圖是什么樣子,這里有一個(gè)購(gòu)物車的線框圖,取自我們的電子商務(wù)網(wǎng)站模板包。您可以看到頁(yè)面的大部分重要元素已經(jīng)到位。但是,線框使用通用占位符,而不是全彩、品牌圖形和描述性內(nèi)容:

Moqups文章圖片

UI設(shè)計(jì)中的保真度是什么意思?

就像“線框圖”的概念是從預(yù)先存在的設(shè)計(jì)實(shí)踐中得出的一樣,“保真度”這個(gè)詞也是從錄音世界中借來(lái)的。在唱片和收音機(jī)的早期,低保真和高保真指的是音樂(lè)錄制和播放的質(zhì)量。

同樣,在移動(dòng)應(yīng)用程序和網(wǎng)頁(yè)設(shè)計(jì)中,保真度是指線框、模型或原型中的詳細(xì)程度。我們經(jīng)常談?wù)摰捅U婧透弑U妫孟袼鼈兪遣煌念悇e,但它們真正代表的是產(chǎn)品設(shè)計(jì)演變的起點(diǎn)和終點(diǎn)。

將保真度視為一系列細(xì)節(jié)和交互性。

Moqups文章圖片

在該范圍的開(kāi)始,您會(huì)發(fā)現(xiàn)模擬紙質(zhì)草圖以及低保真數(shù)字線框。兩者都使用臨時(shí)占位符來(lái)表示網(wǎng)頁(yè)或設(shè)備屏幕的基本設(shè)計(jì)元素。在勾勒出一個(gè)想法的第一次迭代時(shí),兩者都很有用。

然后,隨著每一次新的改進(jìn),產(chǎn)品的表現(xiàn)形式自然地從線框演變?yōu)槟P驮俚皆汀獜牡捅U娑认蚋弑U娑绒D(zhuǎn)變。占位符首先被草稿版本取代,然后最終被產(chǎn)品副本、內(nèi)容、圖形和品牌的最終再現(xiàn)所取代。

在頻譜的末端是一個(gè)高保真、完全交互、可點(diǎn)擊的原型,它與真實(shí)產(chǎn)品幾乎沒(méi)有區(qū)別——并??且非常適合用戶測(cè)試。

雖然,正如我們將看到的,用于描述線框圖的術(shù)語(yǔ)都可以非常靈活,但這會(huì)讓您大致了解保真度的范圍:

  • 線框:低保真,單色,帶有占位符圖像和文本。
  • 樣機(jī):具有真實(shí)圖像、顏色和副本的中高保真度。
  • 原型:添加了高保真品牌、圖像、復(fù)制和交互性。

盡管這是典型的過(guò)程,但團(tuán)隊(duì)通常從任何地方開(kāi)始,并在低保真和高保真之間來(lái)回切換。因此,讓我們來(lái)看看低保真和高保真線框,并討論它們的優(yōu)缺點(diǎn)。


什么是低保真線框?

低保真線框充當(dāng)網(wǎng)頁(yè)和應(yīng)用程序屏幕的初始藍(lán)圖——最終產(chǎn)品的粗略近似。它們?cè)诋a(chǎn)品開(kāi)發(fā)的早期階段特別有用,因?yàn)樗鼈儗⒅攸c(diǎn)放在純粹的功能上,而不是美學(xué)上。

因此,它們以單色調(diào)色板呈現(xiàn)——故意排除特定細(xì)節(jié),如顏色、字體、徽標(biāo)和精確尺寸。相反,低保真線框使用圖像占位符和基本形狀來(lái)指示最終將填充頁(yè)面的元素。通用的“l(fā)orem ipsum”文本或“編輯”字體代表未來(lái)的內(nèi)容和副本。
這是我們的低保真線框模板之一,可讓您了解這一切在實(shí)踐中的樣子:

Moqups文章圖片

低保真線框的優(yōu)勢(shì)

低保真線框是用戶流程圖和高保真原型之間的重要墊腳石。正是由于缺乏細(xì)節(jié),它們才如此有價(jià)值——并賦予它們一系列優(yōu)勢(shì):

捕捉想法因?yàn)榈捅U婢€框可以快速創(chuàng)建,您可以在有價(jià)值的想法消失之前從腦海中獲得靈感。只需單擊幾下,就可以將一個(gè)抽象的想法從概念轉(zhuǎn)變?yōu)閯?chuàng)造,為您和您的團(tuán)隊(duì)保持動(dòng)力。

基礎(chǔ)工作:低保真線框缺乏細(xì)節(jié)可以幫助您的團(tuán)隊(duì)專注于產(chǎn)品的基本功能及其用戶體驗(yàn)。設(shè)計(jì)師可以在游戲的早期與利益相關(guān)者檢查他們的假設(shè),并就屏幕上需要和不需要的內(nèi)容、最佳密度和間距以及他們想要收集和交流的信息達(dá)成快速共識(shí)。 

無(wú)痛迭代:在任何特定外觀投入太多時(shí)間和精力之前進(jìn)行試驗(yàn)總是更好。低保真線框最好的一點(diǎn)是它們很容易改變——甚至丟棄。由于它們很容易創(chuàng)建,跨職能團(tuán)隊(duì)中的任何人都可以模擬他們自己的變體,或者提出一種新方法。傾聽(tīng)所有聲音——尤其是在設(shè)計(jì)和開(kāi)發(fā)的早期階段——是建立共識(shí)和優(yōu)化用戶體驗(yàn)的最佳方式之一。 

簡(jiǎn)化的工作流程:沒(méi)有什么比浪費(fèi)精力和不必要的回溯更能破壞動(dòng)力了。低保真線框可讓您的團(tuán)隊(duì)在致力于像素完美的數(shù)字原型之前解決有關(guān)內(nèi)容、布局和產(chǎn)品要求的基本問(wèn)題。通過(guò)建立在可靠決策的基礎(chǔ)上,團(tuán)隊(duì)成員可以避免事后對(duì)精心渲染的資產(chǎn)進(jìn)行返工。而且由于 lo-fi 不是很耗時(shí),團(tuán)隊(duì)可以快速模擬整個(gè)用戶流。通過(guò)確定項(xiàng)目的范圍及其信息架構(gòu),您的團(tuán)隊(duì)可以及早獲得利益相關(guān)者的認(rèn)可,并防止后來(lái)因預(yù)期不一致而失望。


低保真線框的缺點(diǎn)

低保真線框有很多優(yōu)點(diǎn),但只有在正確的時(shí)間和正確的目的部署它們。由于它們?nèi)狈?xì)化和細(xì)節(jié),它們也有一些你需要考慮的缺點(diǎn):

低視覺(jué)沖擊:如果目標(biāo)是傳達(dá)您未來(lái)成品的外觀和感覺(jué),那么低保真線框可能不是正確的選擇。它們未經(jīng)修飾的性質(zhì)使它們不如高保真線框令人印象深刻。這使得它們不適合某些類型的投資者推銷和客戶演示——特別是如果您的利益相關(guān)者不熟悉設(shè)計(jì)過(guò)程。在這些情況下,高保真原型可以通過(guò)模仿產(chǎn)品的最終視覺(jué)設(shè)計(jì)來(lái)提供更多“驚喜”因素。

測(cè)試不足:在開(kāi)發(fā)過(guò)程中,UX設(shè)計(jì)師經(jīng)常會(huì)使用低保真線框,通過(guò)添加交互來(lái)創(chuàng)建一個(gè)粗略的、可點(diǎn)擊的原型。低保真原型可以很好地用于內(nèi)部實(shí)驗(yàn),但通常不足以進(jìn)行公共用戶測(cè)試。這是因?yàn)榈捅U嬖腿狈σ徽滓曈X(jué)線索(形狀、顏色、文本、間距)。因此,用戶瀏覽 UI 的速度可能會(huì)很慢——這會(huì)導(dǎo)致難以準(zhǔn)確評(píng)估產(chǎn)品的可用性。

在我們將注意力轉(zhuǎn)向高保真之前,這里簡(jiǎn)要總結(jié)一下低保真的優(yōu)缺點(diǎn):

低保真專業(yè)人士

  • 快速構(gòu)建,易于迭代
  • 注重功能而非美學(xué)
  • 盡早建立共識(shí)
  • 在昂貴的內(nèi)容之前解決流程

低保真缺點(diǎn)

  • 沒(méi)有高保真音響那么鼓舞人心
  • 缺乏完整的交互性
  • 不足以進(jìn)行無(wú)節(jié)制的測(cè)試
  • 不適合投資者推銷


什么是高保真線框?

高保真線框令人興奮,因?yàn)樗鼈冊(cè)趯?shí)際開(kāi)發(fā)之前模仿了應(yīng)用程序或網(wǎng)站的外觀和感覺(jué)。它們通常包括將成為最終產(chǎn)品一部分的所有品牌、副本、顏色、徽標(biāo)、字體和圖形。

高保真線框在設(shè)計(jì)過(guò)程的最后階段最有用,在完成初始用戶研究并做出有關(guān)布局和內(nèi)容的基本決策之后。 

具有高保真元素但沒(méi)有交互性的線框通常被稱為模型。一旦添加了交互、過(guò)渡或動(dòng)畫,模型就會(huì)成為高保真原型。通過(guò)可點(diǎn)擊的菜單和按鈕,高保真原型提供了用戶體驗(yàn)的發(fā)自內(nèi)心的感覺(jué)。這允許團(tuán)隊(duì)在最終設(shè)計(jì)批準(zhǔn)、測(cè)試和移交給開(kāi)發(fā)人員之前調(diào)整可用性。

如果您準(zhǔn)備好您的高保真內(nèi)容,這里有一個(gè)您可以快速自定義的高保真線框模板。只需交換您的副本、圖像、圖形、品牌和顏色:

Moqups文章圖片

高保真線框的優(yōu)勢(shì)

憑借其細(xì)節(jié)和交互性,高保真線框可以有效預(yù)覽您的產(chǎn)品,并為您的團(tuán)隊(duì)提供許多重要優(yōu)勢(shì):

激發(fā)熱情:從低保真到高保真的飛躍對(duì)于所有參與其中的人來(lái)說(shuō)都是鼓舞人心的。在灰度打好基礎(chǔ)之后,團(tuán)隊(duì)看到他們的努力以全彩和細(xì)節(jié)呈現(xiàn)會(huì)令人耳目一新。并且,從一個(gè)真實(shí)的原型中,利益相關(guān)者、客戶和投資者可以更好地掌握產(chǎn)品的真正吸引力。事實(shí)上,由于它們具有很高的視覺(jué)沖擊力,創(chuàng)始人有時(shí)會(huì)在設(shè)計(jì)過(guò)程的一開(kāi)始就創(chuàng)建高保真線框——通常使用借用的情緒板元素——只是為了讓團(tuán)隊(duì)成員盡早了解他們的愿景。

精致的反饋:由于高保真線框捕捉產(chǎn)品的完整外觀和感覺(jué),它們?yōu)橐曈X(jué)設(shè)計(jì)高級(jí)階段的反饋提供了必不可少的機(jī)會(huì)。團(tuán)隊(duì)有機(jī)會(huì)審查從品牌和用戶流程等大局問(wèn)題到字體易讀性和精確間距等較小細(xì)節(jié)問(wèn)題的所有內(nèi)容。合作者可以直接對(duì)設(shè)計(jì)發(fā)表評(píng)論,甚至可以與平面設(shè)計(jì)師、插畫家、文案和開(kāi)發(fā)人員進(jìn)行實(shí)時(shí)編輯會(huì)議。高度詳細(xì)的線框圖上的精確反饋?zhàn)寛F(tuán)隊(duì)可以在移交給開(kāi)發(fā)團(tuán)隊(duì)之前進(jìn)行最后的調(diào)整——并就項(xiàng)目的可交付成果達(dá)成最終共識(shí)。 

身臨其境的體驗(yàn):添加交互可以將設(shè)計(jì)變成可點(diǎn)擊的原型,從而使設(shè)計(jì)栩栩如生。交互性可以在您的線框圖的任何階段添加,但在您的團(tuán)隊(duì)可能想要評(píng)估和改進(jìn)產(chǎn)品的可用性時(shí),在設(shè)計(jì)過(guò)程結(jié)束時(shí)最有效。通過(guò)活動(dòng)按鈕和可點(diǎn)擊菜單,高保真原型可以模仿您的實(shí)際應(yīng)用程序或網(wǎng)站,并讓利益相關(guān)者對(duì)最終的用戶體驗(yàn)有真實(shí)的感覺(jué)。 

準(zhǔn)確的測(cè)試: Hi-fi 原型可以成為有價(jià)值的評(píng)估工具,特別是如果您有資源執(zhí)行未經(jīng)審核的用戶測(cè)試。當(dāng)然,團(tuán)隊(duì)可以使用從紙質(zhì)線框到高保真模型的任何東西進(jìn)行指導(dǎo)測(cè)試。但是,如果您的目標(biāo)是收集有關(guān)用戶交互和響應(yīng)時(shí)間的真實(shí)數(shù)據(jù),或者測(cè)試特定的 UI 組件,那么您將需要運(yùn)行未經(jīng)審核的測(cè)試。為此,您需要一個(gè)高保真原型。完全交互式、可點(diǎn)擊的原型將最大限度地減少人為錯(cuò)誤并提供更準(zhǔn)確的結(jié)果。


高保真線框的缺點(diǎn)

憑借其精致、細(xì)節(jié)和交互性,高保真線框和原型有很多值得推薦的地方。但是由于團(tuán)隊(duì)經(jīng)常犯錯(cuò)誤,在錯(cuò)誤的時(shí)間構(gòu)建它們,因此值得回顧一下它們的一些缺點(diǎn)和缺點(diǎn):

資源密集型:如果您準(zhǔn)備投入大量專業(yè)知識(shí),則只有在 hi-fi 中工作才有意義。一個(gè)可信的高保真原型需要用戶體驗(yàn)設(shè)計(jì)師、圖形藝術(shù)家和文案的參與。它可能還需要與負(fù)責(zé)照片和視頻等元素的無(wú)數(shù)外部合作者進(jìn)行協(xié)調(diào)。創(chuàng)建詳細(xì)的高保真資產(chǎn)——并將它們整合到精美的設(shè)計(jì)中——需要時(shí)間和金錢。這可能意味著更長(zhǎng)、更昂貴的交付時(shí)間表。

抗修訂:在每個(gè)人都針對(duì)特定設(shè)計(jì)進(jìn)行測(cè)試之前,進(jìn)行實(shí)驗(yàn)要容易得多。因?yàn)楦弑U嬖托枰ㄙM(fèi)大量精力來(lái)創(chuàng)建,所以團(tuán)隊(duì)很容易對(duì)特定方法進(jìn)行深入投資。到那時(shí),改變方向可能會(huì)很痛苦。改變 Hi-Fi 資產(chǎn)可能會(huì)讓團(tuán)隊(duì)成員覺(jué)得他們“回到原點(diǎn)”,或者做了很多“浪費(fèi)的工作”。盡管在這個(gè)過(guò)程中可能學(xué)到了很多東西,但這仍然會(huì)導(dǎo)致動(dòng)力喪失和士氣低落。一個(gè)相關(guān)的問(wèn)題是,一旦利益相關(guān)者看到了鼓舞人心的高保真演繹,他們可能會(huì)對(duì)部署感到不耐煩。這兩個(gè)因素的結(jié)合可以阻止經(jīng)常需要的那種激進(jìn)的修改——并導(dǎo)致沉沒(méi)成本謬誤。

以下是高保真原型的優(yōu)缺點(diǎn)的簡(jiǎn)要總結(jié):

高保真專業(yè)人士

  • 提供最終產(chǎn)品的外觀和感覺(jué)
  • 可點(diǎn)擊和互動(dòng)
  • 更準(zhǔn)確的用戶測(cè)試
  • 為開(kāi)發(fā)人員提供設(shè)計(jì)要求

高保真缺點(diǎn)

  • 需要更長(zhǎng)的時(shí)間線
  • 需要圖形和內(nèi)容
  • 迭代需要時(shí)間和精力
  • 精致的工作不利于反饋


什么時(shí)候走高,什么時(shí)候走低?

高保真和低保真線框?qū)嶋H上只是整個(gè)保真范圍的書擋。在實(shí)踐中,隨著項(xiàng)目的發(fā)展,大多數(shù)團(tuán)隊(duì)在該范圍內(nèi)流暢地移動(dòng),并結(jié)合了高保真和低保真元素。

例如,如果您正在為已建立的網(wǎng)站開(kāi)發(fā)新頁(yè)面,或者為現(xiàn)有應(yīng)用程序開(kāi)發(fā)新功能,您的團(tuán)隊(duì)可能會(huì)通過(guò)調(diào)整現(xiàn)有設(shè)計(jì)來(lái)啟動(dòng)他們的線框圖。他們將在高保真屏幕截圖上疊加低保真元素以制定新配置。更接近開(kāi)發(fā)時(shí),他們可能會(huì)改進(jìn)那些低保真元素,或者干脆交出工作,因?yàn)樗麄冎篱_(kāi)發(fā)團(tuán)隊(duì)已經(jīng)熟悉品牌需求。

高保真/低保真混合的另一個(gè)例子是撰稿人在游戲早期就進(jìn)入設(shè)計(jì)過(guò)程。書面內(nèi)容的范圍和性質(zhì)在很大程度上取決于用戶流程、頁(yè)面布局和可用空間。因此,為了在文案和用戶體驗(yàn)/設(shè)計(jì)之間建立更好的整體凝聚力,文案通常直接在低保真線框上進(jìn)行創(chuàng)作。在這些情況下,副本在圖形元素之前就已經(jīng)成為高保真,并且通常決定了設(shè)計(jì),而不是相反。

Nielsen Norman Group 有一種很好的方式來(lái)思考線框或原型中的保真度問(wèn)題。他們指出,保真度可以在三個(gè)方面有所不同:交互性、視覺(jué)效果和內(nèi)容。換句話說(shuō),隨著項(xiàng)目的發(fā)展,您的團(tuán)隊(duì)可能會(huì)根據(jù)工作流程的性質(zhì)混合和匹配來(lái)自這些領(lǐng)域的高保真和低保真元素。

Moqups文章圖片

了解保真度很重要,但選擇的自由也很重要。因此,問(wèn)題不在于是低保真還是高保真,而在于如何根據(jù)團(tuán)隊(duì)的資源、時(shí)間線和期望來(lái)部署正確的保真度。 

在 Moqups,我們明白任何面向世界的工作流程都將不可避免地比任何預(yù)定義的描述都更加混亂和有機(jī)。這就是為什么我們的應(yīng)用程序旨在為您的團(tuán)隊(duì)提供最大的靈活性。使用 Moqups,您可以從任何地方開(kāi)始,選擇低保真或高保真,然后根據(jù)您的要求來(lái)回跳躍。 

我們的應(yīng)用程序使用簡(jiǎn)單,并且有一個(gè)龐大的模板庫(kù)——因此很容易上手。由于 Moqups 是一個(gè)一體化協(xié)作平臺(tái),您的團(tuán)隊(duì)可以超越線框和原型,在數(shù)字白板、圖表、流程圖和戰(zhàn)略框架上進(jìn)行實(shí)時(shí)協(xié)作——所有這些都在同一個(gè)應(yīng)用程序和創(chuàng)意環(huán)境中。

無(wú)論您的團(tuán)隊(duì)如何在他們的工作流程中加入保真度,也無(wú)論您在產(chǎn)品設(shè)計(jì)過(guò)程中處于什么位置,Moqups 都可以讓您的團(tuán)隊(duì)實(shí)時(shí)協(xié)作,聽(tīng)取所有利益相關(guān)者的意見(jiàn),并就設(shè)計(jì)留下反饋。


歡迎您使用Moqups!