您現在的位置是:電腦技術吧?>? 故障問題 ??>??網站交互設計,什么是交互設計??>??正文詳情

網站交互設計,什么是交互設計

泥盼香2019-11-14 23:50:58 人圍觀
簡介ui設計交互設計良好的交互設計可以將優質網站與其他普通網站區分開來。然而,如果存在明顯的設計錯誤,它只會給你想要打動的用戶一種刺激感和挫敗感。下面是Speckyboy上總結的最

好的交互設計可以區分開有質量的網站和其他普通網站。

然而,如果有明顯的設計錯誤,它只會給予你本來想打動的用戶以刺激和挫敗感。

下面是Speckyboy上總結的讓人最不喜歡的交互設計錯誤列表,來看看你中槍了沒!

  1,缺乏對比

  當瀏覽網站時,我們喜歡看頁面設計展示出干凈、清爽的對比。

對比達到了一個重要的目的它使內容可讀,并毫不費力地在頁面上指導用戶。

這是一個最基本的設計概念,只是很奇怪,有些網站似乎就是不明白。

  沒有足夠的對比度的話,不管是顏色或整體展示,一個網站看起來,在最好的情況下,也會讓你覺得有點兒丈二和尚摸不著頭腦,在最壞的情況下,將會使頁面完全不可讀。

  ▲ 案例示范

  2,瘋狂的導航

  無論你用的是什么跳出框架的導航創意,先考慮好你的用戶。

這并不是令人無聊的,而是深思熟慮并且務實的。

好好利用導航設計的最佳實踐和原則:清晰、簡單性、一致性和相關性。

  ▲ 案例示范

  3,非響應式的或者不良的觸摸目標

  響應式網站在現在是至關重要的,我們沒有借口去創建一個在你的智能手機上很難用的網站,除非你做了大量的用戶測試,并證明了一個移動友好的網站并不是必需的。

  ▲ 案例示范

  4,令人心煩意亂的音樂

  在晚上放些音樂很高興而且也令放松。

在正確的時間點上,音樂可以是很棒的體驗。

然而,在99.9%的情況下,正確的時間并不是當你瀏覽網站的時候。

  很少有事情比你在瀏覽一個網站的同時有一個刺耳的管弦交響樂團在你耳邊演奏更惱人的事情。

如果你是廣告你的下一張專輯,這可能還算是可以原諒的。

但即使這樣,也只是可能還算是。

  ▲ 案例示范

  5,毫無意義的彈出窗口

  是的,彈出窗口真的可以讓人感到惱火。

特別是注冊窗口!每個人都需要更多的注冊!但是,總有更好的方法來做你的營銷。

彈出式窗口可以像沖孩子大喊大叫以試圖吸引其注意力一樣惱人。

如果你必須使用彈窗,請讓它們簡單,有創意,并且易于關閉。

  ▲ 案例示范

  6,可憐的架構

  我理解嘗試創新是多么誘人。

畢竟,你希望你的設計脫穎而出。

然而,當創造變成了一場火熱的混亂,就是時候帶入一些必要的組織性。

  偉大的設計師們都是偉大的溝通者。

視覺層次結構和平衡是創造良好的第一印象的重要層面,同時它們可以影響用戶的行為,更重要的是,可以有效地傳遞出網頁以外的信息。

  ▲ 案例示范

  7,棘手的排版

  當我訪問網站,我喜歡能夠快速而方便地訪問信息。

我們都不喜歡混亂的不易閱讀的帶陰影效果的大號字體。

或者是在一個移動的背景嘗試閱讀,或者與要用放大鏡才能查看的小字體苦苦斗爭。

  這里有一些可以幫助你復習基礎知識的規則:

   建立一個清晰的層次結構

   注意文本對齊方式

   限制字體的字號數量、類型和顏色

   必要時充分地利用空白

  8,笨拙的表單

  有的時候你會需要向你的用戶要一些信息,這本身很好。

然而,這并不是說你可以為他們提供一個很長,很浪費時間的表單。

重復地要求相同的信息也不是一個好主意。

只向用戶要最少量的必要信息,并且不要忽視表單的跨瀏覽器樣式。

  好的表單交互體驗來自于清晰性、簡潔性和一致性。

  這里有一些小貼士:

   強調需要的字段

   必要時顯示進度

   提供提示

   注意字段的長度

   使用先進的工具來定制表單元素

  9,沒有用戶反饋和數據的抄襲

  從別人那里獲得靈感并不一定是件壞事,但如果你這樣做,你需要確保你手頭有正確的反饋和數據,以確保你在為你的目標受眾提供真正的設計價值。

  ▲ 案例示范

  10,顯著的不一致性

  在一定程度上風格可以混搭的。

然而,如果整體效果成了一個巨大的,丑陋的視覺沖突,那么還是建議回到繪圖板并重新開始。

  好的交互設計是具有一致性的。

它使用戶更好地理解事物是如何工作的,讓用戶在使用一個網頁時,感覺到他們在控制局面,以及提高他們的工作效率。

