92国产精品视频_亚洲a级在线观看_国产精品电影观看_国产精品免费观看在线_精品伊人久久97_亚洲人成在线观_尤物九九久久国产精品的特点_成人激情在线播放_成人黄色大片在线免费观看_亚洲成人精品久久久_久久免费视频在线观看_久久精品国产一区_国产一区二区三区18_亚洲欧美中文字幕在线一区_日韩美女中文字幕_日韩视频免费在线

首頁

界面設計:Web3場景下,大屏設計中的用戶體驗要點解析

杰睿

73e3b0a4-2ff5-4175-beb1-2d4510ce87bc.png

d65a7188-3597-4010-9533-c1bb1e02b796.png

在傳統互聯網產品中,數據看板和儀表盤是常見的管理工具。而隨著 Web3 技術的發展,鏈上行為、資產狀態、合約執行等信息變得越來越復雜,如何可視化地理解這些動態數據,成為產品設計中的新挑戰。
在這一背景下,數據大屏逐漸成為 Web3 項目方、平臺運營方、審計安全機構等角色的重要信息樞紐。但在實際設計過程中,許多大屏項目容易陷入“炫酷外觀”而忽略了核心交互體驗。
本文將從交互設計的角度,探討 Web3 場景下的大屏設計應關注哪些用戶體驗要點,避免“看上去很厲害,卻沒人真正在用”的設計誤區。

一、Web3應用為何需要大屏?

Web3 應用天然擁有強數據屬性:去中心化交易、流動性池、區塊鏈瀏覽器、智能合約調用……背后都對應著高頻、高維度、鏈上鏈下混合的數據系統。
大屏在 Web3 中的主要使用場景包括:
鏈上運營監控:例如 DEX 交易量、TVL 變化、用戶活躍趨勢
安全審計看板:異常交易預警、地址聚集行為識別
鏈級數據展示:Gas 消耗趨勢、區塊出塊速度、礦工分布等
多鏈資產管理:跨鏈橋資產流通圖、跨鏈交易流向展示
這些場景中的共通點是:數據變化快、維度多、使用者需要“實時看清”并“快速判斷”。這也是大屏發揮價值的關鍵。

二、Web3大屏設計的5個核心用戶體驗要點

  1. 可讀性優先于炫酷感
Web3 的數據普遍較為抽象,如交易哈希、錢包地址、Gas 費用、TVL等,對非專業用戶甚至部分運營者而言并不直觀。
在這種背景下,大屏首要設計目標是讓用戶“看得懂”,而不是制造視覺噱頭。
設計建議包括:
使用足夠大的字號和清晰的字體(避免細線體在大屏上模糊)
色彩控制在 2~3 個主色 + 層級灰色,避免過多亮色干擾焦點
圖表需具備必要的坐標軸、單位標注、異常標記,不應純粹裝飾化
簡潔比花哨更重要,清晰比動效更關鍵。

  1. 實時感知與狀態提示
Web3 的鏈上數據具有強實時性,許多核心指標在數分鐘內可能出現劇烈波動。因此,大屏必須能體現“當前狀態”以及“更新節奏”。
建議包括:
明確標出“數據更新時間”,讓用戶知道當前信息的時效性
對關鍵變化支持動效強調,如箭頭上揚/下降、數值閃動提醒等
異常狀態顏色需與正常狀態明確區分(避免“全綠”或“全藍”)
此外,設計中應盡量避免讓用戶懷疑數據是否卡住了,這會極大削弱其對大屏的信任度。

  1. 異常可感知,支持預警反應
大屏不只是展示,更應該幫助用戶“識別風險”或“發現機會”。
在 Web3 應用中,這種“感知”尤為重要,比如:
某地址在短時間內發生大量交易 → 潛在惡意行為
某資產流動性短時間驟降 → 潛在清算風險
合約調用量瞬時異常上升 → 可能被攻擊或刷單
設計中可引入以下機制:
顏色警示(如紅、橙色信號)
簡潔文案說明(如“交易量驟增 300%”)
可展開詳情但不跳轉頁面,降低閱讀負擔
將這些機制融入 UI 組件,可以極大提升大屏的實用性。

  1. 信息層次清晰、模塊布局可讀
由于大屏往往信息密集,如何組織信息成為交互設計的核心難點。
推薦的分層方式:
第一層:核心概覽指標(如總交易量、活躍地址、Gas趨勢)
第二層:分區域信息塊(如按鏈分類,或按用戶/合約分類)
第三層:詳細趨勢圖/交易列表等可拓展內容
使用模塊化的卡片布局、留白區分信息塊,可以幫助用戶在幾秒內抓住重點,避免“眼花繚亂”的閱讀體驗。

  1. 可維護、可擴展、可適配
Web3 數據結構在不斷演變:新增協議、新增鏈、新增地址標簽……這就要求大屏具備良好的可維護性。
設計策略包括:
所有數據組件可復用,如“標準圖表組件”、“警示模塊”、“K線區塊”
UI 布局具備適應不同分辨率的彈性(如1080p/4K/LED拼接屏)
盡量使用“數據結構驅動的渲染邏輯”,而非固定死圖布局
在設計前期明確這些要求,可以大幅降低后期重構成本。

 
Web3的大屏設計,不是為了炫技、也不是為了迎合形式,而是為了幫助人們在復雜數據中看清趨勢、發現問題、做出反應。
它的真正價值在于:
降低理解門檻
提升監控效率
提供可視化決策支持
 
 
在這個數據密集、變化迅速的領域,交互設計師的任務,就是為用戶建立起這座“可感知的橋梁”。
 
如果你正在設計或評估一塊 Web3 場景下的大屏,不妨從以上幾點出發,重新審視它是否真正服務了使用者的體驗,而不僅僅是滿足了展示的需求。
如果你有正在推進的 Web3 數據大屏項目,歡迎留言交流你的設計思路與挑戰,我也會持續更新關于 Web 應用與交互設計的專業觀察。
 
蘭亭妙微(m.skdbbs.com )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的大數據可視化界面設計、B端界面設計、桌面端界面設計、APP界面設計、圖標定制、用戶體驗設計、交互設計、UI咨詢、高端網站設計、平面設計,以及相關的軟件開發服務,咨詢電話:01063334945。我們建立了一個微信群,每天分享國內外優秀的設計,有興趣請加入一起學習成長,咨詢及進群請加藍小助微信ben_lanlan

從實習生到高級產品設計師。職業階梯不會告訴你不同職業層級之間的差異

杰睿

成熟的組織會使用職業階梯來評估員工是否超出工作預期并做好晉升的準備。這些階梯通常涵蓋多個技能領域,能夠精準地指示員工是否接近晉升,或者是否應該專注于提升某些領域。

去年第 12 集中,我介紹了設計師職業階梯的基礎知識。

雖然職業階梯能夠很好地展現各個層級之間的差異,這對于職業生涯剛剛起步的設計師來說非常有幫助,但它并不能涵蓋我們工作的方方面面。職業階梯并不能解釋設計的定義在每個層級是如何演變的,設計工具與其他活動所占時間的比例是如何變化的,也無法解釋每個層級的一對一會面有何不同。

在本文中,我將從不同尋常的角度來審視設計師的職業層級。我將探討大多數職業階梯圖中未涵蓋的各個層級之間的一些真正差異。為了使比較更具條理,我將我的思考分為七個主要方面:

  • 戰略思維
  • 雇傭
  •  設計的定義
  • 設計過程
  • 項目的范圍和模糊性
  •  工具
  • 一對一會議

 戰略思維

低級別設計師與戰略幾乎沒有共同點,這應該不足為奇。對于實習生、初級設計師,甚至中級產品設計師來說, “戰略”這個詞可能有點令人畏懼或神秘。戰略是否真的在某個設計師無法進入的秘密房間里進行?

一點也不。

戰略只是提前規劃而已。

制定計劃而不只是做出反應。

對于設計師來說,戰略思維可能意味著在季度規劃期間更多地參與制定 OKR,通過設計思維或設計沖刺等設計方法推動新舉措的創新,并在設計過程的不同階段提出更好的問題,以更好地了解用戶、利益相關者和同行,從而提供帶來積極變化的東西。

《用戶體驗生存指南》的 Miranda Slayter最近發表了一篇關于設計師如何開始戰略思維的精彩短文:成為更具戰略性的設計師的第一步

現在讓我們來看看職業階梯的每個層級是什么樣的:

將顯示縮放圖像
戰術戰略范圍代表了設計師整個職業生涯中設計戰略方法的演變。

實習生

作為一名實習產品設計師,你很可能會被告知需要做什么,而且內容可能比較詳細,但通常足以讓你理解原因,無需深入探討,也不會讓你感到不知所措。因此,你的工作方式幾乎完全基于策略,在這個級別上這完全沒問題。

青少年

作為初級產品設計師,你仍然主要專注于執行產品經理或更資深的設計師交辦的任務。策略設計目前還不在你的考慮范圍之內,你應該更專注于提升其他領域,例如用戶研究、視覺設計、交互設計和協作。

中級

作為一名中級產品設計師,你開始進行戰略性思考,并盡早提出問題。我們為什么要這樣做?這是解決客戶痛點的最佳方法嗎?這與我們作為一個組織正在努力實現的宏偉目標如何契合?現在是時候進行思維轉換了,不要再對“戰略”這個詞感到恐慌,開始更多地參與優先級討論。

高級

作為一名高級產品設計師,你被期望成為產品經理、技術主管和其他產品團隊成員的戰略合作伙伴。你需要從不同的角度審視問題,并從全局視角來判斷什么是最重要的。你需要思考你的決策如何影響組織的長期發展。為塑造這一長期發展格局做出貢獻,這種責任感正越來越頻繁地出現在你的日程表上。

雇傭

隨著你的成長,你的工作圈子也在不斷變化。因為當你成為中級設計師時,你的角色會發生改變,你開始做的事情與實習生或初級設計師時略有不同。因此,為了做好你的工作,你最終不得不與組織中截然不同的一群同事交流。

最顯著的變化發生在個人貢獻者晉升為經理之后。從這一刻起,他們應該花更多時間與利益相關者和高管團隊成員相處,而不是與直接下屬相處。如果你渴望在未來達到這一級別,請記住這一點。

不過,本文我將僅關注 IC 角色。讓我們來探討一下實習生、初級、中級和高級設計師之間的互動是如何演變的。

將顯示縮放圖像
參與度圖表展示了設計師如何與職業生涯不同階段的同行互動。

實習生

作為一名實習設計師,你應該至少有一位工作伙伴:你的伙伴,通常是更資深的設計師,幫助你解決這份工作的各個方面。此外,你還處于與工程師和產品團隊成員進行跨職能合作的階段。

青少年

作為一名初級設計師,你能夠自信地與工程師和產品經理討論你的任務、想法和成果。你可以與產品的最終用戶溝通,或借鑒其他團隊(例如用戶研究團隊、客戶支持團隊或商務團隊)收集的洞見。你仍然與一位(或多位)資深設計師保持著良好的關系,并從他們身上學習最多。

中級

作為一名中級設計師,你仍然需要與團隊中的工程師和產品經理密切合作。如果你的產品依賴于組織生態系統中的其他環節,你可能偶爾需要與其他產品團隊的工程師溝通。隨著你越來越多地參與制定戰略并產生業務影響,你開始與業務利益相關者互動。你對規劃用戶研究活動和與用戶溝通充滿信心。

 高級

作為一名高級設計師,你是跨職能協作的大師。你與來自各個部門的人員合作,從工程部門到銷售部門,再到高管。你經常扮演偵探的角色,在組織內外各個地方尋找完成任務所需的信息。你在與利益相關者討論戰略時充滿自信。當然,你仍然與產品團隊成員保持著密切的合作。此外,作為一名經驗豐富的同事,你可能會成為實習生或初級設計師的導師,與他們分享你寶貴的知識。最終,你會變得非常橫向發展。

設計的定義

對于我們大多數人來說,開啟產品設計師職業生涯的動機大致可以概括為以下幾個方面。要么是我們希望通過設計讓世界變得更美好,要么是我們在童年時期就擁有藝術細胞(但還不足以成為真正的視覺藝術家),要么是我們希望成為數字領域的創客,但并不一定精通編程。

無論你的動機是什么,只要你在這個行業待得夠久,你就會注意到,你對產品設計師的角色以及整個設計行業的看法都在發生變化。設計的定義也是如此。

將顯示縮放圖像
設計師的職業生涯中,關注點不斷演變,并決定了設計的定義。起初,設計師主要關注視覺方面,但隨著他們的成長,他們開始注意到策略、解決業務問題和推動創新的重要性。

實習生

作為一名實習設計師,你的大部分時間都會花在 Figma 等設計工具上。你會被告知需要做什么,并且(希望)你能按照說明創建模型、線框圖、圖表和原型,供你的工程團隊用來構建功能。

