萬盛學電腦網

您现在的位置: 萬盛學電腦網 >> 程式設計 >  >> 網頁製作 >> 互動設計

界面隱藏設計藝術:恰到好處的「隱而不現,現而精準」

一句話總結:你剛好不經意地出現,而這正是隱藏的意義。

信息過載時代,處理界面信息層次是設計師必修課。隱藏非為躲貓貓,而是讓用戶聚焦核心內容,降低信噪比,提升傳達效率。借 D&D 盜賊(Rogue)潛行背刺為喻,優秀隱藏設計亦能一擊必殺。

固定場景下的隱藏:次要信息的歸宿

1. 不常變的設置

固定位置/功能,相對不重要、低頻、一次性設置時,合理組織後隱藏。

  • eBay / Apple 將賬戶、任務歸於「My eBay」固定模塊。
  • Amazon 豐富類目導航隱於 Logo 下,全站固定位置靜候喚醒。
  • 全站固定入口,隱藏兼顧認知一致與空間節省。

2. 指向外部目標

外部分享渠道多、變動大,全展示則複雜;相對固定,按需喚出。

  • 新浪微博、豆瓣電台用「···」收納分享渠道。
  • 豆瓣電台分享面板。

特定場景下的進階隱藏:關鍵時刻的「背刺」

高級盜賊只在該出場時亮相。特定閱讀場景下適時提示隱藏信息,大幅提升效率。

  • Chrome 選詞翻譯插件:選中文字時適時出現。
  • Apple ID 註冊:逐字段填寫時輸入框彈出即時 Tips。
  • 表單即時校驗提示:針對具體情況給出針對性指引。

四大精準提示技法(進階背刺心法)

1. 細微處——優雅恰好的提示

提示過強違背隱藏初衷。PS 工具欄右下小三角,優雅邀請探索更多功能。

2. 漸進提示——配合任務流程層層揭開

Pinterest 輸入框先提示「To 後輸入字符」,輸入後再提示發送渠道選擇。

Apple 註冊即時校驗同理。

3. 掃視/泛讀提示——小力撬動大關注

相比數字氣泡,小紅點足夠引起掃視聚焦。Giles Colborne:「把標籤放哪裡比做多大重要得多」。

4. 聚焦/專注任務時的提示——潛行背刺最給力一擊

  • LinkedIn Inbox:總覽時均衡羅列,聚焦條目時 Hover 出操作提示。
  • Path 加號:點觸後提示分類或關閉,邏輯延續。
  • 長按圖片顯示相關操作,滾動時右側提示發布時間。
  • Evernote 標籤過濾:推薦關聯標籤,高效檢索。
  • iPhone 搜索:瘋狂滑動找不到時搜索框悄然降臨,鍵盤提示輸入,點別處取消。

結語

成功的隱藏是為了適時的出現。在設計平衡觀下打出致命一擊,潛心進階技能,一擊中的,指日可待。

copyright © 萬盛學電腦網 all rights reserved