雅各布尼爾森說:用戶的期望更多地被證實是正確的,他們就會越覺得他們在控制系統,并會更加喜歡它。

  ▲ 案例示范

  11,太多的動效

  偶爾使用的交互式動畫可以提升你的網站內容。

然而,讓你的頁面負擔一個又一個瘋狂的動效,會讓你的用戶感覺到有點像是進入了在線瘋人院里,甚至更糟糕的東西。

  下面這個網站是談到瘋狂設計時我一定會加冕為冠軍的,我可以定下個挑戰,你在看到它時有沒有辦法不感到精神錯亂!

  ▲ 案例示范

  12,追逐趨勢

  保持一點時髦是很讓人高興的。

然而,花時間去追逐最新的流行語和交互設計風格,你最終會得到一個網站,它閱讀起來就像是陳詞濫調。

如果可以的話,你要敢于不同。

  交互設計四種正確設計的方式

  所以,以上便是我收藏的我最討厭的交互設計錯誤。

下面是一個便利的小列表,以提醒你如何用正確的方式設計!

  1)目標驅動。

不要為了添加效果而添加效果。

不要選擇某個調色板,導航欄,或者圖標僅僅因為你認為它看起來不錯。

試試著眼在最終目標上。

你想讓你的網站達到什么目標?一旦你已經確定了那個目標,那么你很有可能就有了一個關于你應該使用什么樣的交互設計的好主意。

  2)記住要有人情味。

如果你屬于藝術型(我們不都是么),那你面對的誘惑是去創造美麗的東西,一些優秀的,一些有人從未做過的事。

然而,如果沒有人創建過和使用過,可能有一個很好的原因就是,它們確實沒用。

記住,網站的訪客都是人類。

你創造出旨在能直接吸引他們的東西。

  3)保持一致性。

是的,網站本身應該是很令人驚嘆的。

然而,網站也應該需要正常可用。

你會有需要遵守某些設計慣例,以使網站易于瀏覽和理解。

不要為了與眾不同而違背常理。

相反,接受你將需要實現一定的規則的事實,能幫助你的用戶輕松地訪問你的網站。

  4)測試測試再測試。

如果你發現任何疑問,就進行測試!有很多用戶研究工具可以幫助你發現在產品中用戶受困或者分心的地方。

a / b測試,分析眼動跟蹤數據,或者是直接讓你的客戶,同事和朋友嘗試你的新設計。

沒有什么比真正的反饋更有價值,并且幾乎沒有一個更好的方法能如此改進你的交互設想。

版權聲明:本文由 泥盼香 整理編輯。

原標題:網頁設計和交互設計,交互設計師網站

轉載注明出處:http://www.dn9ww09s.icu/fault/12320.html

文章評論

    共有條評論來說兩句吧...

    用戶名:

    驗證碼:

作者推薦

  • 手機系統重裝大師,重裝大師

    手機系統重裝大師,重裝大師 相關圖片黑鯊裝機大師教程隨著互聯網上的人越來越多,在線重裝主機的軟件種類也越來越多,那么哪個是最好的系統重裝主機呢?接下來,小編將為您帶來最好的重裝高手進行對比分析,使用...

  • 無線網卡損壞的表現,如何確定無線網卡是否損壞

    無線網卡損壞的表現,如何確定無線網卡是否損壞 相關圖片win10適配器wlan不見了如何知道無線網卡是否損壞?如何知道網卡是否損壞?近日,有朋友問小編怎么知道網卡是否壞了。小編笑了,沒說話。其實,如何知道無線網卡壞了很簡單。只需...

  • 墻涂鴉,涂鴉墻怎么做

    墻涂鴉,涂鴉墻怎么做 相關圖片兒童涂鴉墻小編一直想有一堵屬于自己的涂鴉墻,可以在墻上自由地寫下自己的心情,發泄自己的感情。現在,就用煙花來達到這個效果。下面是用煙花制作涂鴉墻的過程1。首先,創建...

  • 硬盤壞道,磁盤有壞道

    硬盤壞道,磁盤有壞道 相關圖片硬盤壞道會怎么樣昨晚,一個鄉下人來看我。當時,我正在為公司的筆記本電腦安裝一個系統。當我使用PE進入系統時,它非常慢。所以我說電腦磁盤不好。一定有不好的辦法。否則,怎...

  • 自學交互設計,交互設計自學網站

    自學交互設計,交互設計自學網站 相關圖片交互設計需要學編程嗎想自學互動設計的同學,你們的好處如何!今天翻譯的@iriole,從什么是交互設計/常見的交互設計方法/日常任務和交付物/易于使用的設計工具/書籍等方面,我從一...

  • usb3.0兼容usb2.0嗎,usb3.1兼容3.0嗎

    usb3.0兼容usb2.0嗎,usb3.1兼容3.0嗎 相關圖片usb3.0USB3.0與2.0兼容嗎?USB3.0是USB2.0的升級版本,USB3.0與USB2.0完全兼容。但前提是你的電腦主板必須支持USB3.0。如果您的計算機設怎么看usb是2.0還是3.0...

  • qq面板背景,qq面板背景怎么設置

    qq面板背景,qq面板背景怎么設置 相關圖片QQ背景設置使用歷史面板創建一個連續的背景對新手朋友很有幫助。讓我們以舊門為笑柄。選擇a并按Ctrl Alt D重置新的a。調用B將B移動到適當的位置,并按shift 10CAD背景設置黑色...

  • win7系統,win8系統

    win7系統,win8系統 相關圖片如何自己重裝系統win7從2016年到現在已經半年了。您想知道2016win7系統的列表是否已發布?現在,讓我們有一個關于2016win7系統編號1:Ghost win7 x64 36xp系統升級win7...

  • 繪畫小技巧,繪畫的基本技巧

    繪畫小技巧,繪畫的基本技巧 相關圖片繪畫技巧方式有哪些這幾天,我們都在玩flash游戲,以我的業余水平娛樂自己,我得慢慢磨。半年過去了,我還沒做完。但是現在,有時間做你喜歡的事情是很好的,本教程主要是總結一...

  • pewindows什么意思,windows pe模式

    pewindows什么意思,windows pe模式 相關圖片win10 pe什么是Windows PE?我相信許多電腦老手對此有疑慮。他們好像很熟悉。Windows PE是一個新系統嗎?實際上,今天的編輯器將告訴您什么是Window swin2003pe是什么系統...