您對設計的定義很可能非常接近:

設計決定了它的外觀,并為工程團隊為我們的用戶構建功能提供了有用的指導。

 青少年

作為一名初級設計師,你仍然會把大部分時間花在設計工具上,與組件搏斗,努力將它們以最易用、最美觀的方式布局,然后再交給工程團隊。然而,你開始質疑自己的任務,并與用戶溝通。你越來越多地思考你和你的團隊為什么要開發這些產品。你也開始思考你的決策會如何影響用戶的生活。

您對設計的定義有點接近:

設計是一種工具,通過美觀、優雅的面向客戶的界面實現良好的用戶體驗。

中級

作為一名積累了一定經驗的中級設計師,你開始意識到自己并非受雇于 Figma,僅僅是為了畫一些漂亮的矩形。你加入組織不僅是為了解決用戶的痛點,也是為了探索如何讓組織從設計中獲益。隨著你逐漸在戰術戰略層面上邁向戰略層面,你就能展現出對業務的深遠影響。

您對設計的定義現在非常接近:

設計以優雅且實用的方式結合了業務、用戶和工程的利益。

高級

作為一名經驗豐富、經驗豐富的高級設計師,你只需花費一小部分時間在 Figma 中移動矩形。你的大部分工作是探索客戶需求和業務問題,并找出其根本原因。此外,你還需要戰略性地思考哪些問題值得立即解決,以及如何以最大程度地發揮組織潛力的方式解決這些問題。在某些組織中,你可能負責推動創新,并與產品經理合作探索新產品和新服務的機遇。

你清楚地知道自己為什么被錄用,這也決定了你對設計的定義,很可能接近于:

設計是解決業務問題和推動創新的戰略組成部分,同時要牢記用戶的利益。

設計過程

“你的設計流程是怎樣的?”這類問題在設計崗位的面試中經常被問到。根據職位的資歷和面試官的經驗,答案會有所不同。經驗不足的設計師往往會嚴格遵循他們在設計大學課程或訓練營中學到的流程。經驗豐富的設計師嘗試過之后,就會知道事情并非那么簡單。

實習生

作為一名實習產品設計師,你被教導要做的首要任務是盡可能多地了解用戶的痛點。你需要識別用戶畫像,在同理心地圖上描繪他們的感受和想法,并開始思考潛在的解決方案。你需要寫下一些用戶故事,創建一個最小可行產品 (MVP),設計一個漂亮的原型,并為基于任務的可用性研究準備一個場景,以驗證你的解決方案的可行性和可用性。

從紙面上看,這似乎很棒,但有一個問題,你很快就會(但愿不會)以艱難的方式學到它。

青少年

作為一名初級產品設計師,你開始明白,你接到的每個項目都略有不同,有時沒必要把以前學到的理想設計流程的每個步驟都照搬過來。由于你經驗尚淺,獨立工作能力也相對較低,所以你負責的項目并不一定很復雜,很多決定都必須咨詢你的資深伙伴。

此外,您經常過快地進入解決方案領域,而沒有花足夠的時間去了解潛在的問題、客戶需求和用戶的痛點。

中級

作為一名中級產品設計師,你越來越適應獨自處理復雜度更高的項目。你已經意識到設計流程需要相當靈活,并根據每個項目進行個性化調整。你越來越擅長同時處理調研、寫作、跨職能協作以及多個項目的像素工作。

你花在解決問題上的時間越來越少,而是先做各種練習來了解問題。

高級

作為一名高級產品設計師,你可以輕松地同時處理多個項目。你深知,理想的設計流程在紙面上看起來很棒,但在現實生活中卻行不通。它被發明出來只是為了教導新設計師嗎?也許吧。如果是,那它肯定有問題,而且很遺憾沒有人告訴他們,一旦入職,設計流程將會大不相同。但你已經度過了這個難關,并且意識到,你花在理解問題上的時間越多,成功完成項目的機會就越大。

所以,你經常扮演偵探的角色,追蹤利益相關者、用戶、客戶、工程師和客戶成功代表,以了解全局并做好你的工作。然后,或者在此期間,你會寫下這個問題,試圖將其分解并提煉其核心。你會邀請非設計師與你一起進行創意構思。之后,你會使用你最喜歡的設計或 Vibe 編碼工具來創建原型,稍后再與你的客戶和用戶進行驗證。交接過程是隱形的,但你已經從本文中了解到了這一點。

項目的范圍和模糊性

我在之前的一篇文章中討論過這個領域的一些內容,主要關注為什么在晉升決策中,工作經驗的年限并不重要。

項目的范圍和模糊性程度與設計師的經驗及其獨立性高度相關。經驗不足的設計師更有可能被分配到范圍較小、模糊性較低的項目,因為他們尚未準備好獨立做出重要決策,在類似項目上工作的時間也不夠長,并且仍在學習如何提出正確的問題。

將顯示縮放圖像
實習生和初級設計師位于“低模糊性,小范圍”象限,而中級和高級設計師則位于“大范圍,高模糊性”象限。高級設計師能夠處理高度復雜且不明確的項目,而實習生則從簡單明確的任務開始。

實習生

作為一名實習產品設計師,你被分配到的項目模糊性較低,范圍也相對較小。原因很簡單。這些只是你在這個職位上的初步嘗試,你仍在學習這門手藝。你不知道在哪里尋找答案,也不知道如何提出好的問題來找到答案。因此,你需要資深同事的悉心指導才能完成你的任務。

青少年

作為一名初級產品設計師,你現在邁出了更加自信的步伐,但你仍然像個蹣跚學步的孩子。范圍和模糊性與上一個級別大致相同。也許范圍在規模上會更大一些,但就產品經理提出的需求而言,這些需求相當明確,沒有太多需要探索的地方。不過,你可以開始協助你的產品經理和更資深的同事進行一些產品探索活動。

中級

作為一名中級設計師,你開始更加獨立地工作,并且在沒有太多指導的情況下做出重要的決策。你被分配的項目越來越復雜,也越來越不明確。你需要進行大量的研究和探索練習,才能找到完成項目的答案,而這些項目的規模也更大,持續時間也更長。

高級

作為一名高級產品設計師,您能夠輕松地做出重要的設計決策。您負責的項目往往涉及范圍廣泛,且非常模糊。如果您負責產品的很大一部分、整個產品,甚至多個小型產品,這并不奇怪。

向利益相關者和組織內的其他成員尋求答案是你的生計所在。你經常扮演偵探的角色,并且非常擅長串聯各種線索。有時你需要處理的只是一些零散的信息,但你經驗豐富,并且擁有強大的自主權,能夠充分利用這些信息。

你是產品經理和技術主管的戰略合作伙伴,你們共同推動產品發現。有人會說,你在尋找答案方面比其他人高出一籌,因為你正在負責的項目甚至還沒有被發現。而你和產品三人組中剩下的兩個人,就是為了發現這些機會。

工具

過去幾年,我觀察到設計師中存在一種令人擔憂的趨勢,他們過于注重工具。我并非唯一一個。設計師兼作家 Artiom Dashinsky 創造了“Figmaism”一詞,指的是我們行業中過于關注工具和設計的視覺層面的討論,導致我們對自身角色可能產生的影響理解膚淺。

大約一年前,在一次采訪中,我問了來自

用戶體驗生存指南

她對這一趨勢有何看法?她非常準確地指出,經驗越少的設計師,就越傾向于沉迷于工具和作品的視覺效果。

雖然工具對我們的工作至關重要,但它們并非永恒不變。什么是永恒不變的?是我們的技能,例如解決問題、協調、同理心,以及從無到有創造出有意義的事物。

將顯示縮放圖像
工具圖表說明了隨著經驗的增加,對設計工具的迷戀如何降低。

實習生

作為一名實習產品設計師,你大約 90% 到 95% 的時間都花在 Figma 上。它并非你真正喜歡的工具,而是一款近年來占據市場主導地位的標準應用。你對產品設計的興趣是從 Figma 開始的嗎?很有可能。剩下的 5% 到 10% 的時間則花在文檔編輯器上,你會在深入研究解決方案之前嘗試分解問題,而這很可能是你仍在學習的內容。

青少年

作為一名初級產品設計師,你仍然非常注重視覺設計,因此你熱愛 Figma,并努力掌握它的每一個工作流程、插件和創意技巧。你大概會花 80% 的時間在這個工具上。其余的時間則分配給你選擇的文檔編輯器以及各種研究和分析工具,例如 Hotjar、Amplitude 和 Dovetail。

中級

作為一名中級產品設計師,你開始意識到視覺效果并非這份工作的全部,所以你減少了使用 Figma 等設計工具的時間。我估計你大約有 50% 的時間用在了 Figma 上。剩下的一半時間則用于溝通、寫作、繪制圖表以及其他活動,以了解客戶、企業的需求和用戶的痛點。你越來越多地使用分析工具。

此外,您開始對未來的設計工具感興趣,例如 Lovable、v0 和 Replit(許多人稱之為“氛圍編碼”應用程序),并試圖弄清楚如何將它們融入到您的工作流程中。

高級

作為一名高級產品設計師,你可能有四分之一的時間花在設計工具上。與你作為實習生或初級設計師的經歷相比,這個部門發生了巨大的變化。你不再過多地探索視覺方面,因為你知道,除了用戶界面之外,用戶體驗還有許多更重要的方面。

您可能已經測試了一些氛圍編碼工具,并將它們納入設計過程的構思和原型制作階段。

您的大部分時間都花在三類工具上:白板(FigJam、Miro、Lucid)(用于主持研討會);文檔編輯器(Google Docs、Microsoft Word、NotebookLM)(用于經常戴著偵探的帽子進行大量采訪);演示文稿編輯器(PowerPoint、Google Docs、Figma Slides)(用于創建幻燈片,幫助您與利益相關者和商業團隊溝通您的重要想法)。

一對一會議

定期與你的直線經理會面對你們雙方都至關重要。對他們來說,這需要評估你在工作和職業生涯中是否取得了進步。他們也需要這些會議來討論潛在問題,并提供幫助來解決這些問題。對于你來說,作為一名設計師,在這些會議上討論的需求和主題會根據你在職業階梯中所處的位置而有所不同。近年來,我在不同的公司領導幾位實習生和初級設計師時,也觀察到了這一點。這些會議會有什么不同呢?讓我們來一探究竟。

將顯示縮放圖像
一對一會議中討論的時間視角因經驗水平而異。實習生和初級設計師會尋求針對當前日常工作的反饋和指導,因此他們不會著眼于幾周后的事情。中級設計師開始進行戰略性思考,因此他們會討論幾個月內將要發生的事情。高級設計師則非常注重戰略性,他們的眼光會遠超下個季度。

實習生

作為一名實習產品設計師,你與經理開會的時間幾乎百分之百都集中在你的工作上,這會影響你的成長。當然,你也在與他們建立關系,討論一些與工作無關的話題,以保持良好的溝通水平。但由于你經驗相對不足,你需要大量的反饋和工作指導。

青少年

作為一名初級產品設計師,您的主要需求與以前一樣:您需要工作反饋和指導,因此在大多數時間里,您將展示您的日常項目并詢問是否以正確的方式完成。

首次晉升后,你渴望更多,所以開始對中層職位感興趣。它和你現在的職位有什么不同?我需要學習和實現哪些目標才能盡快晉升?你的直線經理可能會為你設定具體的目標,指導你獲得晉升。因此,你們的一對一會面可能會用來討論這些目標并檢查進展情況。

中級

作為一名中級產品設計師,你變得越來越獨立,這會影響你與直線經理的一對一會議。你不再像以前那樣詳細地討論你目前的工作。戰略思考越來越頻繁地出現在你的工作中,所以你很可能討論的不是團隊下周的工作,而是下個季度的工作。

你開始與來自不同團隊和部門的人員更緊密地合作完成工作,因此你會尋求建議,了解如何與非設計師建立聯系、與利益相關者互動,以及如何與商業團隊溝通,以便他們理解你(劇透:他們并不關心你的設計系統、代幣或雙鉆流程)。你很可能已經設定了一些季度目標,并正在努力實現這些目標以保持持續增長。

高級

作為一名高級產品設計師,你比以往任何時候都更加注重戰略。你很少需要花半個小時與你的經理溝通你的日常項目(如果是這樣,那就有問題了,這叫做微觀管理,而問題要么是你的直線經理,要么是整個組織)。你更愿意在一對一的會議中兼顧兩個主要主題:戰略展望和領導力。

如果你是一位資深設計師,并希望進一步發展,那么你面前有兩條路可走:IC 和管理層。兩者都需要一定的領導能力。如果你選擇 IC 這條路,你可能沒有直接下屬,但你將以身作則,監督良好實踐的實施。你很可能會花費大量時間與你的經理一起準備擔任這些職位。

