在設(shè)計(jì)流程中,通過這6種體例來運(yùn)用信息架構(gòu)
一名良好的設(shè)計(jì)師除了必要具備優(yōu)秀的設(shè)計(jì)技能,還必要大量的設(shè)計(jì)相干知識(shí)貯備。信息架構(gòu)是設(shè)計(jì)師必要懂得的最緊張的知識(shí)之一。在之前的文章《寫給設(shè)計(jì)師的信息架構(gòu)基礎(chǔ)知識(shí)指南》當(dāng)中,我們細(xì)致闡述了信息架構(gòu)的基礎(chǔ)知識(shí),你可以通過這篇文章來了解為什么它是UI和UX設(shè)計(jì)的必備知識(shí)。信息架構(gòu)的設(shè)計(jì)原則,對(duì)于設(shè)計(jì)師而言,也是設(shè)計(jì)中值得參考的有效工具。今天的文章,幫你總結(jié)了在設(shè)計(jì)過程中運(yùn)用信息架構(gòu)知識(shí)的6個(gè)技巧。
1、始終牢記產(chǎn)品設(shè)計(jì)目標(biāo)
如何界定產(chǎn)品最終要達(dá)成的目標(biāo),其實(shí)直接影響著整個(gè)團(tuán)隊(duì)每個(gè)階段的工作,無論是對(duì)于設(shè)計(jì)師,開發(fā)人員照舊產(chǎn)品經(jīng)理,均是如此。信息架構(gòu)與此也痛癢相關(guān)。只有了解用戶和企業(yè)自己對(duì)于網(wǎng)站和APP的真實(shí)期望之后,才可以開始構(gòu)建團(tuán)體的信息架構(gòu)。所以,產(chǎn)品團(tuán)隊(duì)?wèi)?yīng)該完備地了解產(chǎn)品的目標(biāo),確保創(chuàng)意團(tuán)隊(duì)中所有的成員都充足理解,并且針對(duì)目標(biāo)制訂響應(yīng)的策略和應(yīng)對(duì)措施,才能具備最終實(shí)現(xiàn)的可能性。始終銘記最終目標(biāo)以及為了達(dá)成目標(biāo)而必要實(shí)行的義務(wù),能夠讓整個(gè)實(shí)行過程更加明確。在設(shè)定目標(biāo)的時(shí)候,設(shè)計(jì)師和客戶應(yīng)該就內(nèi)容和團(tuán)體信息架構(gòu)以及最終目標(biāo)達(dá)成同等,避免可能存在的誤會(huì),提拔實(shí)行服從。
2、進(jìn)行用戶調(diào)研
信息架構(gòu)專家在搭建產(chǎn)品信息架構(gòu)之前,應(yīng)該對(duì)目標(biāo)受眾的需求和細(xì)節(jié)有充足的了解,將提拔用戶寫意度作為優(yōu)先考慮的事項(xiàng)。想要了解更多潛在用戶的信息,建議設(shè)計(jì)師做用戶調(diào)研。通過各種技術(shù)手段搜集關(guān)于目標(biāo)用戶和潛在用戶的相干信息的過程就是用戶調(diào)研。搜集數(shù)據(jù)之后,設(shè)計(jì)團(tuán)隊(duì)針對(duì)這些信息進(jìn)行分析,并且找出最佳的解決方案,從而有可能創(chuàng)造出對(duì)用戶友愛且有吸引力的產(chǎn)品。
用戶調(diào)研有助于深入了解目標(biāo)受眾的細(xì)節(jié),了解他們的需求和生理特性。結(jié)合用戶喜愛,設(shè)計(jì)團(tuán)隊(duì)能夠有方向地創(chuàng)造出對(duì)用戶友愛,貼合需求還可能吸引潛在用戶的產(chǎn)品。
3、結(jié)合認(rèn)貼心理學(xué)
認(rèn)貼心理學(xué)和信息架構(gòu)的搭建有著緊密的關(guān)聯(lián)。用戶的視覺感知和影響用戶細(xì)致力的因素,都可以通過認(rèn)貼心理學(xué)來進(jìn)行判斷。信息處理的科學(xué)是以人為中間的科學(xué),有認(rèn)貼心理學(xué)的專家指出,人類感知數(shù)據(jù)的體例有許多,而影響細(xì)致力的因素則更是不盡雷同。
基于認(rèn)貼心理學(xué)的原理和相干研究,設(shè)計(jì)師可以采用很多不同的技術(shù)來創(chuàng)建充足有用的內(nèi)容。在設(shè)計(jì)過程中,設(shè)計(jì)師常常會(huì)采用格式塔原理來構(gòu)建布局,巧用元素,這種行使視覺相似性和關(guān)聯(lián)性的生理學(xué)原理,適用范圍特別很是廣。而識(shí)別模式則更加有效,當(dāng)用戶訪問網(wǎng)站或者APP的時(shí)候,常常會(huì)期待看到特定的內(nèi)容和功能,識(shí)別模式可以行使調(diào)研數(shù)據(jù)和經(jīng)驗(yàn)幫助設(shè)計(jì)師,快速搭建布局和信息架構(gòu)。
4、規(guī)劃導(dǎo)航體系
信息架構(gòu)和導(dǎo)航是數(shù)字產(chǎn)品當(dāng)中最緊張的兩個(gè)組成部分。導(dǎo)航是網(wǎng)站和APP當(dāng)中指導(dǎo)用戶抵達(dá)不同目標(biāo)和功能或者網(wǎng)頁的一組操作或者技術(shù),作為網(wǎng)頁中重要的交互而存在。導(dǎo)航和信息架構(gòu)有著密切的關(guān)聯(lián),信息架構(gòu)所構(gòu)成的框架之下,導(dǎo)航作為抵達(dá)不同信息區(qū)塊的路徑而存在。
普通點(diǎn)說,數(shù)字產(chǎn)品當(dāng)中,導(dǎo)航是基于信息架構(gòu)來梳理的,它最終應(yīng)該反映并支撐信息架構(gòu),否則產(chǎn)品無法保證其同等性。當(dāng)然,兩者雖然不是一個(gè)東西,但是在創(chuàng)建信息架構(gòu)的時(shí)候,同期針對(duì)導(dǎo)航體系進(jìn)行規(guī)劃。
5、別忘了視覺條理
為了更好地組織信息、確定內(nèi)容呈現(xiàn)的優(yōu)先級(jí),設(shè)計(jì)師會(huì)結(jié)合信息架構(gòu),使用視覺條理來有著重地、視覺化的顯現(xiàn)內(nèi)容。無論是文檔、圖書、海報(bào)、頁面照舊APP,這些載體上所承載的內(nèi)容,會(huì)按照每個(gè)元素的緊張程度來有差別地顯現(xiàn),而這種差別通常是通過大小、色彩、對(duì)比度、對(duì)齊度來區(qū)別的。緊張的信息會(huì)更容易被用戶細(xì)致到,便于他們輕松欣賞。
6、還要細(xì)致閱讀模式
視覺條理的構(gòu)建使得數(shù)字產(chǎn)品內(nèi)容的可讀性有了充足的保障。不過,僅有視覺條理還不夠,設(shè)計(jì)師還應(yīng)當(dāng)根據(jù)產(chǎn)品形態(tài),考慮用戶的閱讀模式。
用戶研究領(lǐng)域的先驅(qū) Nielsen Norman Group 曾經(jīng)針對(duì)這一用戶舉動(dòng)進(jìn)行了深入的研究,為設(shè)計(jì)師和可用性設(shè)計(jì)專家們提供了更好的素材和設(shè)計(jì)依據(jù)。
簡而言之,當(dāng)人們?cè)L問某個(gè)網(wǎng)站的時(shí)候,尤其是初次訪問網(wǎng)站的時(shí)候,他們通常不會(huì)分外細(xì)心的查看所有的內(nèi)容,而是快速的掃視,找到能夠吸引他們細(xì)致力的信息,這些內(nèi)容就是他們繼承停頓在這個(gè)網(wǎng)站上的理由。通過眼動(dòng)測試和不同實(shí)驗(yàn),他們發(fā)現(xiàn)訪問者的視覺欣賞模式,可以歸結(jié)為幾種典型的模式。設(shè)計(jì)師 Steven Bradley 在本身的文章中,總結(jié)了這三種常見的模式:古騰堡式,Z圖模式和F圖模式。
古騰堡式:對(duì)于信息結(jié)構(gòu)條理并不那么分明的頁面,用戶常常會(huì)使用古騰堡式的欣賞模式,用戶大范圍掃視網(wǎng)頁內(nèi)容,整個(gè)視線路徑是一個(gè)大號(hào)的Z,其中最開始的兩個(gè)視覺駐留點(diǎn)就在頁頭上。
Z圖模式也不難理解,用戶從上到下,視線沿著Z字形往返掃視,用戶會(huì)左右快速掃視,視線的起點(diǎn)首先是左上角,行跨頂部一欄到右上角,然后向下延長。
F圖模式,或者說是F式布局,我們就更加認(rèn)識(shí)了。在Nielsen Norman Group 的研究當(dāng)中,這種閱讀模式最為典型:
- 用戶先會(huì)沿著水平方向欣賞,優(yōu)先欣賞內(nèi)容塊的上部,這個(gè)時(shí)候的眼動(dòng)構(gòu)成了字母F 最上面一橫。
- 接下來視線會(huì)沿著屏幕左側(cè)向下垂直掃視,探求段落中能引起愛好點(diǎn)的內(nèi)容,當(dāng)他們發(fā)現(xiàn)引起他們愛好的內(nèi)容之時(shí),繼承橫向細(xì)心欣賞,而通常這些內(nèi)容對(duì)應(yīng)的視線范圍會(huì)比第一次橫向欣賞的范疇要更小一些,而這個(gè)視線軌跡則構(gòu)成了字母F 中心的一橫。
- 接下來用戶會(huì)將視線移到屏幕左側(cè),繼承向下欣賞。
所以,將最關(guān)鍵的元素置于用戶的欣賞路徑上,讓用戶可以更輕松地消化信息,也能最高效地實(shí)行交互。
更多細(xì)致事項(xiàng)
信息架構(gòu)學(xué)科看起來很復(fù)雜,必要花費(fèi)時(shí)間和精力來深入學(xué)習(xí)??墒钱?dāng)你了解了相干的基礎(chǔ)知識(shí)之后,再應(yīng)用于設(shè)計(jì)項(xiàng)目的時(shí)候,你就會(huì)發(fā)現(xiàn)它是多么的有效。根據(jù) Tubik Stuido 之前的系列文章,我想列出關(guān)于信息架構(gòu)知識(shí)的一些要點(diǎn):
- 信息架構(gòu)是構(gòu)成數(shù)字產(chǎn)品的骨架,設(shè)計(jì)師可以根據(jù)信息架構(gòu)來構(gòu)建視覺元素、功能、交互和導(dǎo)航
- 壯大的信息架構(gòu)是產(chǎn)品質(zhì)量的保證,它會(huì)削減掃可用性題目,提拔導(dǎo)航性
- 信息架構(gòu)就像是整個(gè)布局的藍(lán)圖,幫助視覺設(shè)計(jì)方案的生成
- 定義產(chǎn)品目標(biāo)是創(chuàng)建信息架構(gòu)的核心
- 用研和認(rèn)貼心理學(xué)能夠幫設(shè)計(jì)團(tuán)隊(duì)展望用戶對(duì)于產(chǎn)品的反應(yīng),并且創(chuàng)造對(duì)用戶友愛的體驗(yàn)
- 清晰的視覺條理在內(nèi)容顯現(xiàn)上起偏重要的作用
本文地址:http://m.likemindfilms.com/tutorial/di3928.html
您可能還喜歡
- Macaron 馬卡龍系色譜 ;附HC(16進(jìn)制碼
- 7個(gè)手機(jī)版網(wǎng)頁設(shè)計(jì)的原則
- 折紙多邊形網(wǎng)頁背景效果制作教程
- 龐門正道:好好玩耍的點(diǎn)線面(上)
- 網(wǎng)頁設(shè)計(jì)中的常見頁面布局方式
- WAP APP的柵格設(shè)計(jì)
- 八種很漂亮的排版方法和技巧分享
- 網(wǎng)頁設(shè)計(jì)的首屏標(biāo)準(zhǔn)你了解多少?
- 字體大寶庫:40款為網(wǎng)頁設(shè)計(jì)師準(zhǔn)備的時(shí)
- 視覺設(shè)計(jì)分享—專題頁面設(shè)計(jì)篇
- 專訪:石墨文檔產(chǎn)品總監(jiān)羅穎
- UI設(shè)計(jì)不得不知的移動(dòng)端UI尺寸適
- 光音移動(dòng)設(shè)計(jì)規(guī)范 — 表單類
- 體驗(yàn)設(shè)計(jì)中的排序問題
- 網(wǎng)頁設(shè)計(jì)精粹 網(wǎng)頁中那些迷人的按
- aliued:響應(yīng)式設(shè)計(jì)的現(xiàn)狀與趨勢
- 10個(gè)智能對(duì)象處理的ps技巧
- 網(wǎng)頁UI - 原子設(shè)計(jì)理論(上)
- 如何通過設(shè)計(jì)提升banner點(diǎn)擊率?
- 晉小彥視覺設(shè)計(jì)系列文章(二):全屏