熱評文章

  • u盤裝系統教程圖解,u盤大師裝系統教程

    u盤裝系統教程圖解,u盤大師裝系統教程 相關圖片u盤裝系統教程win7現在很多人不知道如何在U盤上安裝系統。有時他們只是在安裝系統時死亡。他們只能使用CD和U盤來安裝系統。如果做不到,你只能帶著它去電腦修理店為你安裝,這會...

  • 旋轉地球動畫,做旋轉的地球動畫

    旋轉地球動畫,做旋轉的地球動畫 相關圖片地球轉動畫焰火使地球自轉生動活潑。本教程主要練習遮罩和動畫原稿的應用。少說,看看實際效果:1。雙擊任務欄2右下角的時間。打開“日期和時間屬性”對話框后,按Alt prin月球繞...

  • office2010如何下載,office2010在哪下載

    office2010如何下載,office2010在哪下載 相關圖片office在哪下載Office2010官方下載是許多計算機用戶一直要求的辦公軟件。使用Office2010官方下載,不僅可以給工作帶來更大的便利,而且可以讓人們愛上它的清新風格。如何下載office...

  • 怎么做系統u盤,系統u盤怎么裝系統

    怎么做系統u盤,系統u盤怎么裝系統 相關圖片沒有u盤怎么重裝系統U盤系統,你已經明白了。也許你們都知道U盤系統。實際上,U盤系統無法安裝。你聽說過U盤系統嗎?你有一些問題。讓小編告訴你,U盤系統是安裝U盤系統前的高科...

  • 基礎工作小助手app下載,英語零基礎自學app軟件

    基礎工作小助手app下載,英語零基礎自學app軟件 相關圖片零基礎學英語的方法app我不知道你是否遇到過這種情況。當你制定一個設計方案,并愉快地向開發人員解釋該方案的理念和創意時,開發人員突然說:這個方案無法實現,然后你就一點...

  • 電腦一鍵重裝后黑屏,一鍵重裝系統失敗黑屏

    電腦一鍵重裝后黑屏,一鍵重裝系統失敗黑屏 相關圖片系統重裝失敗無法開機360一鍵重裝后的黑屏呢?今天系統重新安裝后,很多網友都遇到了黑屏問題。原來,電腦系統出了問題。現在,重新安裝系統后,他們又遇到了黑屏。他們不知道...

  • 六邊形元素,六邊形元素構成

    六邊形元素,六邊形元素構成 相關圖片不規則六邊形善用基本造型,創意靈感不可或缺。此前,騰訊設計師金小燕曾用簡單的圓、正方形和三角形舉例,并借助形狀本身的特點創造性地加以運用,做出了快速有效的貢獻。今...

  • 電腦老是自動重啟,電腦關機后自動重啟

    電腦老是自動重啟,電腦關機后自動重啟 相關圖片電腦開機后進不了系統如果計算機總是自動重新啟動,我該怎么辦?計算機總是自動重新啟動的原因有很多。讓我們看看是什么導致計算機自動重新啟動。我希望它能幫助你找出問題并...

  • 畫吧繪制Q版人物,Q版畫

    畫吧繪制Q版人物,Q版畫 相關圖片Q版步驟互聯網上經常使用一系列的圖標,特別是Q版的可愛風格圖標,我們都非常喜歡。今天我們要用煙火畫出Q版電視圖標的思路:仔細看電視是一個長方體。我們最多能看到三面,前...

  • 電腦屏幕一直閃爍怎么解決,電腦屏幕閃爍

    電腦屏幕一直閃爍怎么解決,電腦屏幕閃爍 相關圖片電腦顯示屏老是閃屏怎么解決計算機用戶總是需要面對顯示屏。如果電腦屏幕閃爍或晃動,會讓用戶很快感到疲倦。因此,編輯建議,當遇到電腦屏幕閃爍或抖動時,要及時解決,以免...

關注微信

变脸官网查询