此外,如果您已經領導一個設計師團隊但尚未獲得正確的頭銜(這在該行業中很常見),您可以報告他們的進展和團隊的戰略舉措。

剩下的時間,你用來討論戰略。你的產品團隊(如果你負責多個產品,則多個產品團隊)下個季度的重點是什么?未來6到12個月,你還計劃探索和開發哪些產品?你的經理應該幫助你尋找資源和人脈,以實現戰略目標。

從實習生到高級產品設計師。職業階梯不會告訴你不同職業層級之間的差異

杰睿

成熟的組織會使用職業階梯來評估員工是否超出工作預期并做好晉升的準備。這些階梯通常涵蓋多個技能領域,能夠精準地指示員工是否接近晉升,或者是否應該專注于提升某些領域。

去年第 12 集中,我介紹了設計師職業階梯的基礎知識。

雖然職業階梯能夠很好地展現各個層級之間的差異,這對于職業生涯剛剛起步的設計師來說非常有幫助,但它并不能涵蓋我們工作的方方面面。職業階梯并不能解釋設計的定義在每個層級是如何演變的,設計工具與其他活動所占時間的比例是如何變化的,也無法解釋每個層級的一對一會面有何不同。

在本文中,我將從不同尋常的角度來審視設計師的職業層級。我將探討大多數職業階梯圖中未涵蓋的各個層級之間的一些真正差異。為了使比較更具條理,我將我的思考分為七個主要方面:

  • 戰略思維
  • 雇傭
  •  設計的定義
  • 設計過程
  • 項目的范圍和模糊性
  •  工具
  • 一對一會議

 戰略思維

低級別設計師與戰略幾乎沒有共同點,這應該不足為奇。對于實習生、初級設計師,甚至中級產品設計師來說, “戰略”這個詞可能有點令人畏懼或神秘。戰略是否真的在某個設計師無法進入的秘密房間里進行?

一點也不。

戰略只是提前規劃而已。

制定計劃而不只是做出反應。

對于設計師來說,戰略思維可能意味著在季度規劃期間更多地參與制定 OKR,通過設計思維或設計沖刺等設計方法推動新舉措的創新,并在設計過程的不同階段提出更好的問題,以更好地了解用戶、利益相關者和同行,從而提供帶來積極變化的東西。

《用戶體驗生存指南》的 Miranda Slayter最近發表了一篇關于設計師如何開始戰略思維的精彩短文:成為更具戰略性的設計師的第一步

現在讓我們來看看職業階梯的每個層級是什么樣的:

將顯示縮放圖像
戰術戰略范圍代表了設計師整個職業生涯中設計戰略方法的演變。

實習生

作為一名實習產品設計師,你很可能會被告知需要做什么,而且內容可能比較詳細,但通常足以讓你理解原因,無需深入探討,也不會讓你感到不知所措。因此,你的工作方式幾乎完全基于策略,在這個級別上這完全沒問題。

青少年

作為初級產品設計師,你仍然主要專注于執行產品經理或更資深的設計師交辦的任務。策略設計目前還不在你的考慮范圍之內,你應該更專注于提升其他領域,例如用戶研究、視覺設計、交互設計和協作。

中級

作為一名中級產品設計師,你開始進行戰略性思考,并盡早提出問題。我們為什么要這樣做?這是解決客戶痛點的最佳方法嗎?這與我們作為一個組織正在努力實現的宏偉目標如何契合?現在是時候進行思維轉換了,不要再對“戰略”這個詞感到恐慌,開始更多地參與優先級討論。

高級

作為一名高級產品設計師,你被期望成為產品經理、技術主管和其他產品團隊成員的戰略合作伙伴。你需要從不同的角度審視問題,并從全局視角來判斷什么是最重要的。你需要思考你的決策如何影響組織的長期發展。為塑造這一長期發展格局做出貢獻,這種責任感正越來越頻繁地出現在你的日程表上。

雇傭

隨著你的成長,你的工作圈子也在不斷變化。因為當你成為中級設計師時,你的角色會發生改變,你開始做的事情與實習生或初級設計師時略有不同。因此,為了做好你的工作,你最終不得不與組織中截然不同的一群同事交流。

最顯著的變化發生在個人貢獻者晉升為經理之后。從這一刻起,他們應該花更多時間與利益相關者和高管團隊成員相處,而不是與直接下屬相處。如果你渴望在未來達到這一級別,請記住這一點。

不過,本文我將僅關注 IC 角色。讓我們來探討一下實習生、初級、中級和高級設計師之間的互動是如何演變的。

將顯示縮放圖像
參與度圖表展示了設計師如何與職業生涯不同階段的同行互動。

實習生

作為一名實習設計師,你應該至少有一位工作伙伴:你的伙伴,通常是更資深的設計師,幫助你解決這份工作的各個方面。此外,你還處于與工程師和產品團隊成員進行跨職能合作的階段。

青少年

作為一名初級設計師,你能夠自信地與工程師和產品經理討論你的任務、想法和成果。你可以與產品的最終用戶溝通,或借鑒其他團隊(例如用戶研究團隊、客戶支持團隊或商務團隊)收集的洞見。你仍然與一位(或多位)資深設計師保持著良好的關系,并從他們身上學習最多。

中級

作為一名中級設計師,你仍然需要與團隊中的工程師和產品經理密切合作。如果你的產品依賴于組織生態系統中的其他環節,你可能偶爾需要與其他產品團隊的工程師溝通。隨著你越來越多地參與制定戰略并產生業務影響,你開始與業務利益相關者互動。你對規劃用戶研究活動和與用戶溝通充滿信心。

 高級

作為一名高級設計師,你是跨職能協作的大師。你與來自各個部門的人員合作,從工程部門到銷售部門,再到高管。你經常扮演偵探的角色,在組織內外各個地方尋找完成任務所需的信息。你在與利益相關者討論戰略時充滿自信。當然,你仍然與產品團隊成員保持著密切的合作。此外,作為一名經驗豐富的同事,你可能會成為實習生或初級設計師的導師,與他們分享你寶貴的知識。最終,你會變得非常橫向發展。

設計的定義

對于我們大多數人來說,開啟產品設計師職業生涯的動機大致可以概括為以下幾個方面。要么是我們希望通過設計讓世界變得更美好,要么是我們在童年時期就擁有藝術細胞(但還不足以成為真正的視覺藝術家),要么是我們希望成為數字領域的創客,但并不一定精通編程。

無論你的動機是什么,只要你在這個行業待得夠久,你就會注意到,你對產品設計師的角色以及整個設計行業的看法都在發生變化。設計的定義也是如此。

將顯示縮放圖像
設計師的職業生涯中,關注點不斷演變,并決定了設計的定義。起初,設計師主要關注視覺方面,但隨著他們的成長,他們開始注意到策略、解決業務問題和推動創新的重要性。

實習生

作為一名實習設計師,你的大部分時間都會花在 Figma 等設計工具上。你會被告知需要做什么,并且(希望)你能按照說明創建模型、線框圖、圖表和原型,供你的工程團隊用來構建功能。

您對設計的定義很可能非常接近:

設計決定了它的外觀,并為工程團隊為我們的用戶構建功能提供了有用的指導。

 青少年

作為一名初級設計師,你仍然會把大部分時間花在設計工具上,與組件搏斗,努力將它們以最易用、最美觀的方式布局,然后再交給工程團隊。然而,你開始質疑自己的任務,并與用戶溝通。你越來越多地思考你和你的團隊為什么要開發這些產品。你也開始思考你的決策會如何影響用戶的生活。

您對設計的定義有點接近:

設計是一種工具,通過美觀、優雅的面向客戶的界面實現良好的用戶體驗。

中級

作為一名積累了一定經驗的中級設計師,你開始意識到自己并非受雇于 Figma,僅僅是為了畫一些漂亮的矩形。你加入組織不僅是為了解決用戶的痛點,也是為了探索如何讓組織從設計中獲益。隨著你逐漸在戰術戰略層面上邁向戰略層面,你就能展現出對業務的深遠影響。

您對設計的定義現在非常接近:

設計以優雅且實用的方式結合了業務、用戶和工程的利益。

高級

作為一名經驗豐富、經驗豐富的高級設計師,你只需花費一小部分時間在 Figma 中移動矩形。你的大部分工作是探索客戶需求和業務問題,并找出其根本原因。此外,你還需要戰略性地思考哪些問題值得立即解決,以及如何以最大程度地發揮組織潛力的方式解決這些問題。在某些組織中,你可能負責推動創新,并與產品經理合作探索新產品和新服務的機遇。

你清楚地知道自己為什么被錄用,這也決定了你對設計的定義,很可能接近于:

設計是解決業務問題和推動創新的戰略組成部分,同時要牢記用戶的利益。

設計過程

“你的設計流程是怎樣的?”這類問題在設計崗位的面試中經常被問到。根據職位的資歷和面試官的經驗,答案會有所不同。經驗不足的設計師往往會嚴格遵循他們在設計大學課程或訓練營中學到的流程。經驗豐富的設計師嘗試過之后,就會知道事情并非那么簡單。

實習生

作為一名實習產品設計師,你被教導要做的首要任務是盡可能多地了解用戶的痛點。你需要識別用戶畫像,在同理心地圖上描繪他們的感受和想法,并開始思考潛在的解決方案。你需要寫下一些用戶故事,創建一個最小可行產品 (MVP),設計一個漂亮的原型,并為基于任務的可用性研究準備一個場景,以驗證你的解決方案的可行性和可用性。

從紙面上看,這似乎很棒,但有一個問題,你很快就會(但愿不會)以艱難的方式學到它。

青少年

作為一名初級產品設計師,你開始明白,你接到的每個項目都略有不同,有時沒必要把以前學到的理想設計流程的每個步驟都照搬過來。由于你經驗尚淺,獨立工作能力也相對較低,所以你負責的項目并不一定很復雜,很多決定都必須咨詢你的資深伙伴。

此外,您經常過快地進入解決方案領域,而沒有花足夠的時間去了解潛在的問題、客戶需求和用戶的痛點。

中級

作為一名中級產品設計師,你越來越適應獨自處理復雜度更高的項目。你已經意識到設計流程需要相當靈活,并根據每個項目進行個性化調整。你越來越擅長同時處理調研、寫作、跨職能協作以及多個項目的像素工作。

你花在解決問題上的時間越來越少,而是先做各種練習來了解問題。

高級

作為一名高級產品設計師,你可以輕松地同時處理多個項目。你深知,理想的設計流程在紙面上看起來很棒,但在現實生活中卻行不通。它被發明出來只是為了教導新設計師嗎?也許吧。如果是,那它肯定有問題,而且很遺憾沒有人告訴他們,一旦入職,設計流程將會大不相同。但你已經度過了這個難關,并且意識到,你花在理解問題上的時間越多,成功完成項目的機會就越大。

所以,你經常扮演偵探的角色,追蹤利益相關者、用戶、客戶、工程師和客戶成功代表,以了解全局并做好你的工作。然后,或者在此期間,你會寫下這個問題,試圖將其分解并提煉其核心。你會邀請非設計師與你一起進行創意構思。之后,你會使用你最喜歡的設計或 Vibe 編碼工具來創建原型,稍后再與你的客戶和用戶進行驗證。交接過程是隱形的,但你已經從本文中了解到了這一點。

項目的范圍和模糊性

我在之前的一篇文章中討論過這個領域的一些內容,主要關注為什么在晉升決策中,工作經驗的年限并不重要。

項目的范圍和模糊性程度與設計師的經驗及其獨立性高度相關。經驗不足的設計師更有可能被分配到范圍較小、模糊性較低的項目,因為他們尚未準備好獨立做出重要決策,在類似項目上工作的時間也不夠長,并且仍在學習如何提出正確的問題。

將顯示縮放圖像
實習生和初級設計師位于“低模糊性,小范圍”象限,而中級和高級設計師則位于“大范圍,高模糊性”象限。高級設計師能夠處理高度復雜且不明確的項目,而實習生則從簡單明確的任務開始。

實習生

作為一名實習產品設計師,你被分配到的項目模糊性較低,范圍也相對較小。原因很簡單。這些只是你在這個職位上的初步嘗試,你仍在學習這門手藝。你不知道在哪里尋找答案,也不知道如何提出好的問題來找到答案。因此,你需要資深同事的悉心指導才能完成你的任務。

青少年

作為一名初級產品設計師,你現在邁出了更加自信的步伐,但你仍然像個蹣跚學步的孩子。范圍和模糊性與上一個級別大致相同。也許范圍在規模上會更大一些,但就產品經理提出的需求而言,這些需求相當明確,沒有太多需要探索的地方。不過,你可以開始協助你的產品經理和更資深的同事進行一些產品探索活動。

中級

