色欧美4477福利网在线观看,亚洲国产AV一区二区污污污,精品欧美一区二区三区,免费人成在线观看欧美精品

    南京海文國際

    南京海文國際

    • 是一家專注于青年人才服務(wù)領(lǐng)域的綜合型企業(yè)機(jī)構(gòu)
    • 是中國領(lǐng)先的科技型人力資源服務(wù)提供商
    • 專注于互聯(lián)網(wǎng)和IT人才培養(yǎng)與輸送的現(xiàn)代化職業(yè)教育品牌

    400-882-5311

    全國學(xué)習(xí)專線 8:00-22:00

    最新總結(jié)的網(wǎng)頁設(shè)計(jì)的必備技巧,快來收藏了解吧

    網(wǎng)頁設(shè)計(jì) 121已閱讀 2020-04-13 17:53:10
    導(dǎo)讀 雖然網(wǎng)頁設(shè)計(jì)是一門相對較新的學(xué)科,但它歸功于人機(jī)交互(HCI)的科學(xué)研究。而這9個(gè)直接來自于人機(jī)交互研究的指南將幫助你在設(shè)計(jì)網(wǎng)站和應(yīng)用程序時(shí)以用戶為中心。界面設(shè)計(jì),主要關(guān)注界面的功能布局,是用戶體驗(yàn)設(shè)計(jì)的一個(gè)子集,它關(guān)注的是大局:即整個(gè)體驗(yàn),而不僅僅是界面。
    雖然網(wǎng)頁設(shè)計(jì)是一門相對較新的學(xué)科,但它歸功于人機(jī)交互(HCI)的科學(xué)研究。而這9個(gè)直接來自于人機(jī)交互研究的指南將幫助你在設(shè)計(jì)網(wǎng)站和應(yīng)用程序時(shí)以用戶為中心。界面設(shè)計(jì),主要關(guān)注界面的功能布局,是用戶體驗(yàn)設(shè)計(jì)的一個(gè)子集,它關(guān)注的是大局:即整個(gè)體驗(yàn),而不僅僅是界面。
    了解你的用戶
      最重要的是,你必須了解你的用戶是誰--從里到外。這意味著你必須了解你的分析應(yīng)用程序可以拉取的所有人口統(tǒng)計(jì)學(xué)數(shù)據(jù)。但更重要的是,這意味著了解他們需要什么,以及是什么阻礙了他們實(shí)現(xiàn)目標(biāo)。
      要達(dá)到這種程度的同理心,需要的不僅僅是仔細(xì)分析統(tǒng)計(jì)數(shù)據(jù)。它需要了解使用你的網(wǎng)站的人。這意味著與他們面對面地交談,觀察他們使用你的產(chǎn)品(也許還有其他產(chǎn)品),并問他們更深層次的問題,而不是譬如"你覺得這個(gè)設(shè)計(jì)怎么樣?”之類的無聊問題。
      目標(biāo)是什么?是什么阻礙了實(shí)現(xiàn)這些目標(biāo)?一個(gè)網(wǎng)站如何幫助克服或解決這些挑戰(zhàn)?
      不要僅僅停留在知道你的用戶想要什么。必須深入挖掘,找出他們的需求。畢竟,欲望只是需求的衍生品。如果你能解決用戶的深層需求,那么您將在滿足他們最基本需求的同時(shí)滿足他們的需求。
      你將從分析數(shù)據(jù)和與用戶交談中發(fā)現(xiàn)的見解將為你的每一個(gè)決策提供參考,從人們?nèi)绾问褂媚愕慕缑妫侥銓⒃诮缑嬷型怀鲲@示哪些類型的內(nèi)容。
    定義用戶如何使用你的界面
      在你設(shè)計(jì)界面之前,你需要定義人們將如何使用它。隨著觸摸式設(shè)備的日益普及,這是一個(gè)比你想象中更關(guān)鍵的問題??纯匆韵庐a(chǎn)品:
      Tinder:該應(yīng)用程序的用戶體驗(yàn)實(shí)際上是由簡單的滑動(dòng)即可輕松實(shí)現(xiàn)的。
      人們使用網(wǎng)站和APP的方式有兩種:直接(通過與產(chǎn)品的界面元素進(jìn)行交互)和間接(通過與產(chǎn)品外部的UI元素進(jìn)行交互)。
      直接互動(dòng)的例子
      輕按一個(gè)按鈕
      刷卡
      拖動(dòng)一個(gè)目標(biāo)
      間接互動(dòng)的例子
      用鼠標(biāo)指向和單擊
      使用按鍵命令/快捷鍵
      輸入表格字段
      在Wacom上繪圖
      有時(shí)候,交互顯得很容易
      你的用戶是誰,他們使用什么設(shè)備,應(yīng)該深深地影響你的決定。如果你的設(shè)計(jì)對象是老年人或其他手部靈巧度有限的人,你就不希望依賴刷卡。如果你的設(shè)計(jì)對象是寫手或編碼人員,他們主要通過鍵盤與應(yīng)用程序進(jìn)行交互,你會(huì)希望支持所有常見的鍵盤快捷鍵,以減少使用鼠標(biāo)的時(shí)間。
    設(shè)定期望值
      許多與網(wǎng)站或APP的互動(dòng)都會(huì)產(chǎn)生后果:點(diǎn)擊一個(gè)按鈕可能意味著花錢,刪除一個(gè)網(wǎng)站,或者對奶奶的生日蛋糕發(fā)表貶義的評論。而任何時(shí)候有了后果,也就產(chǎn)生焦慮。
      所以,一定要讓用戶在點(diǎn)擊那個(gè)按鈕之前,先讓他們知道點(diǎn)擊那個(gè)按鈕之后會(huì)發(fā)生什么。你可以通過設(shè)計(jì)或文案來做到這一點(diǎn)。
      用設(shè)計(jì)設(shè)定期望值
      突出顯示與所需操作相對應(yīng)的按鈕。
      使用一個(gè)廣為人知的符號(如用垃圾桶做刪除按鈕,用加號來添加?xùn)|西,或用放大鏡做搜索)
      選擇一個(gè)有相關(guān)含義的顏色(綠色代表“開始",紅色代表"停止")
      以文本設(shè)定期望值
      撰寫清晰的按鈕文字
      在空白狀態(tài)下提供方向性/鼓勵(lì)性文字
      發(fā)出警告并要求確認(rèn)
      對于具有不可逆后果的操作,例如永久刪除某項(xiàng),問用戶是否確定。
      在InVision中,單擊垃圾桶圖標(biāo)不會(huì)立即刪除。相反,它詢問您是否確定,并告知您無法撤消。
    預(yù)計(jì)到錯(cuò)誤
      人都會(huì)犯錯(cuò),但他們不應(yīng)該(總是)承擔(dān)后果。有兩種方法可以幫助減少人為錯(cuò)誤的影響。
      1.在錯(cuò)誤發(fā)生之前就預(yù)防錯(cuò)誤
      2.提供發(fā)生后的修復(fù)方法
      在電子商務(wù)和表單設(shè)計(jì)中,你會(huì)看到很多防錯(cuò)技巧。按鈕保持不活動(dòng),直到你填寫完所有的字段。表單會(huì)檢測到電子郵件地址沒有正確輸入。彈出窗口會(huì)問你是否真的要放棄你的購物車。
      預(yù)測錯(cuò)誤通常比嘗試事后解決錯(cuò)誤要容易得多。這是因?yàn)樗鼈儼l(fā)生在單擊“下一步”或“提交”按鈕可以帶來令人滿意的完成感之前。
      話雖如此,但有時(shí)你不得不讓意外發(fā)生。這時(shí),詳細(xì)的錯(cuò)誤信息才是真正意義上的錯(cuò)誤信息。
      當(dāng)你在寫錯(cuò)誤信息時(shí),要確保它們能做兩件事:
      1.解釋問題的原因。例如:"你說你出生在火星上,人類還沒有殖民過。還沒有。"
      2.解釋一下如何解決。如:"請?jiān)谶@里輸入一個(gè)地球上的出生地。"
      注意,在非錯(cuò)誤的情況下,你可以從那本書中抽出一頁來。比如說,如果我刪除了一些東西,但可以恢復(fù),讓我知道,用一行復(fù)制,比如說"你可以通過進(jìn)入你的垃圾箱,然后點(diǎn)擊恢復(fù),總是可以恢復(fù)被刪除的東西。"
      預(yù)知用戶錯(cuò)誤的原則被稱為poka-yoke原則。Poka-yoke是一個(gè)日語術(shù)語,翻譯成"防呆"。
    迅速給予反饋
      在現(xiàn)實(shí)世界中,環(huán)境會(huì)給我們反饋。我們說話,別人就會(huì)回應(yīng)(通常情況下)。我們抓一只貓,它就會(huì)發(fā)出呼嚕聲或聲嘶力竭(取決于它的情緒和我們對貓抓癢的程度)。
      很多時(shí)候,數(shù)字界面不能給我們太多的反饋,讓我們糾結(jié)于是否應(yīng)該重新加載頁面,重啟筆記本,或者直接把它扔出窗口。
      所以,給我一個(gè)加載動(dòng)畫。讓那個(gè)按鈕在我點(diǎn)擊時(shí)彈出并彈回,但不要太多。當(dāng)我做了一些你我都同意的事情時(shí),給我一個(gè)虛擬的擊掌。
      計(jì)劃或發(fā)送電子郵件時(shí),MailChimp會(huì)提供反饋和鼓勵(lì)。
      只要確保這一切發(fā)生得快就可以了。Usability.gov將任何超過1秒的延遲定義為中斷。如果超過10秒,則為中斷。后者很慷慨:對于大約一半的人來說,3秒就足以導(dǎo)致跳出。
      如果一個(gè)頁面在5秒內(nèi)加載,不要顯示進(jìn)度條,因?yàn)檫@實(shí)際上會(huì)使加載時(shí)間看起來更長。相反,使用一個(gè)不暗示進(jìn)度的可視化,就像Mac的臭名昭著的“死亡風(fēng)車”。如果你的網(wǎng)站上確實(shí)使用了進(jìn)度條,可以考慮嘗試一些視覺技巧,讓加載看起來更快。
    仔細(xì)考慮元素的位置和大小
      菲茨定律是人機(jī)交互(HCI)的一個(gè)基本原則,它指出:
      獲取目標(biāo)的時(shí)間取決于目標(biāo)的距離和大小。
      換句話說:距離越近或越大的東西,你可以把光標(biāo)(或手指)放在上面的速度就越快。這顯然對交互和用戶界面設(shè)計(jì)技術(shù)有各種各樣的影響,但其中最重要的三個(gè)是。
      讓按鈕和其他的"點(diǎn)擊目標(biāo)"(如圖標(biāo)和文本鏈接)足夠大,以便于看到和點(diǎn)擊。這一點(diǎn)對于排版、菜單和其他鏈接列表尤其重要,因?yàn)榭臻g不夠大,會(huì)讓人反復(fù)點(diǎn)擊錯(cuò)誤的鏈接。
      將最常見的操作按鈕做得更大、更顯眼。
      將導(dǎo)航(和其他常見的交互式視覺元素,如搜索欄)放在屏幕的邊緣或角落。這最后一個(gè)可能看起來似乎有些反直覺,但它的作用在于減少了對準(zhǔn)確性的要求:用戶不需要擔(dān)心過量的點(diǎn)擊目標(biāo)。
      當(dāng)你在考慮元素的放置和大小的時(shí)候,要時(shí)刻牢記你的交互模型。如果你的網(wǎng)站需要水平滾動(dòng),而不是垂直滾動(dòng),你需要考慮在哪里以及如何提示用戶到這種不尋常的交互類型。
    不要忽視標(biāo)準(zhǔn)
      作為高度創(chuàng)意型的設(shè)計(jì)師,他們往往喜歡重新發(fā)明事物--但這并不總是的想法。
      為什么?因?yàn)橹匦略O(shè)計(jì)一個(gè)熟悉的交互或界面會(huì)增加"認(rèn)知負(fù)荷":它讓人們重新思考一個(gè)他們已經(jīng)學(xué)習(xí)過的過程。很顯然,你可以想方設(shè)法地重新發(fā)明輪子,但前提是它必須是在設(shè)計(jì)上有所改進(jìn)。
      這個(gè)經(jīng)驗(yàn)法則解釋了為什么Google Docs的菜單欄的功能幾乎與Vista之前的Microsoft Word的所有選項(xiàng)相同:
      Windows Vista之前的Microsoft Word菜單欄。
      u200d2015年Google文檔菜單欄
      這也解釋了為什么Pocket在幾年前不得不改變其Android應(yīng)用中的存檔按鈕的位置。
      更改單個(gè)按鈕使其與Android的設(shè)計(jì)模式更加一致,使新用戶繼續(xù)使用Pocket的可能性提高了23%。
      在2013年秋季之前,存檔按鈕一直位于屏幕的左上角,也就是安卓設(shè)計(jì)規(guī)范中所說的“向上"按鈕的位置。Pocket希望將人們的注意力集中在閱讀體驗(yàn)上,而不是重復(fù)現(xiàn)有的硬件控制,但不一致的位置導(dǎo)致新用戶不小心關(guān)閉并歸檔他們正在閱讀的文章,而不是像預(yù)期的那樣簡單地返回到他們的閱讀列表。
      這一微小的改變"使新用戶從這一點(diǎn)開始繼續(xù)使用Pocket的可能性增加了23%。"
    使你的界面易于學(xué)習(xí)
      說到簡單,人們經(jīng)常會(huì)引用哈佛大學(xué)心理學(xué)家喬治-米勒的一篇論文,名為《神奇的數(shù)字七,加減二:對我們處理信息能力的一些限制》。文章認(rèn)為,人們在短期記憶中只能掌握5到9件事情的可靠性。米勒本人稱這是一種巧合,但這似乎并不能阻止任何人引用他的說法。
      話雖如此,但是,越簡單的東西越容易在短期內(nèi)記住,這也是符合邏輯的。所以,盡可能地限制一個(gè)人需要記住的東西的數(shù)量,以便有效地使用你的界面。你可以通過將信息塊化,即將其分解成可消化的小塊。
      這個(gè)想法與Tesler的"復(fù)雜性守恒定律"相吻合,該定律指出,UI設(shè)計(jì)師應(yīng)該讓他們的界面盡可能簡單。這可能意味著在可能的情況下,在簡化的界面背后掩蓋了應(yīng)用程序的復(fù)雜性。Microsoft Word就是一個(gè)不遵守這一定律的產(chǎn)品的常見例子。
      大多數(shù)人只能在Word中做一些事情,例如打字,而其他人可以用它來做各種強(qiáng)大的事情。
      這導(dǎo)致了一個(gè)叫做漸進(jìn)式公開的概念,將高級功能隱藏在輔助界面上。你經(jīng)常會(huì)在網(wǎng)站的主頁上看到這種情況,在網(wǎng)站的主頁上,用簡短的文字介紹產(chǎn)品或功能,然后鏈接到用戶可以了解更多信息的頁面。(這也是移動(dòng)設(shè)計(jì)的實(shí)踐,在這里,強(qiáng)大的導(dǎo)航總是一個(gè)挑戰(zhàn))。
      專業(yè)提示:避免在鏈接和按鈕中使用"了解更多"和類似的非特定文本。為什么?因?yàn)樗]有告訴用戶他們會(huì)"了解更多"的內(nèi)容。通常情況下,人們只是簡單地掃描一個(gè)頁面,尋找一個(gè)能帶他們到他們想去的地方的鏈接,而"了解更多",重復(fù)15次,并沒有幫助。這一點(diǎn)對于屏幕閱讀的用戶來說尤其重要。
    使決策簡單化
      網(wǎng)絡(luò)上有太多的廣告向我們喊話。"橫幅廣告"突然膨脹成了全屏廣告。模板彈出,暗示我們要訂閱我們還沒來得及看的博客。視頻間歇廣告讓我們停滯不前,迫使我們看著寶貴的幾秒鐘的時(shí)間慢慢流逝。甚至不要讓我開始討論那些小部件、彈出按鈕、工具提示......
      有時(shí)我渴望一個(gè)更平靜的網(wǎng)絡(luò),而??怂苟山o了我們所有人一個(gè)建立網(wǎng)絡(luò)的理由。這個(gè)想法和它的最終結(jié)果一樣簡單:你給用戶提供的用戶界面選項(xiàng)越多,他們就越難做出決定。
      這幾乎影響到了我們構(gòu)建的一切:
      總體布局
      導(dǎo)航菜單
      定價(jià)頁面
      博客索引
      內(nèi)容提要
      這個(gè)問題還在繼續(xù)。但最終的結(jié)果是:我們的設(shè)計(jì)越簡單,用戶就越能更快、更容易做出我們希望他們做出的決定。這也正是為什么著陸頁和非新聞通訊郵件應(yīng)該只有一個(gè)行動(dòng)呼吁的原因。
      專業(yè)提示:有時(shí)候,你實(shí)際上確實(shí)希望用戶能夠慢下來,考慮一下他們的選擇。這就是為什么Pinterest、Dribbble和許多博客的分層設(shè)計(jì)實(shí)際上效果很好。畢竟,你必須在更多的選項(xiàng)之間做出決定,你越有可能找到一個(gè)適合你的選項(xiàng)。
    聆聽數(shù)據(jù)
      雖然我們都可能希望我們的設(shè)計(jì)純粹是以藝術(shù)價(jià)值為評價(jià)標(biāo)準(zhǔn),但實(shí)際上,優(yōu)化設(shè)計(jì)以達(dá)到設(shè)計(jì)目的同樣重要。
      雖然用戶研究和測試對于指導(dǎo)你的設(shè)計(jì)決策以實(shí)現(xiàn)網(wǎng)站的目標(biāo)是非常有幫助的,但網(wǎng)站上線后收集的數(shù)據(jù)仍然是非常寶貴的。
      因此,為你的網(wǎng)站設(shè)置分析,并定期進(jìn)行分析。外面有很多不同的分析工具,但我推薦使用Google Analytics和/或Mixpanel,這取決于項(xiàng)目類型。
      Mixpanel專注于事件,所以它根據(jù)訪客在你的網(wǎng)站上的行為收集數(shù)據(jù),而Google Analytics更多的是行為分析,給你提供會(huì)話時(shí)間、流量來源等。雖然這兩種工具都可以提供這兩種形式的數(shù)據(jù),但它們真正的亮點(diǎn)在于它們的重點(diǎn)領(lǐng)域,所以請選擇最適合您的需求。
      注意:這兩種工具都是免費(fèi)的,最多可提供一定數(shù)量的數(shù)據(jù)點(diǎn)。Webflow和類似的平臺通常通過簡單的API密鑰交換,使分析設(shè)置變得容易。
    相關(guān)文章
    零基礎(chǔ)自學(xué)Java路線總結(jié),這些你都會(huì)嗎?快來了解吧

    零基礎(chǔ)自學(xué)Java路線總結(jié),這些你都會(huì)嗎?快來了解吧

    相信很多學(xué)JAVA的人大部分比較迷茫,之前自學(xué)Java的時(shí)候走過彎路,一直想寫一篇文章來總結(jié)下自己對零基礎(chǔ)自學(xué)Java的認(rèn)識。將自己的經(jīng)驗(yàn)梳理成文章,既可以鞏固所學(xué),也可以為后來境遇相同的人做個(gè)參考。... [詳情]

    104人閱讀
    web前端入門必學(xué)的16個(gè)知識點(diǎn),你也快來看看吧

    web前端入門必學(xué)的16個(gè)知識點(diǎn),你也快來看看吧

    為了幫助大家學(xué)習(xí)前端,讓學(xué)習(xí)變得輕松,高效!今天給大家分享一套教學(xué)資源,從最零基礎(chǔ)開始的的HTML+CSS+JavaScript。jQuery,Ajax,node,angular框架等幫助大家在學(xué)習(xí)Web前端的道路上披荊斬棘。... [詳情]

    126人閱讀
    平面設(shè)計(jì)學(xué)什么?你想知道的全在這里!

    平面設(shè)計(jì)學(xué)什么?你想知道的全在這里!

    面設(shè)計(jì)學(xué)什么?很多人在剛開始接觸平面設(shè)計(jì)時(shí)都不知該如何下手學(xué)習(xí),一會(huì)兒是設(shè)計(jì)軟件、一會(huì)兒又是色彩、一會(huì)兒又是排版版式設(shè)計(jì)...人都暈了。今天,小編就以為數(shù)不多的經(jīng)驗(yàn)就平面設(shè)計(jì)的學(xué)習(xí)方法與技巧說一下,希望能對一些新手以及想學(xué)習(xí)平面設(shè)計(jì)的朋友有所幫助... [詳情]

    198人閱讀
    產(chǎn)品完整流程:產(chǎn)品經(jīng)理必做的事情總結(jié)

    產(chǎn)品完整流程:產(chǎn)品經(jīng)理必做的事情總結(jié)

    對于非互聯(lián)網(wǎng)行業(yè)的人來說,我們往往拿捏不好這個(gè)回答的度。講太多技術(shù)又怕人不懂,講太少的話又怕人家認(rèn)為自己是行政,講不好還會(huì)被人認(rèn)為是銀行柜臺里那個(gè)產(chǎn)品經(jīng)理。所以異常心累。今天小編就帶大家來認(rèn)識認(rèn)識產(chǎn)品經(jīng)理。... [詳情]

    193人閱讀
    最新總結(jié)的網(wǎng)頁設(shè)計(jì)的必備技巧,快來收藏了解吧

    最新總結(jié)的網(wǎng)頁設(shè)計(jì)的必備技巧,快來收藏了解吧

    雖然網(wǎng)頁設(shè)計(jì)是一門相對較新的學(xué)科,但它歸功于人機(jī)交互(HCI)的科學(xué)研究。而這9個(gè)直接來自于人機(jī)交互研究的指南將幫助你在設(shè)計(jì)網(wǎng)站和應(yīng)用程序時(shí)以用戶為中心。界面設(shè)計(jì),主要關(guān)注界面的功能布局,是用戶體驗(yàn)設(shè)計(jì)的一個(gè)子集,它關(guān)注的是大局:即整個(gè)體驗(yàn),而不僅僅是界面。... [詳情]

    121人閱讀
    ps快速摳圖

    ps快速摳圖

    摳圖技術(shù)不好?摳出來的圖總是迷迷糊糊的怎么辦?海文國際幫大家整理了一篇摳圖小攻略,幫助大家提升摳圖技巧,下面就一起來看一下吧。... [詳情]

    143人閱讀