從捲軸消失看細節設計

我相信所有設計師都是注重細節的!即使有時迫于種種原因,無法達到像期望般完美,但心中一定有份糾結的堅持。

最近的專案中,給選擇器設計備選清單,發現了一個「由細節引發的細節問題」。下圖是示例。很簡單,在一個固定區域內做多選,當有很多備選時,滾動顯示更多內容。(原本意圖

圖A:原本的意圖,和期望達到的效果

但實現出來之後,發現一個問題:捲軸被隱藏掉了。只有當在備選內容區滾動滑鼠時,捲軸才會顯示出來。這會影響到使用者對這個功能區塊的認知,根本察覺不到還有更多內容。(出乎預料

圖B:捲軸不見了,這可不是我們期望的

經過調試發現仍無法控制捲軸的始終顯示,只好修改了設計。拉長區域高度,讓下面的內容露出一部分來。用不完整來暗示還有更多內容。當區域有滑動時,捲軸自己就出來了。(解決方案



圖C:用不完整的形態做暗示

回到問題上來。可能會受影響的是在Mac OS X 10.7.3上使用Webkit內核的瀏覽器(Safari或Chrome)的使用者們。究其最終原因,是因為一個系統預設選項(如下圖),「根據輸入裝置自動顯示」。這是蘋果的一個細節設計,可以根據滑鼠或觸控板等不同的輸入裝置,顯示或隱藏捲軸。

也正是因為它,如果你使用的是觸控板或Magic Mouse等觸控式滑鼠,就會發現,在Webkit內核的瀏覽器下,一些功能原本有捲軸,現在都消失不見了。簡單調整一下設計,就能比較好的解決這個問題了(如圖C)。

捲軸控制

再優雅的設計,有時候也可能會引發問題。作為設計師,得以同樣優雅的方式回應並解決問題。

源位址:HTTP://blog.b3inside.com/……etail-design/

特別注意:本站所有轉載文章言論不代表本站觀點,本站所提供的攝影照片,插畫,設計作品,如需使用,請與原作者聯繫,文章轉自alibuybuy

Comments are closed.