作為一名中級設計師,你開始更加獨立地工作,并且在沒有太多指導的情況下做出重要的決策。你被分配的項目越來越復雜,也越來越不明確。你需要進行大量的研究和探索練習,才能找到完成項目的答案,而這些項目的規模也更大,持續時間也更長。

高級

作為一名高級產品設計師,您能夠輕松地做出重要的設計決策。您負責的項目往往涉及范圍廣泛,且非常模糊。如果您負責產品的很大一部分、整個產品,甚至多個小型產品,這并不奇怪。

向利益相關者和組織內的其他成員尋求答案是你的生計所在。你經常扮演偵探的角色,并且非常擅長串聯各種線索。有時你需要處理的只是一些零散的信息,但你經驗豐富,并且擁有強大的自主權,能夠充分利用這些信息。

你是產品經理和技術主管的戰略合作伙伴,你們共同推動產品發現。有人會說,你在尋找答案方面比其他人高出一籌,因為你正在負責的項目甚至還沒有被發現。而你和產品三人組中剩下的兩個人,就是為了發現這些機會。

工具

過去幾年,我觀察到設計師中存在一種令人擔憂的趨勢,他們過于注重工具。我并非唯一一個。設計師兼作家 Artiom Dashinsky 創造了“Figmaism”一詞,指的是我們行業中過于關注工具和設計的視覺層面的討論,導致我們對自身角色可能產生的影響理解膚淺。

大約一年前,在一次采訪中,我問了來自

用戶體驗生存指南

她對這一趨勢有何看法?她非常準確地指出,經驗越少的設計師,就越傾向于沉迷于工具和作品的視覺效果。

雖然工具對我們的工作至關重要,但它們并非永恒不變。什么是永恒不變的?是我們的技能,例如解決問題、協調、同理心,以及從無到有創造出有意義的事物。

將顯示縮放圖像
工具圖表說明了隨著經驗的增加,對設計工具的迷戀如何降低。

實習生

作為一名實習產品設計師,你大約 90% 到 95% 的時間都花在 Figma 上。它并非你真正喜歡的工具,而是一款近年來占據市場主導地位的標準應用。你對產品設計的興趣是從 Figma 開始的嗎?很有可能。剩下的 5% 到 10% 的時間則花在文檔編輯器上,你會在深入研究解決方案之前嘗試分解問題,而這很可能是你仍在學習的內容。

青少年

作為一名初級產品設計師,你仍然非常注重視覺設計,因此你熱愛 Figma,并努力掌握它的每一個工作流程、插件和創意技巧。你大概會花 80% 的時間在這個工具上。其余的時間則分配給你選擇的文檔編輯器以及各種研究和分析工具,例如 Hotjar、Amplitude 和 Dovetail。

中級

作為一名中級產品設計師,你開始意識到視覺效果并非這份工作的全部,所以你減少了使用 Figma 等設計工具的時間。我估計你大約有 50% 的時間用在了 Figma 上。剩下的一半時間則用于溝通、寫作、繪制圖表以及其他活動,以了解客戶、企業的需求和用戶的痛點。你越來越多地使用分析工具。

此外,您開始對未來的設計工具感興趣,例如 Lovable、v0 和 Replit(許多人稱之為“氛圍編碼”應用程序),并試圖弄清楚如何將它們融入到您的工作流程中。

高級

作為一名高級產品設計師,你可能有四分之一的時間花在設計工具上。與你作為實習生或初級設計師的經歷相比,這個部門發生了巨大的變化。你不再過多地探索視覺方面,因為你知道,除了用戶界面之外,用戶體驗還有許多更重要的方面。

您可能已經測試了一些氛圍編碼工具,并將它們納入設計過程的構思和原型制作階段。

您的大部分時間都花在三類工具上:白板(FigJam、Miro、Lucid)(用于主持研討會);文檔編輯器(Google Docs、Microsoft Word、NotebookLM)(用于經常戴著偵探的帽子進行大量采訪);演示文稿編輯器(PowerPoint、Google Docs、Figma Slides)(用于創建幻燈片,幫助您與利益相關者和商業團隊溝通您的重要想法)。

一對一會議

定期與你的直線經理會面對你們雙方都至關重要。對他們來說,這需要評估你在工作和職業生涯中是否取得了進步。他們也需要這些會議來討論潛在問題,并提供幫助來解決這些問題。對于你來說,作為一名設計師,在這些會議上討論的需求和主題會根據你在職業階梯中所處的位置而有所不同。近年來,我在不同的公司領導幾位實習生和初級設計師時,也觀察到了這一點。這些會議會有什么不同呢?讓我們來一探究竟。

將顯示縮放圖像
一對一會議中討論的時間視角因經驗水平而異。實習生和初級設計師會尋求針對當前日常工作的反饋和指導,因此他們不會著眼于幾周后的事情。中級設計師開始進行戰略性思考,因此他們會討論幾個月內將要發生的事情。高級設計師則非常注重戰略性,他們的眼光會遠超下個季度。

實習生

作為一名實習產品設計師,你與經理開會的時間幾乎百分之百都集中在你的工作上,這會影響你的成長。當然,你也在與他們建立關系,討論一些與工作無關的話題,以保持良好的溝通水平。但由于你經驗相對不足,你需要大量的反饋和工作指導。

青少年

作為一名初級產品設計師,您的主要需求與以前一樣:您需要工作反饋和指導,因此在大多數時間里,您將展示您的日常項目并詢問是否以正確的方式完成。

首次晉升后,你渴望更多,所以開始對中層職位感興趣。它和你現在的職位有什么不同?我需要學習和實現哪些目標才能盡快晉升?你的直線經理可能會為你設定具體的目標,指導你獲得晉升。因此,你們的一對一會面可能會用來討論這些目標并檢查進展情況。

中級

作為一名中級產品設計師,你變得越來越獨立,這會影響你與直線經理的一對一會議。你不再像以前那樣詳細地討論你目前的工作。戰略思考越來越頻繁地出現在你的工作中,所以你很可能討論的不是團隊下周的工作,而是下個季度的工作。

你開始與來自不同團隊和部門的人員更緊密地合作完成工作,因此你會尋求建議,了解如何與非設計師建立聯系、與利益相關者互動,以及如何與商業團隊溝通,以便他們理解你(劇透:他們并不關心你的設計系統、代幣或雙鉆流程)。你很可能已經設定了一些季度目標,并正在努力實現這些目標以保持持續增長。

高級

作為一名高級產品設計師,你比以往任何時候都更加注重戰略。你很少需要花半個小時與你的經理溝通你的日常項目(如果是這樣,那就有問題了,這叫做微觀管理,而問題要么是你的直線經理,要么是整個組織)。你更愿意在一對一的會議中兼顧兩個主要主題:戰略展望和領導力。

如果你是一位資深設計師,并希望進一步發展,那么你面前有兩條路可走:IC 和管理層。兩者都需要一定的領導能力。如果你選擇 IC 這條路,你可能沒有直接下屬,但你將以身作則,監督良好實踐的實施。你很可能會花費大量時間與你的經理一起準備擔任這些職位。

此外,如果您已經領導一個設計師團隊但尚未獲得正確的頭銜(這在該行業中很常見),您可以報告他們的進展和團隊的戰略舉措。

剩下的時間,你用來討論戰略。你的產品團隊(如果你負責多個產品,則多個產品團隊)下個季度的重點是什么?未來6到12個月,你還計劃探索和開發哪些產品?你的經理應該幫助你尋找資源和人脈,以實現戰略目標。

作品集:優先考慮像素而非演示文稿

杰睿

我與招聘經理和高級設計師談論他們對設計師的要求越多,我就越支持這樣的理論:作品集不應該是 X、Y、Z 案例研究,而應該是對你對細節的癡迷的探索。

深入分析你的解決方案以及你未能交付的部分,是展示你解決問題方法的絕佳方式,因為幻燈片式的解決方案并不能展現任何表面之下的東西。它只是一個面向公眾的精美模型。

但是!深入研究你的粗略工作可以表明你在解決問題時確實考慮到了端到端的產品流程。

“這不起作用,因為......”是一個有趣的討論,我知道它比與招聘經理交談時的“這是一個流程”有趣得多。

因此,問題是:你如何證明自己對細節“癡迷”?工藝正在成為軟件產品的關鍵差異化因素,而設計(也就是你)有能力推動這一進程。你將如何幫助這家公司突破質量界限?

好消息是,我相信這對設計師來說很有利!很多設計師都說他們做不成作品集,因為“沒什么東西可展示”。但如果把作品集翻轉過來會怎么樣?展示你學到的東西,而不是把作品集想象成一堆擺成15度角的炫酷設備。

從單個功能中抽取單個屏幕上的單個元素。這其中涉及了多少細節?你能把每個步驟的像素級細節做到多精細?記錄你的空間布局,標記所有組件,展現你的整潔,列出你如何在任務管理軟件中管理這項工作,并展示 Slack 決策的截圖!

-

深度挖掘的幾個例子:

  1. 構建自動建議https://www.mrbrianmorris.com/work/query-formulation
  2. Spotify 更改顏色:https://spotify.design/article/better-in-black-rethinking-our-most-important-buttons

在他們決定關閉之前,該故事的一個版本最初發布在https://read.cv上。

 

蘭亭妙微(m.skdbbs.com )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的大數據可視化界面設計、B端界面設計、桌面端界面設計、APP界面設計、圖標定制、用戶體驗設計、交互設計、UI咨詢、高端網站設計、平面設計,以及相關的軟件開發服務,咨詢電話:01063334945。我們建立了一個微信群,每天分享國內外優秀的設計,有興趣請加入一起學習成長,咨詢及進群請加藍小助微信ben_lanlan

如何使用人工智能從現有設計中生成設計變體

杰睿

如何利用人工智能根據現有設計生成設計選項?

這是一個常見的用例:

  • 也許您認為當前的登錄頁面太混亂并想改進它。
  • 也許您正在進行設計,但感覺只有一個想法,并且希望有更多的設計選擇來獲得靈感。

然而,我在網上并沒有看到太多關于如何使用人工智能來解決此類用例的討論。

所以今天,我將逐步向您介紹一些示例,包括我使用的提示、工作流程和結果。

讓我們開始吧!

概述

由于我只需要專注于前端設計,因此我使用了V0Magic Patterns進行演示。我特意選擇它們是因為它們都是針對前端優化的 AI 原型設計工具。

兩種工具都可以完成這項工作,但我在兩種工具中都運行了同一組提示,以便您可以更好地了解它們可以實現的功能。

如果您有興趣,您也可以在其他工具(如Cursor、WindsurfBolt )中運行相同的工作流程,然后告訴我進展如何。

工作流程分為兩個步驟:

  • 步驟1:讓AI分析設計并提出改進建議。
  • 第 2 步:要求 AI 根據其建議生成設計變體。

如果您清楚自己想要進行哪些設計改進,您當然可以將步驟 1 和 2 合并為一個簡單的步驟——只需上傳設計、提供您的建議,然后要求 AI 生成新的設計選項。)

我使用 Kayak.com 的頂部部分作為演示的現有設計。

將顯示縮放圖像
Kayak.com

問:仔細看看。你會如何設計它以不同的方式?

第一個提示

這是我放入 V0 和 Magic Patterns 的第一個提示,以及 Kayak 主頁頂部部分的快照。

提供 Kayak 登陸頁面的設計評論(見附件快照)。擔任具有深厚 UX/UI 專業知識的經驗豐富的產品設計師。KAYAK 的主要業務目標是通過為旅行者提供旅行規劃工具來賦能他們。其搜索引擎會掃描各種旅游網站,提供豐富的機票、酒店、租車和度假套餐選擇和價格。其主要用戶是希望搜索和比較旅行選擇的日常旅行者。請使用以下視角評估桌面主頁:- 核心價值主張清晰
- 信息架構和易于查找關鍵操作
- 視覺層次、布局和空間使用
還包括 3-5 條具體的、高影響力的建議,以改善主頁上的用戶體驗或轉化率。

正如您所見,我還包括了主要的業務和用戶目標——這是一個小提示,可以為 AI 提供更多設計分析的背景。

V0

V0的設計分析:

將顯示縮放圖像
V0的設計分析

一長串的分析,啟發性十足。我大概也能從 ChatGPT 或 Claude 得到類似的結果。

(下一步是根據這些建議生成設計方案。但正如我之前提到的,實際上我也可以提供自己的設計建議,例如“當前設計缺乏清晰的視覺層次,并且留白過多。您能否生成三個設計方案來解決這個問題?”)

接下來,我要求 V0 生成設計選項:

根據以上建議,您能否為 Kayak 主頁快照生成 8 種備選設計方案?Kayak 主頁快照的8 替代設計選項?

正如我所料,它運行了很長時間,每個設計選項大約一分鐘。因此,我點擊了“停止”,并在提示中將數量從 8 減少到 3:

根據以上建議,您能否為 Kayak 主頁快照生成 3 個備選設計方案?Kayak 主頁快照3 備選設計方案嗎?

V0 在大約 1.5 分鐘內生成了 3 個設計選項:

  • 設計1:增強核心體驗
  • 設計二:沉浸式英雄體驗
  • 設計3:以目的地為中心的體驗

設計方案1:增強核心體驗

V0 描述的快照:

將顯示縮放圖像
V0 對設計選項 1 的描述

它生成的設計:

將顯示縮放圖像
V0的設計

設計方案二:沉浸式英雄體驗

V0 描述的快照:

將顯示縮放圖像
V0 對設計選項 2 的描述

它生成的設計:

將顯示縮放圖像
V0的設計

設計方案3:以目的地為中心的體驗

V0 描述的快照:

將顯示縮放圖像
V0 對設計選項 3 的描述

它生成的設計:

將顯示縮放圖像
V0的設計

印象

總體而言,效果令人印象深刻。我喜歡這些精致的細節。它保留了我提供的快照中的必要信息(顏色、樣式、CTA)。

所有生成的設計都由具有基本交互效果的代碼支持,例如輸入字段交互和懸停效果。

我希望設計選項之間能有更清晰的區分。不過我也可以嘗試后續的提示來解決這個問題。

魔法圖案

Magic Patterns 的設計分析:

將顯示縮放圖像
Magic Patterns 的設計分析

有些我同意,有些我不同意。為了演示,我簡單地讓它生成相應的設計選項:

根據以上建議,您能否為 Kayak 主頁快照生成 8 種備選設計方案?Kayak 主頁快照的8 替代設計選項?

Magic Patterns 在 1.5 分鐘內生成了 8 個設計選項,比我預期的要快。

由于新聞稿的篇幅限制,我在這里僅展示三種設計:

設計方案1:增強價值主張

將顯示縮放圖像
Magic Patterns 的設計

設計選項 2:搜索優先設計

將顯示縮放圖像
Magic Patterns 的設計

設計選項3:社會認同焦點

將顯示縮放圖像
Magic Patterns 的設計

印象

與 V0 相比,設計更加簡單。

它在更短的時間內生成了更多的設計,這很棒。

我很喜歡它的“導入 Figma”功能。我可以將生成的設計導入 Figma 進行進一步編輯。

此外,它還有一個Chrome 擴展程序,可以讓我把網頁轉換成 React 組件或 Figma。雖然不完美,但我對它的功能非常期待。

 

蘭亭妙微(m.skdbbs.com )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的大數據可視化界面設計、B端界面設計、桌面端界面設計、APP界面設計、圖標定制、用戶體驗設計、交互設計、UI咨詢、高端網站設計、平面設計,以及相關的軟件開發服務,咨詢電話:01063334945。我們建立了一個微信群,每天分享國內外優秀的設計,有興趣請加入一起學習成長,咨詢及進群請加藍小助微信ben_lanlan

產品設計的未來

杰睿

用戶體驗設計:如何設計有效的“第一次觸發”?從 Push 到頁面設計

杰睿

 

——基于《Hooked》模型的用戶激活交互思路
 

一、什么是“第一次觸發”?為什么它決定了用戶的去留?

在《Hooked》一書中,作者提出“Trigger”是促使用戶行動的第一步。觸發可以分為兩種:
外部觸發:例如 App 推送、廣告、鏈接、好友邀請
內部觸發:用戶自己產生的動機,比如焦慮、孤獨、空閑、好奇等情緒
“第一次觸發”通常指的是用戶首次接觸產品的關鍵時刻,也是我們設計中用戶激活(activation)環節的核心。很多產品在吸引用戶下載后,沒能成功完成這一步,導致高流失率。
那么,如何讓用戶在第一次接觸產品時就“被打動”,甚至開始“動手”?這是交互設計師無法回避的挑戰。

二、Hook 模型下的第一次觸發路徑

我們可以將“第一次觸發”的設計過程,拆解為一個 Hook 的微循環:
swift
復制編輯
外部觸發(推送/鏈接/內容)→ 用戶行動 → 變動獎勵 → 微投入
設計的關鍵在于:
觸發是否準確命中動機
頁面是否降低了行動成本
是否提供足夠正向反饋,激勵用戶進入下一步

三、實際場景中,“第一次觸發”都可以怎么設計?

下面以兩個典型路徑為例,展開設計思路。
  1. 從 Push 到行動:信息即引導
場景:用戶安裝 App 后首次收到推送通知 
目標:提高用戶點開并進入 App 的概率

設計策略:

情境感知:比如早上推送“為你準備了 3 條晨間資訊”,中午推送“你關注的咖啡店正在打折”。
視覺引導:通知樣式帶有關鍵詞高亮、情緒詞匯、數字誘因(“3 條”、“50%”等)。
即時性獎勵:如“限時免費”、“首次點擊得積分”。

示例對比:

普通推送文案:
“你有新消息,點擊查看。”
優化后:
“你的新客戶留言了:點擊 30 秒內回復可得 50 積分!”
用戶動機 + 獎勵機制 + 時間緊迫感 = 有效第一次觸發
  1. 首屏設計:默認就是最好的引導
  2.  場景:用戶打開 App 或首次訪問頁面 
  3. 目標:促使用戶完成關鍵行為,如注冊、收藏、瀏覽首個內容

 設計策略:

將用戶動機前置化:如圖文內容帶標簽“為你推薦”、“同城熱門”
提供默認建議:如自動生成 3 個關注推薦,不讓用戶空白加載
弱引導行動按鈕:如“我想試試看”、“點這里獲取專屬內容”,代替“立即注冊”

小結:

元素 常見問題 設計優化
空白狀態 “你還沒有收藏內容” 提供推薦 / 模擬數據
注冊頁面 信息太多 / 提示太弱 三步注冊 / 支持游客試用
首頁內容 冷啟動/無吸引力 動態推薦 + 情境觸發設計

四、設計師如何判斷觸發設計是否有效?

? 指標層面

激活率:App 下載后次日留存 / 完成注冊 / 觸發首次行為的用戶比例
首觸轉化率:觸發內容點擊后進入行為的用戶比例

? 用戶層面

用戶是否在無需幫助的情況下完成操作
用戶是否表達出“被內容打動”的情緒反應(通過反饋/行為路徑觀察)

第一次觸發,決定了第一次信任

“第一次觸發”的設計不只是營銷或產品經理的工作,它是交互設計的前哨戰
從文案到頁面布局,從通知到首屏,一切都在為用戶“做決策”而服務;
要問的不是“設計美不美”,而是:“用戶有沒有動起來?”
Hook 模型里,觸發只是起點,但它決定了是否進入循環的門檻。
 
蘭亭妙微(m.skdbbs.com )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的大數據可視化界面設計、B端界面設計、桌面端界面設計、APP界面設計、圖標定制、用戶體驗設計、交互設計、UI咨詢、高端網站設計、平面設計,以及相關的軟件開發服務,咨詢電話:01063334945。我們建立了一個微信群,每天分享國內外優秀的設計,有興趣請加入一起學習成長,咨詢及進群請加藍小助微信ben_lanlan

AI工具+AI流暢度+人類優勢=AI原生設計師

杰睿

AI工具+AI流暢性+人類優勢

作為一名產品設計師,我最近一直在努力理解快速變化的人工智能格局,既感到敬畏,又感到困惑。Anthropic的首席執行官警告稱,人工智能可能會取代高達 50% 的入門級白領工作,而 Zapier 的首席執行官則談到招聘精通人工智能的人才。與此同時,“模型設計師”等新職位正在涌現,行業正在迅速向更多超級 IC 職位轉變。

隨著人工智能重塑我們的工作方式,我一直在問自己,這不僅關乎如何保持相關性,還關乎如何在我的工作中不斷成長并找到樂趣。

據我所知,新的轉變需要利用三個領域

  1. 人工智能工具:組裝不斷發展的人工智能設計堆棧以快速交付
  2. 人工智能流暢性:學習如何設計概率系統
  3. 人力優勢:加強工藝、自主性和判斷力等護城河,保持領先于自動化
  4. 這些支柱與戰略思維和以人為本的技能相結合,塑造了我們成為AI 原生設計師的道路
Open AI cookbook 中的 AI 產品堆棧和提示結構

1. 人工智能工具

人是制造工具的動物——本杰明·富蘭克林

本杰明·富蘭克林的定義強調了人類在發明和使用工具來擴展自身能力方面的創造力。如今,人工智能標志著這一進化的飛躍,從手動工具到智能協作者。

速度不再是可有可無的。ProcessMaker的產品團隊從每年兩次交付到每兩周交付一次。Figma的《設計現狀報告》(2025)指出,近七成的設計團隊(68%)經常使用人工智能來自動化線框圖繪制、生成視覺資產并分析用戶反饋。

隨著人工智能逐漸融入日常工作流程,設計工具顯然變得越來越積極主動,既提高了速度,又增強了想象力。

構建一個反映你的技藝的堆棧

你的設計棧取決于你作為設計師的身份。用戶體驗研究員的設計棧與全棧產品設計師、對話式AI設計師或視覺藝術家的設計棧截然不同。沒有放之四海而皆準的方案。

在過去的六個月里,我嘗試了 60 多種 AI 工具,追逐每一個新的自動化更新和閃亮的產品發布。然而,事實是,我的工作流程中幾乎所有東西都只運行在四到十種工具上,正如我的 AI 產品設計棧所示。

因此,真正的價值在于有意識的嘗試。嘗試新工具,不是因為它們流行,而是因為它們可能會在你的工作流程中解鎖更好的功能。問問自己,有沒有更智能、更快速、更周到的方法來做到這一點?

此外,人工智能工具正在快速發展,但設計的藝術依然是人類的。決定做什么以及如何使其卓越,仍然取決于品味、判斷力、技藝和你的工具包。正如設計領袖阿古斯丁·桑切斯 (Agustín Sánchez) 所說“你之所以優秀,并非因為你了解最新的工具。你之所以優秀,是因為你知道如何運用它們。”

提示作為一項核心技能

去年,我多次發現自己覺得人工智能的輸出很平庸,后來我意識到問題往往不在于模型本身,而在于我設計提示的方式。擁有正確語境的人工智能模型能夠提供生成有意義響應所需的信息。

轉變視角,將人工智能視為合作者,并學習如何構建上下文,徹底改變了我的輸出質量

“提示就像是讓人工智能加速,或者將其推向正確的方向。”——約翰·前田 (John Maeda)談領導者如何利用人工智能釋放創造力

亞歷克斯·克萊因 (Alex Klein) 提出了一個令人信服的論點,即提示從根本上來說是一種設計活動,涉及以清晰度、背景、語氣和意圖來設計對話。

如果您想提高提示技巧,這些資源是一個很好的起點
Google 提示要點
IBM — 提示工程指南
OpenAI — 提示指南

AI流暢度工具包

2. 人工智能流暢性

AI 流暢性是指能夠自信地設計和使用意圖驅動、分層和概率系統的能力。對于產品團隊而言,這意味著理解 AI 的潛力,應對其復雜性,并做出明智的決策,從而帶來負責任且有影響力的成果。

GUI 界面要求用戶通過點擊、滾動和菜單導航來實現目標。相比之下,代理系統則通過關注基于意圖的結果,為我們提供了一種與系統交互的新方式。

現實世界中的人工智能產品涉及編排、內存、工具集成、用戶體驗模式和代理流程。流暢性意味著要掌握系統的行為——它的可變性、它的故障、它出現錯誤或誤用的可能性,并在設計時充分考慮這些動態因素。

人工智能流暢性的構建模塊

AI 設計工具包

  • IBM 的GenAI 設計原則為生成式 AI 用戶體驗 (UX) 制定了六項基礎設計原則。每項原則都配有設計策略和實際案例,以幫助從業者有效地實施它們。
  • 谷歌的“People+AI” 計劃強調了設計人工智能交互時需要考慮的四個關鍵領域。該框架為設計有效的人工智能交互提供了寶貴的指南。
  • 我還構建了一個簡化的指南,其中包含20 多個 GenAI UX 模式的示例和實施策略
理查德·巴赫這本經久不衰的著作敦促工匠們擁抱現代工具,專注于目標而非墨守成規。米哈爾·馬萊維奇闡述了“人工智能平均線”,并鼓勵創意人士突破這條線,追求偉大的創意。

3. 人類優勢

借助 GPT-4o 和 Veo-3 等模型,AI 現已能夠快速生成高質量的文字和視覺效果,并在許多領域超越人類的技能和推理能力。真正的問題是——

我們人類獨有的優勢還剩下什么?

工藝比以往任何時候都重要

AI 模型基于海量數據集進行訓練,反映的是主流模式而非任何獨特的視角。因此,它們的輸出往往顯得千篇一律,缺乏主觀細微差別的深度,例如個人風格、洞察力、敘事意圖和創意原創性。設計師Michal Malewicz用“ AI 平均線”的概念捕捉到了這一現象,并將當今的創意格局描述為乏味的時代”,充斥著千篇一律、缺乏靈感的 AI 輸出。

諷刺的是,這種豐富性反而提高了標準!

此外,歷史表明,盡管新工具層出不窮,敘事、審美判斷和執行質量等基本技能仍然至關重要。正如 Photoshop 并沒有扼殺平面設計一樣,擁有 AI 的共同創造者并不會否定對技能的需求,而是會改變它。

理查德·森內特在其著作《工匠》中強調,工具在不斷發展,但技藝和精湛技藝的精髓始終是核心,也是區分真正專家的關鍵所在。他敦促工匠們擁抱現代工具,并專注于目標而非墨守成規。

創意方向、代理和保持人力掌控

我們定義目標、設定約束并做出為人工智能指明方向的高層決策。

隨著速度和質量的不斷提升,爭論的焦點不再是人類與人工智能的對決,而是我們尋求何種合作。在這種新的動態下,設計師不再只是創造者,而是提供創意方向、愿景和目標的人。 設計師逐漸成為創意總監或統籌者,而人工智能則扮演著助手、創意伙伴,甚至是評論家的角色。

Julie Zhuo 強調了自主性的重要性。即使人工智能與我們的技能、能力和品味相匹配,我們選擇為何以及在何處應用人工智能技能的能力仍將受到價值觀、意圖和新興目標的驅動,并且仍然具有人類的鮮明特征。

例如,兩位設計師使用相同的AI工具,可能會得出截然不同的結果。一位設計師可能會讓AI為一家氣候非營利組織探索極簡主義的布局,而另一位設計師則用它來為一家兒童教育初創公司生成充滿趣味、富有表現力的視覺效果。差異不在于工具本身,而在于引導它的人類價值觀和意圖。

世界經濟論壇概述了 2030 年的四個類別:新興技能、非焦點技能、穩定技能和核心技能

4. AI原生設計師

那么,成為一名AI原生設計師意味著什么?僅僅掌握AI工具和技術就足夠了嗎?還是在這個新領域,還需要更深層次的技能?

世界經濟論壇顯示,2030年最緊俏的技能不再是技術性技能。隨著自動化改變工作方式,雇主更看重戰略性、以人為本的能力,例如分析性思維、創造性思維、技術素養和韌性。

正如Fabricio Teixeira 指出的那樣,即使在技術快速變革的時代,設計、協作和溝通的基礎仍然是設計生涯的永久支柱,并且比任何工具都更持久。

與此同時,“超級集成電路”角色的出現正在重新定義高級設計職業,因為許多公司正在積極支持實踐領導道路,重視深厚的專業知識、質量和高杠桿貢獻,而不是傳統的人員管理。

隨著創作速度越來越快、觸手可及,設計師真正的新護城河如今在于打造獨特、可靠且令人難忘的AI體驗。掌握設計原則、敘事能力和解決問題的能力仍然是人類獨有的強項。

 

蘭亭妙微(m.skdbbs.com )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的大數據可視化界面設計、B端界面設計、桌面端界面設計、APP界面設計、圖標定制、用戶體驗設計、交互設計、UI咨詢、高端網站設計、平面設計,以及相關的軟件開發服務,咨詢電話:01063334945。我們建立了一個微信群,每天分享國內外優秀的設計,有興趣請加入一起學習成長,咨詢及進群請加藍小助微信ben_lanlan

如何傳達錯誤

杰睿

一個人對錯誤的反應——無論是自己犯的還是他人犯的——是一個復雜且常常令人痛苦的心理過程。在本文中,我將解釋為什么幾乎所有的錯誤提示信息的設計都公然無視用戶體驗理論。我將使用交互式原型來展示如何解決這個問題。我還將轉向交互理論,回顧模式的概念,并解釋可逆性、恰當性和及時性的原則。

我們的用戶不是程序員

每個設計師的清單里都會包含“設計錯誤界面”。但即使完成了,程序員仍然會回來說:“還有另一種情況——我們也需要一個錯誤界面。”在這種情況下,程序員是設計的客戶,這很有道理:程序員比任何人都更了解錯誤。設計師和經理們都認同這種方法——但它存在嚴重缺陷。

“我們不是我們的用戶。”設計師們不斷重復這句話。他們想表達的是:不要僅僅依賴自己的專業知識(這不可避免地會過時,而且容易產生職業偏見),而要關注用戶在自然環境中的行為。

所以,問題在于——程序員不是我們的用戶。程序員的行為、思維方式,以及與計算機的聯系與其他人截然不同。我知道我在說什么。我的大多數朋友都是程序員和工程師。我在工作中也經常和程序員交流。我自己也是一名程序員,使用多種語言(從 Swift 和 GLSL 到 Forth 和 Assembly)。但幸運的是,我也是一名非常關注心理學的設計師。那么,讓我來告訴你程序員的一天通常是怎樣度過的:

程序員甚至還沒來得及好好寫點東西——他們停頓了一下,砰,一個錯誤出現了:“空白符缺失”。不知何故,下一行也出現了錯誤(盡管那一行完全沒問題)。左側面板也滿是錯誤。這還不算編譯錯誤。除了紅色圓圈,可能還有黃色圓圈——程序員的大腦已經習慣了忽略這些警告。

如果錯誤來自硬件故障、第三方庫的 bug 或文檔不清晰,程序員不會把這些錯誤當回事。他們會把這些錯誤視為一種有用的工具,幫助找出別人的錯誤。而有些煩人的拼寫錯誤,你會在自己的代碼中苦苦追尋,希望編譯器能自動捕獲它們。那么,關于拼寫錯誤的錯誤消息就是程序員最好的朋友。

簡而言之,程序員對錯誤消息產生了一種容忍度——所有那些帶有感嘆號的圓圈和冗長、說教的紅色文字。

心理學家會怎么說?

從人體工程學的角度來看,程序員的環境與普通用戶的環境有著根本的不同。因此,設計師絕對不應該采用程序員對待錯誤的態度。如果我們負責設計一個 IDE(集成開發環境),那么我們當然會咨詢程序員——他們是我們的用戶。但在開發其他產品時,最好不要依賴他們的觀點。相反,我們應該咨詢心理學家。

紅色感嘆號會讓用戶想起老師在課堂筆記中批改的內容,并被理解為一種懲罰(當然,除非有人已經培養了對懲罰的耐受力,比如程序員)。那么,心理學是如何看待對錯誤的懲罰的呢?

重要的是不要用消極情緒來強化錯誤,因為大腦對此非常敏感,并會將這種行為標記為不值得投入精力的事情。

我知道有些人看到錯誤信息就會慌亂不已。他們開始點擊所有按鈕,只為讓它盡快消失。這些人很難適應界面,因此他們傾向于完全避免與界面交互。這并不是因為他們愚蠢,而是因為他們是普通人——而不是程序員。

看看這個!幾乎每個字段都用紅墨水劃了線,界面提示你輸入姓名,并要求你填寫,而且是必填項!

但程序員對此完全沒意見。程序員堅信,把笨蛋塞進錯誤里是有用的,這樣他們就不會再試圖用 null 或 undefined 來破壞程序了。程序員和工程師稱之為“傻瓜式防錯”,展現了他們獨特的同理心。

焦點切換時驗證

當用戶從一個輸入字段切換到另一個輸入字段時,第一個字段會觸發一個名字很不靠譜的事件:“onblur”。開發者經常用它來進行驗證——以防用戶漏填字段、輸錯生日或忘記郵件中的“@”。問題是:當用戶切換到另一個應用時,“onblur”也會觸發。過去,表單跨越三頁時,空字段是個問題。如今,所有內容都能放在一個屏幕上——很難忽略一個空字段。至于其他的檢查——它們對用戶沒有任何幫助。它們只是另一種“傻瓜式”的玩意兒。但用戶不是傻瓜。當他們想要什么東西時——他們會發揮創造力。我知道有人會修改頁面代碼,以獲取他們嚴格意義上不應該獲得的政府服務。而如今,他們甚至不需要知道如何編寫代碼:只需單擊一下即可打開 DevTools,再單擊幾下——所有驗證都消失了。輸入任何你想要的內容。

通過像傻瓜一樣對待用戶,開發人員產生了兩個問題:第一 - 他們浪費時間構建“保護”,第二 - 他們陷入了一種虛假的安全感(沒有比“通過模糊性實現安全”更糟糕的保護)。

在焦點切換時進行驗證毫無意義,而且問題重重,我甚至不想在這里討論它。讓我們繼續討論主按鈕上的驗證:“繼續”、“提交”等等。

通常如何做

我們與雅虎界面的交互分為三個階段:

  1. 開始。所有字段均為空。無錯誤。“繼續”按鈕可用。
  2. 按下“繼續”按鈕。所有空白字段均被標記為錯誤。
  3. 焦點從第一個字段移開。突然間,它不再被標記為錯誤了。

讓我們來分析一下。

激活按鈕——這很好,雅虎點贊了。我有一篇名為“禁用按鈕”的文章,解釋了這背后的理論和實踐。如果你仍然認為禁用按鈕對用戶有幫助,那你絕對應該讀一讀。

接下來是可逆性原則。這意味著你可以將界面恢復到初始狀態。雅虎又贏了——你可以重置界面。但只能通過逐個點擊每個字段來實現。這有什么意義呢?為什么僅僅因為你移開焦點,錯誤信息就會消失?這純粹是算法故障!在我關于設計流程的文章中,我指出即使是頂級公司有時也會設計出糟糕的界面,所以不要盲目追隨權威。要遵循科學。

下一個原則是恰當性。用戶點擊了“繼續”按鈕——交互的對象是按鈕,而不是輸入字段。如果按鈕發出某種震動或吱吱聲來表達不滿,這可以理解。但是輸入字段呢?根本沒人碰過它們!它們怎么可能感知到按鈕的情緒呢?只有程序員知道,在代碼中,這些對象是相互關聯的——但外部觀察者一無所知,因為它們之間沒有視覺聯系。

現在來談談時效性原則。設計師用紅色高亮顯示幾個字段,期望用戶做出什么反應?如果所有字段的重要性都一樣,用戶應該先解決哪個字段?這需要對注意力中心進行復雜的討論(這里的注意力中心不是指某個具體的輸入字段,而是“出了點問題”的整體感覺),但我建議保持簡單:界面基本上就是按照“坐下-停留-過來”的順序排列,打破了“一次一個動作”的原則。

這里,一切都非常不對勁!

調試模式

界面有“模式”的概念。在我的大學里,程序員選修了一門名為“界面設計”的課程,課程內容包括解釋為什么彈出窗口被稱為“模態窗口”?,F在,我驚訝地發現,程序員和設計師似乎對如何處理模式一無所知。

老式計算機有一種特殊的“HALT”模式,用于調試錯誤,也稱為“控制臺模式”。如果處理器嘗試執行無效操作,程序將被中斷,處理器將停止運行,并切換到控制臺模式。您也可以通過按下物理“HALT”按鈕手動觸發 HALT 中斷。使用開關或調試程序(在單獨的控制臺上運行),您可以修復錯誤并返回程序執行模式。

“處理器”一詞并非偶然——它源于“進程”。錯誤中斷只能在進程運行期間發生,而不會在處理器停止并處于調試模式時發生。這一事實在我們稍后討論進程和狀態之間的區別時會很有用。

向用戶清晰解釋他們最終進入不同模式的原因和方式至關重要。例如,調試器會顯示導致無效操作的指令地址。同樣重要的是解釋如何返回(記住可逆性原則)。經典的 Norton Commander 完美地詮釋了各種模式:

  1. 文件選擇模式
  2. 復印模式
  3. 管理員模式,需要對硬件錯誤做出響應

我見過有人批評這類解決方案:“窗口疊在其他窗口上看起來很丑”。即便接受了這種說法,我仍然無法認同設計師通常提出的替代方案:“我們把這個窗口移除,把錯誤顯示到別的地方,這樣更美觀。” 就好像設計師忘記了自己是工程師,只是拿起畫筆,像個泥水匠一樣把瑕疵掩蓋起來。

如果你真的想擺脫窗口,正確的方法是記住什么是模式、它們來自哪里以及它們是如何工作的——然后弄清楚如何避免切換到其他模式(如果你想深入了解模式,請閱讀 Jef Raskin 的《人性化界面》)。例如:軟盤空間不足?不允許復制文件。軟盤未插入?不要將其顯示在目標列表中?,F代操作系統就是這樣做的——它們消除了執行可能導致錯誤中斷的操作的可能性。

現在我們可以猜一下雅虎上的“繼續”按鈕的作用了:它啟動了一個錯誤調試模式。在該模式下,用戶被賦予了程序員的角色,并被迫修復所有導致程序崩潰的空值和未定義值。不幸的是,開發人員并沒有意識到這對普通用戶來說有多么糟糕。我希望他們至少明白,他們剝奪了用戶返回上一個模式的能力——這違反了良好用戶體驗的最基本規則。

糟糕的算法變成了“最佳實踐”

乍一看,似乎所有網站的錯誤顯示都和雅虎一模一樣。所以這肯定是“最佳實踐”,是行業標準……但事實并非如此!每個人的做法都不一樣。我們來看看亞馬遜:

  1. 開始:所有字段均為空。無錯誤。“繼續”按鈕可用。
  2. 按下“繼續”按鈕。所有空白字段均標記為錯誤(最后一個字段除外)。
  3. 要消除錯誤,僅僅切換到另一個字段是不夠的——您實際上必須輸入一個值。
  4. 再次按下“繼續”按鈕。除第一個字段外,所有字段均為空,并標記為錯誤(第一個和最后一個字段除外)。

讓我們來分析一下。

一個活動按鈕——很好。亞馬遜正在跟上雅虎的步伐。

自動聚焦到第一個字段——太棒了(雅虎沒有這個功能):用戶可以立即開始輸入。填完第一個字段后,按“繼續”鍵會直接將光標移動到第二個字段,也就是錯誤所在的地方。真是聰明的舉動!

有人會反對:自動對焦在桌面端運行良好,但在移動設備上鍵盤會遮擋半個屏幕,所以最好隱藏它,直到用戶點擊輸入。這樣一來,你解決了一個問題,又制造了另一個問題。然后你選擇你的毒藥……問題是,你會認為一種弊端較小,而有些用戶會認為另一種弊端更嚴重。無論哪種情況,你都在選擇一種弊端。不要這樣做(我稍后會解釋如何做)。

界面可逆性。你輸入一些內容,錯誤消失;然后你刪除它并切換到另一個字段——哇,一個沒有錯誤的空字段。所有字段都一樣。將界面恢復到初始狀態比雅虎要難,但由于算法不穩定,仍然是可能的。

與雅虎的同事一樣,亞馬遜的程序員在“繼續”按鈕和輸入字段之間建立了心靈感應:按鈕不想繼續,但輸入字段都大聲喊出來(突然變成輸出字段)。

特別要提一下密碼確認框——為什么它不變成紅色?不填就無法繼續。想說要等到前一個框填完后才進行校驗?當然,你得給用戶解釋一下錯誤校驗算法,再給他們看源代碼——這真的會很有幫助(諷刺)。

現在,我們來快速看一下IBM的解決方案:

激活按鈕——不錯。沒有自動對焦,但至少界面會自動滾動到第一個字段并顯示錯誤。

界面不可逆——無法將字段恢復到第一個屏幕上的樣子。換句話說,你無法退出調試模式。那么,為什么還要有第一個屏幕(調試模式)呢?如果你認為空字段是錯誤,那就直接顯示第二個屏幕吧。哦,你不想立刻嚇到用戶?還記得感知心理學嗎?你決定稍后再嚇唬他們,作為對他們錯誤的懲罰?讓我再重復一遍心理學家的話:

重要的是不要用消極情緒來強化錯誤,因為大腦對此非常敏感,并會將這種行為記錄為不值得花費精力的事情。

例子不勝枚舉。以網站 capital.xyz 為例:

日期字段為空,點擊“下一步”按鈕,字段自動對焦。手機字段為空,點擊“下一步”——完全沒有自動對焦。為什么?這背后的想法是什么?劇透:根本沒這回事。只是算法出了問題。

谷歌甚至更進一步——你輸入的每一個字符它都會責罵你……

即使你不同意我的批評,你也必須承認,知名公司的頂級設計師和程序員在實現同一項任務時,都采用了截然不同的方式。這意味著完美的解決方案尚未找到。很可能,根本沒人真正去尋找它。程序員只是在缺乏對用戶交互原則清晰理解的情況下編寫代碼,然后跑來找設計師說:“嘿,這里又有一個錯誤需要顯示出來。”

當我為自己的項目設計錯誤顯示時,我沒有依賴別人的解決方案——我依靠科學。我在撰寫本文時收集了來自雅虎、亞馬遜和 IBM 的示例。在對所設計機制背后的原理沒有深入理解之前,研究參考文獻是有害的。你只會撿起別人的錯誤,然后引用權威文獻來為自己辯護。幾乎每個人都這樣做。沒有人愿意重新發明輪子——工業程序員沒有時間或動力去做這件事。所以每個人都堅持使用老式的命令行、字母數字顯示方法。還記得當時錯誤是如何顯示的嗎?如果沒有,來看看控制臺:

如今,界面開發人員仍在做著同樣的事情:直接把錯誤日志直接倒在屏幕上。21世紀唯一的升級?把文本涂成紅色,然后把信息分散到屏幕的不同位置。

這可不行。我們趕緊解決吧!

事件與狀態

我們用“錯誤”這個詞來描述兩種截然不同的事物:事件狀態??焖倩仡櫼幌拢寒斕幚砥鲊L試執行無效操作時,它會觸發中斷并進入調試模式。這是一次性事件。我們說“發生了錯誤”。然后,我們去尋找導致崩潰的內存中的特定值。該值——或者更準確地說,存儲單元的狀態——也稱為“錯誤”。換句話說,我們模糊了因果之間的界限——僅僅是因為我們沒有想出單獨的詞。為了避免混淆,我將使用兩個術語:進程錯誤(事件,某個時間點)和數據錯誤(內存中的錯誤值,一種狀態)。

我們來看一個郵箱輸入框。缺少“@”符號?這是數據錯誤。被郵件服務器退回郵件?這是流程錯誤。或者以郵政編碼為例。位數太少?這是數據錯誤。數據庫中找不到郵政編碼?這是流程錯誤。

空字段

輸入字段只是一個數據容器。數據可能會缺失。如果你沒有輸入生日,并不意味著你出生在零日。這個輸入字段根本沒有數字,只有占位符“日”。數據缺失了。

因此,空白字段并非數據錯誤。不存在的東西本身就不是什么錯誤??瞻鬃侄问莿摻〝祿?/span>機會,是一個良好的起點,也是一個互動的邀請。你可能已經注意到,空白表單看起來比已填充的表單更優雅。那么,為什么要用有毒的紅色來破壞它呢?誰會喜歡與標記為危險的字段互動呢?

不要這么做。我準備了一個交互式原型來向你展示應該怎么做。

狀態改變

讓我們看看電水壺中按鈕和水的狀態是如何變化的。打開電水壺。水沸騰后,按鈕會彈開。但觸發按鈕的不是水,而是溫度傳感器。如果傳感器損壞或丟失,按鈕就不會彈開。

現在手動按下按鈕——水不會突然變冷。了解導致狀態變化的具體原因很重要。

規則如下:如果對對象 A 執行了某個操作,那么只有 A 的狀態可以改變,而對象 B 的狀態則不能改變。要更改 B 的狀態,需要一個直接作用于 B 的獨立進程。

例如,數據庫搜索可能會觸發索引重建——這會更改數據庫本身,但不會改變您搜索的值。

讓我們來看一個常見的 UI 設計錯誤。用戶想通過郵政編碼查找城市。他們輸入郵政編碼,點擊“搜索”,然后……輸入框變紅,或者值消失了。發生了什么?這是一個流程錯誤——數據庫中沒有結果。但 UI 卻將其顯示為數據錯誤,就好像用戶輸入了錯誤的郵政編碼一樣。但也許郵政編碼是有效的——只是城市還沒有添加到數據庫中。也許五分鐘后就會添加。用戶并沒有輸入錯誤數據。輸入框不應該受到指責。我們無權觸碰它。流程錯誤需要以不同的方式顯示(稍后會詳細介紹)。

一次一個動作

根據???海曼定律,提供的選項越少,用戶選擇所需內容的速度就越快。將這一原理推向極致,便可得出“一屏一操作”原則。有人可能會說,復雜的程序不可能簡化到這種程度,但讓我們回想一下 Hanx Writer 文本編輯器——蘋果設計獎得主——它幾乎精簡了所有內容?;蛘呦胂朐?Photoshop 中按下一個按鈕就可以隱藏整個界面,只留下一個工具可見。在某些情況下,“一屏一操作”原則非常有效。至少,在放棄它之前,先嘗試一下。

在優化了開立經紀賬戶的網頁工作流程后,我決定在移動應用中測試這種方法。看看我的交互式原型吧——它通過了 17 位用戶的快速測試,與舊版本(每個屏幕有多個輸入字段)相比,速度提升了 13%。

有人可能會說,時間的提升并不大——少了52秒,而不是整整一分鐘。但首先,試著數到8——這實際上是一段相當長的時間內,任何事情都可能發生。其次,測試表明時間減少了,而不是像一些人擔心的那樣增加了。他們假設額外的屏幕轉換會減慢用戶的速度,但結果卻恰恰相反:信息越少,用戶處理速度就越快。當只有一個操作可選時,用戶會毫不猶豫地執行。

原型就是這樣。屏幕上只有一個輸入字段。用戶輸入數據,按下“繼續”,屏幕就會滾動到下一步。如果你手動嘗試在空白字段處向前滾動,屏幕會迅速彈回:“不行,不行”。輸入字段保持焦點,提示用戶輸入數據。無需任何額外的高亮——畢竟,它是屏幕上唯一的字段。完美。

如果你點擊“繼續”,但輸入框為空或郵箱地址缺少“@”符號,鍵盤會彈回來,仿佛在說:“想繼續嗎?那就繼續填寫吧。” 沒有任何錯誤信息!

我再強調一遍:我們不會隱藏錯誤信息。相反,我們設計的系統絕對不會出錯。沒有數據就意味著沒有數據錯誤。沒有流程就意味著沒有中斷或調試模式。這里唯一的期望是數據以正確的格式輸入。順便說一句,這里有一個很棒的方法——接受任何合理格式的數據。例如,Sberbank.ru 允許您輸入帶有國家代碼 (+7)、本地前綴 (8) 或完全不帶區號的電話號碼。

從本文俄語版的評論來看,并非所有人都理解原型的用途。有些人期望看到一個完美無瑕、隨時可用的產品(一個他們可以直接復制的產品),結果卻大失所望,對諸如缺少重新發送短信驗證碼的選項之類的問題吹毛求疵。讓我再次澄清:本文中的原型并非成品的精確復制品。它們的唯一目的是展示如何消除錯誤信息。

現在,讓我們將此解決方案擴展到界面無法簡化為“一屏一操作”模式的情況。 “Ingos Investments”的原型反映了數據量巨大,以至于每個屏幕上必須顯示多個字段的情況。

讓我們設想一個場景:用戶尚未填寫所有字段,點擊了“繼續”按鈕。界面立即聚焦于第一個空白字段,調出屏幕鍵盤,并滾動到該字段正上方,方便用戶查看正在輸入的內容。即使屏幕上有多個字段,我們仍然堅持“一次一個操作”的原則,巧妙地將其他字段隱藏在鍵盤下方。在活動字段下方,會出現一條提示:“所有字段必須填寫”。這不是錯誤消息,而是一個有用的提示,沒有任何令人擔憂的危險信號。

當用戶點擊屏幕鍵盤上的“下一步”時,他們只會跳轉到下一個字段——這和填寫表單的常規流程一樣,而不是笨重的錯誤調試模式。提示已經給出,所以用戶不太可能再次嘗試填寫空白字段。但如果他們真的這么做了,那么他們會再次看到這個溫馨提示。

懷疑論者可能會說:“但如果空白字段位于屏幕最頂部,無法滾動到鍵盤上方怎么辦?或者,如果網站是在桌面上打開的,根本沒有屏幕鍵盤怎么辦?” 答案是:沒什么大不了的。所有這些極端情況都在原型中得到了完美的體現。我也聽到過這樣的擔憂:“如果我們不把每個字段都涂成紅色,用戶就不會意識到需要填寫”。測試表明,這些擔憂是毫無根據的。這些擔憂背后真正的恐懼,是害怕打破常規,嘗試一些真正新穎的東西——一些對用戶更有利,而不僅僅是對我們自己更有利的東西。

州經理

為了創建“Ingos Investments”的原型,我編寫了一個狀態管理調度器。交互元素將其內容報告給管理器,然后管理器決定如何處理它們。

程序員常說輸入字段是獨立的元素。郵箱字段不知道電話字段里的內容。當你切換輸入字段時,它會觸發對其內容的驗證。當你點擊“繼續”按鈕時,所有輸入字段都會收到一個命令——檢查你的數據。這就是為什么它們會突然一起亮起紅燈。這就是它的構造方式。程序員說你無法改變它。設計師也相信這一點。不過亞馬遜的例子表明,密碼確認字段確實知道前一個字段的內容。所以他們可以隨時修改。

這意味著你可以而且應該創建一個狀態管理器。當用戶嘗試跳轉到下一個屏幕時,狀態管理器會檢查所有字段,找到一個包含不完整或無效數據的字段,將用戶帶回該輸入框并顯示提示。本質上,這是一次時光之旅——回到用戶出錯的點。因此,將后續字段標記為錯誤是沒有意義的——它們發生在將來,而用戶尚未到達它們。

使用狀態管理器,您還可以在鼠標懸停在“繼續”按鈕上時檢查字段內容。如果數據缺失,按鈕的標簽會更改為特定的字段名稱,例如“輸入街道”——這遵循了時效性原則(用戶嘗試繼續,但需要填寫字段,我們會通知他們)。這個新標簽在按鈕和字段之間建立了視覺聯系,使程序員有理由將這兩個元素的行為聯系在一起。

程序員可能會問:“為什么要把事情復雜化?” 沒錯——對程序員來說越復雜,對用戶來說就越容易。這是規則。說實話,這只需要一兩天的時間。需要更多精力的是通知系統。數據錯誤和流程錯誤應該顯示在各自的層級結構中:數據錯誤應該顯示在數據容器中,而流程錯誤應該顯示在應用程序范圍的通知中。這是一個完全獨立的主題,我希望有時間寫一篇關于通知設計的文章。

結論

因此,我們發現了以下事實:

  1. 絕大多數現有解決方案都歸結為切換到“錯誤糾正模式”,而退出該模式要么不可能,要么極其困難(只能通過算法中的錯誤)。這種方法雖然被廣泛接受,但各地的實現方式卻有所不同:空白字段可能被視為錯誤,也可能被視為正常,有時甚至會在同一屏幕上混合出現。用戶會背負負面情緒,因為系統會“懲罰”他們破壞程序。這種方法絕對不可接受,必須予以糾正。
  2. 缺少數據并不意味著數據錯誤。空白字段是互動的邀請,而非危險信號。
  3. 我們不需要兩種模式:數據錄入和糾錯。一種模式——數據錄入——就足夠了。
  4. 數據錯誤和流程錯誤是不同的。它們應該顯示在相應的層級結構中:數據錯誤應該顯示在數據容器中,而流程錯誤應該顯示在全局通知中。
  5. 如果您希望對一個對象執行的操作影響另一個對象,請在它們之間建立清晰的視覺聯系。
  6. “一屏一操作”原則一定要試一下。如果有效,那你太棒了!
  7. 編寫一個簡單的狀態管理調度程序。借助它,你可以引導用戶回到最早未完成的步驟。
  8. 創建原型——它們是新想法的最佳概念證明。
蘭亭妙微(m.skdbbs.com )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的大數據可視化界面設計、B端界面設計、桌面端界面設計、APP界面設計、圖標定制、用戶體驗設計、交互設計、UI咨詢、高端網站設計、平面設計,以及相關的軟件開發服務,咨詢電話:01063334945。我們建立了一個微信群,每天分享國內外優秀的設計,有興趣請加入一起學習成長,咨詢及進群請加藍小助微信ben_lanlan

Duolingo 終止了“用戶體驗設計”這一術語

杰睿

Duolingo 終止用戶體驗設計

令人驚訝的是,Duolingo 的用戶體驗主管 Mig Reyes 在 LinkedIn 上宣布,公司已決定徹底改變 UX 設計一詞,并用 PX 設計取而代之。

你可能會問, PX 設計是什么?讓我們根據公司的說法來分析一下。

Mig Reyes 在 LinkedIn 上的帖子引發了一場爭論

首先,他們明確表示將把用戶體驗 (UX) 的職能更名為產品體驗 (PX)。之所以做出這一改變,是因為 Duolingo 是一家產品主導的公司,他們內部所做的一切都是為了產品。他們招聘的職位也包括產品設計師、產品文案和產品研究員。

我們嘗試過“UX”這個統稱。但最終沒能堅持下來。它感覺不像我們。感覺……過時了。

最后,他們還提到了UI如何塑造用戶體驗,以及UX如何服務于產品,最終形成了完整的等式。這是一個相當有趣的UX設計理念,因為我們一直以來都認為用戶和業務之間需要取得平衡。

此事在網上引發了眾多設計師的強烈反對。有人認為這是公司賦予用戶體驗(UX)新身份、使其專注于業務和產品的絕妙之舉;而另一些人則認為這只是一種營銷噱頭。

LinkedIn 上引發的爭論

拋開這些審查不談,這確實表明公司越來越看重設計師的頭銜,更注重設計師的實際能力和技能。UX(用戶體驗)這個詞在我出生前就出現了,之后經歷了多次改版,所以這種情況對我來說并不意外。公司如何更加輕視設計師的頭銜,而更注重設計師的職能和技能。UX 在我出生之前就已經被創造出來了,從那時起它已經經歷了多次改版,所以這樣的事情對我來說并不感到驚訝。

PX、AX、DX 等的崛起

這并不是我們見證的第一次用戶體驗 (UX) 品牌重塑。1993 年,用戶體驗之父唐納德·諾曼 (Don Norman) 創造了“用戶體驗設計”一詞,將平面設計、工業設計、文檔和人機交互等概念融為一體。1993年,UX之父唐納德·諾曼創造了UX設計這個術語,將圖形設計、工業設計、文檔和人機交互全部涵蓋在一個整體中。

2011年,一位擁有產品設計背景的勇敢軟件開發者挺身而出,致力于改變開發者的生活。他提出了“開發者體驗”一詞,涵蓋了在其他現有平臺上構建應用程序的開發者的體驗。您可以在此處閱讀詳細文章。

最近,

宣布了一個名為“代理體驗”(Agent Experience,簡稱AX)的新術語。該術語與基于代理的人工智能(AI)領域相關,涵蓋了AI驅動的代理如何看待世界和數字體驗。例如,某些代理可以與網頁交互,并根據您的提示幫助您找到合適的內容。AI代理如何與網頁交互?代表您撥打電話的AI代理將如何與其他人互動?問題無窮無盡,而AX或許正是AI代理未來發展的答案。閱讀全文。

 

這對 UX 設計師來說意味著什么?

每個創意或技術領域都必然會根據當前的技術趨勢以及用戶對產品的期望而發展。由于許多任務都由人工智能完成,設計師不可避免地會開始關注業務和產品功能,因此“PX”一詞就顯得合情合理。如果重點轉向打造更優質的人工智能或代理體驗,那么“AX”一詞就顯得合情合理。設計師開始關注業務和產品功能因此,PX 這個術語是有意義的。如果重點轉向打造更好的 AI 或代理體驗,那么 AX 就說得通了。

用戶體驗設計師現在必須與時俱進,掌握必要的技能例如針對設計、產品和業務的 AI 工作流程,甚至對市場上新興趨勢的了解。

無論術語是什么UX 和 UI 設計的基礎和原則始終如一。事實上,在設計師數十年經驗的基礎上構建新的理念和流程比以往任何時候都更加重要。

日歷

鏈接

個人資料

藍藍設計的小編 http://m.skdbbs.com

存檔

92国产精品视频_亚洲a级在线观看_国产精品电影观看_国产精品免费观看在线_精品伊人久久97_亚洲人成在线观_尤物九九久久国产精品的特点_成人激情在线播放_成人黄色大片在线免费观看_亚洲成人精品久久久_久久免费视频在线观看_久久精品国产一区_国产一区二区三区18_亚洲欧美中文字幕在线一区_日韩美女中文字幕_日韩视频免费在线
日日夜夜免费精品视频| 四虎影视精品| 色香色香欲天天天影视综合网| 亚洲精品一二| 国产精品毛片一区二区三区四区| 亚洲a在线播放| 围产精品久久久久久久| 综合综合综合综合综合网| 亚洲精品狠狠操| 午夜在线视频一区二区区别| 久久xxxx精品视频| 国产亚洲精品美女久久久| 成人区精品一区二区| 国产免费不卡| 欧美肥臀大乳一区二区免费视频| 中文.日本.精品| 久久久综合九色合综国产精品| 久久精品国产电影| 成人免费视频app| a级片在线免费| 婷婷综合福利| 日韩欧美亚洲国产精品字幕久久久| 综合久久久久综合| 国产成人高清视频| 久久精品午夜一区二区福利| 久久久91精品| 成人小视频在线观看| 国产主播在线一区| 国产69精品久久久久9999| caoporn国产精品| 日韩一区二区电影网| 国产资源精品在线观看| 91福利在线尤物| 亚洲91av视频| 久久精品日产第一区二区三区高清版| 日本不卡一区二区三区视频| 精品久久国产老人久久综合| 欧洲黄色一区| 国产精品99999| 国产曰批免费观看久久久| 欧美剧情电影在线观看完整版免费励志电影| 亚洲天堂av电影| 日韩精品免费视频一区二区三区| 在线一区二区三区四区| 在线综合+亚洲+欧美中文字幕| 亚洲成人一区二区| 综合久久2019| 久久人人爽人人爽人人片亚洲| 麻豆蜜桃在线观看| 亚洲欧美日韩国产综合| 国产精品私房写真福利视频| 91精品国产99久久久久久红楼| 国产精品对白刺激久久久| 91精品国产综合久久久久久漫画| 在线观看特色大片免费视频| 一区二区三区在线看| 爱福利在线视频| 99成人免费视频| 亚洲国产人成综合网站| 亚洲色图清纯唯美| 日本日本精品二区免费| 亚洲精品欧洲精品| 日本10禁啪啪无遮挡免费一区二区| 亚洲成a人片在线观看中文| 中日韩视频在线观看| 日本欧洲一区二区| 在线播放视频一区| www.久久久久久久久| 国产乱码精品一区二区三区不卡| 91精品综合久久久久久| 欧美日韩视频在线观看一区二区三区| av在线播放观看| 亚洲欧洲一二三| 欧美理论在线播放| 插插插亚洲综合网| 午夜精品美女自拍福到在线| 老牛嫩草一区二区三区日本| 成人福利免费观看| 永久免费毛片在线播放| 国产丝袜视频一区| 粗暴蹂躏中文一区二区三区| 一区二区三区四区在线播放| 国产资源一区| 欧美在线视频日韩| 激情av综合网| 91嫩草国产线观看亚洲一区二区| 欧洲亚洲一区二区| 上原亚衣av一区二区三区| 成人免费一区二区三区在线观看| 国产一区视频在线观看免费| 欧美激情网站在线观看| 欧美日韩视频免费观看| 日韩女优制服丝袜电影| 久久综合色之久久综合| 色偷偷噜噜噜亚洲男人| 欧美va天堂| 免费网站成人| 日韩欧美国产中文字幕| 欧美老肥妇做.爰bbww| 日韩第一页在线| 久热精品视频在线免费观看| 久色乳综合思思在线视频| 免费网站免费进入在线| 精品奇米国产一区二区三区| 亚洲一区二区3| 奇米色一区二区三区四区| 国模一区二区三区私拍视频| 久久一区二区三区喷水| 午夜精品一区二区三区三上悠亚| 欧美精品一区二区三区久久久竹菊| 九七影院97影院理论片久久| 国产精品日本一区二区| 成人福利免费在线观看| 自拍视频在线| 黑人巨大精品欧美一区二区一视频| 97人人做人人爽香蕉精品| 中文字幕日韩欧美在线| 日韩在线播放视频| 亚洲444eee在线观看| 国产中文一区二区| 久久一夜天堂av一区二区三区| 在线观看av不卡| 欧美精品乱码久久久久久| 奇米精品在线| caoporn97在线视频| 日韩一区二区三区在线观看| 亚洲欧美日韩国产成人精品影院| 日韩成人精品一区二区三区| 亚洲视频精品| 精品午夜一区二区三区在线观看| 亚洲另类春色校园小说| 国产蜜臀av在线播放| 亚洲国产天堂网精品网站| 日本一区二区在线播放| 国产一区二区丝袜高跟鞋图片| 国产91在线观看| 欧美激情第一页在线观看| 美脚恋feet久草欧美| www欧美在线观看| 免费看av不卡| 欧美一区二区二区| 亚洲人成伊人成综合网小说| 日韩电影中文字幕在线| 超碰免费公开在线| 欧美色资源站| 亚洲黄色av一区| 欧美丝袜第三区| 亚洲第一国产精品| 日韩中文字幕在线视频| 亚洲xxxx18| 中文字幕av一区二区三区高| 国产精品日本欧美一区二区三区| 亚洲欧美乱综合| 欧美亚州韩日在线看免费版国语版| 日本一区二区三区中文字幕| 你懂的在线观看一区二区| 日韩欧美区一区二| 在线观看国产精品日韩av| 日韩在线电影一区| 国产精品视频内| 成人免费a**址| 欧美在线你懂得| 四虎影视永久免费在线观看一区二区三区| 亚洲一二三四在线观看|