模式意味著重用箫措,這是《界面設(shè)計(jì)模式》想要傳達(dá)給我們讀者的思想核心寂曹。所以整本書(shū)收集了很多常用的界面設(shè)計(jì)模式哎迄,如何組織內(nèi)容,如何設(shè)計(jì)導(dǎo)航稀颁,如何組織頁(yè)面等等芬失,以供我們?cè)诶碚摰幕A(chǔ)上學(xué)習(xí)各種模式。雖然日常設(shè)計(jì)的工作中匾灶,我們能遇到很多模式,但是我只是孤立的看各個(gè)模塊租漂,而此書(shū)卻將各種情景下的模式進(jìn)行了梳理阶女,提供了各種解決方案。所以當(dāng)我重新審視之前遇到的設(shè)計(jì)工作哩治,才意識(shí)到界面設(shè)計(jì)模式是如此有據(jù)可循的秃踩。
但是作為翻譯后的中文版,有些內(nèi)容讀起來(lái)還是有些費(fèi)勁业筏,有些翻譯并沒(méi)有能夠結(jié)合中文的語(yǔ)言習(xí)慣憔杨。例如第八章的輸入提示(Input Hints)和輸入提醒(Input Prompt),在中文的語(yǔ)言環(huán)境下真的很難區(qū)分字面意思蒜胖,就算有文字和圖例消别,我還是混淆了抛蚤。
但在設(shè)計(jì)工作中如果遇到難題,書(shū)中的界面設(shè)計(jì)模式一定會(huì)是我參考和進(jìn)一步挖掘的依據(jù)寻狂。
第一章 ?用戶(hù)做些什么
本章分享了一個(gè)重要的觀點(diǎn)“好的界面設(shè)計(jì)并非始于圖片岁经,而是始于對(duì)人的理解”。所以本章的模式都是基于需求層面的場(chǎng)景下的行為模式蛇券,關(guān)注點(diǎn)始終立足于人缀壤,羅列了14種行為模式幫助我們?yōu)橛脩?hù)爭(zhēng)取更多的利益。
第二章 ?組織內(nèi)容:信息架構(gòu)和應(yīng)用結(jié)構(gòu)
本章從頁(yè)面的角度纠亚,將用戶(hù)使用頁(yè)面分為幾件事:顯示單個(gè)對(duì)象塘慕;顯示一個(gè)列表;提供工具來(lái)創(chuàng)建對(duì)象蒂胞;協(xié)助單個(gè)任務(wù)完成图呢。進(jìn)而細(xì)分出10種模式:主題搜索和瀏覽、新聞流啤誊、圖片管理器岳瞭、信息板、畫(huà)布加調(diào)色板工具條蚊锹、向?qū)ぁ⒃O(shè)置編輯器、可選視圖牡昆、多工作空間姚炕、多級(jí)幫助。
第三章 ?到處走走:導(dǎo)航丢烘、路標(biāo)和找路
根據(jù)不同頁(yè)面或空間的連接關(guān)系柱宦,本章分享了13種導(dǎo)航模型:清楚的入口點(diǎn)、菜單頁(yè)面播瞳、金字塔掸刊、模態(tài)面板、深度鏈接狀態(tài)赢乓、逃生艙忧侧、胖菜單、頁(yè)腳站點(diǎn)地圖牌芋、登錄工具蚓炬、序列地圖、面包屑層級(jí)結(jié)構(gòu)躺屁、注釋滾動(dòng)條肯夏、動(dòng)畫(huà)轉(zhuǎn)換。
第四章 ?組織頁(yè)面:頁(yè)面元素的布局
本章先討論頁(yè)面布局的幾個(gè)主要方面:視覺(jué)層次、視覺(jué)流以及怎樣使用動(dòng)態(tài)顯示技術(shù)驯击,介紹了四個(gè)重要的格式塔原則烁兰。隨后分享了13種頁(yè)面布局模式:視覺(jué)框架、中央舞臺(tái)余耽、對(duì)等網(wǎng)格彬坏、帶標(biāo)題的區(qū)域收叶、模態(tài)Tab翩蘸、手風(fēng)琴悼院、可收起面板、可移動(dòng)的面板袱耽、右/左對(duì)齊杀餐、對(duì)角線平衡、響應(yīng)式展開(kāi)朱巨、響應(yīng)式允許史翘、流體布局。
第五章 列表
本章先分析了列表的使用場(chǎng)景冀续,然后討論了列表的結(jié)構(gòu)琼讽,最后根據(jù)需求給出了一些解決方案。而這些解決方案最后呈現(xiàn)為12種列表模式:雙面板選擇器洪唐、單窗口深入钻蹬、列表嵌入、縮略圖網(wǎng)格凭需、傳送帶问欠、斑馬行、分頁(yè)粒蜈、條目跳轉(zhuǎn)顺献、字母表滾動(dòng)條、級(jí)聯(lián)列表枯怖、樹(shù)表注整、新列表行。
第六章 ?完成任務(wù):動(dòng)作與命令
本章專(zhuān)注于界面上的“動(dòng)詞”度硝,列出了一些常規(guī)的動(dòng)作表現(xiàn)形式设捐,以及一些創(chuàng)新型的擴(kuò)展邊界。最后分享了11種動(dòng)作模型:按鈕組塘淑、懸浮工具、動(dòng)作面板蚂斤、突出“完成”按鈕存捺、智能菜單項(xiàng)、預(yù)覽、進(jìn)度提示捌治、可取消性岗钩、多級(jí)撤銷(xiāo)、命令歷史肖油、宏兼吓。
第七章 ?顯示復(fù)雜數(shù)據(jù):樹(shù)、表格及其他信息圖形
本章先介紹了信息圖形的基礎(chǔ)森枪,就是帶著給用戶(hù)傳遞數(shù)據(jù)的目標(biāo)视搏,對(duì)數(shù)據(jù)進(jìn)行可視化展示。最后分享了11種顯示復(fù)雜數(shù)據(jù)的模式:總攬加細(xì)節(jié)县袱、數(shù)據(jù)提示浑娜、數(shù)據(jù)焦點(diǎn)、動(dòng)態(tài)查詢(xún)式散、數(shù)據(jù)刷筋遭、局部縮放、可排序表格暴拄、徑向表漓滔、多Y值圖、多個(gè)小對(duì)象乖篷、樹(shù)狀地圖响驴。其中大多數(shù)模式都是針對(duì)怎樣和數(shù)據(jù)進(jìn)行交互的,所以關(guān)于數(shù)據(jù)可視化的原理那伐、呈現(xiàn)和選擇更推薦《數(shù)據(jù)可視化》這本書(shū)踏施。
第八章 ?獲取用戶(hù)輸入:表單和控件
本章先介紹了表單設(shè)計(jì)的基礎(chǔ),都是圍繞用戶(hù)進(jìn)行的罕邀,隨后對(duì)于控件進(jìn)行了詳盡的分類(lèi)和介紹畅形。最后介紹了控件的11種模式:容錯(cuò)格式、結(jié)構(gòu)化的格式诉探、填空日熬、輸入提示、輸入提醒肾胯、密碼強(qiáng)度計(jì)竖席、自動(dòng)完成、下拉選擇器敬肚、列表構(gòu)造器毕荐、良好的默認(rèn)值、同頁(yè)錯(cuò)誤信息艳馒。這一章給我們團(tuán)隊(duì)內(nèi)部自己制定組件化管理提供了很多理論和實(shí)踐基礎(chǔ)憎亚,雖然是通用化控件员寇,但是表單中的控件不應(yīng)該是生硬冰冷的,它同樣也應(yīng)該有對(duì)于用戶(hù)的理解以及表現(xiàn)出最大的善意第美。
第九章 ?利用社交媒體
本章先討論了建立一些策略來(lái)使用社交媒體時(shí)蝶锋,應(yīng)該考慮的原則和模式,隨后分享了12種社交內(nèi)容制作的模式:編輯混合什往、個(gè)人聲音扳缕、轉(zhuǎn)帖和評(píng)論、發(fā)起會(huì)話别威、倒置納米金字塔躯舔、擇時(shí)策略、專(zhuān)用流兔港、社交鏈接庸毫、共享組件、新聞框衫樊、內(nèi)容列表區(qū)域飒赃、新近談話。
第十章 ?邁向移動(dòng)設(shè)計(jì)
本章首先討論了移動(dòng)設(shè)計(jì)的一些挑戰(zhàn)科侈,然后分析了如何進(jìn)行移動(dòng)界面設(shè)計(jì)载佳,最后分享了11種移動(dòng)端設(shè)計(jì)模式:縱向堆疊、膠片臀栈、觸摸工具蔫慧、底部導(dǎo)航、小圖片加文字的列表权薯、無(wú)限列表姑躲、寬邊界、文本清除按鈕盟蚣、加載提示黍析、應(yīng)用互聯(lián)、精簡(jiǎn)品牌形象屎开。移動(dòng)設(shè)計(jì)這幾年發(fā)展非常迅猛阐枣,所以這里分享的模式都是非常基礎(chǔ)的奄抽,針對(duì)于現(xiàn)階段的移動(dòng)設(shè)計(jì)模式蔼两,相信有更多可以擴(kuò)充的點(diǎn)。
第十一章 ?修飾外觀:視覺(jué)風(fēng)格和美感
“漂亮的細(xì)節(jié)并不一定會(huì)影響人們?cè)谶@所房子里完成任務(wù)的效率逞度。但是它確實(shí)會(huì)影響人們的心情额划,進(jìn)而影響到其他行為—例如,他們會(huì)在這里逗留和探索多長(zhǎng)時(shí)間档泽、是否選擇再次回來(lái)訪問(wèn)锁孟,以及是否會(huì)推薦給別人彬祖,等等∑烦椋”對(duì)本章的此段文字非常認(rèn)同,這也就是我們一直在做產(chǎn)品設(shè)計(jì)時(shí)強(qiáng)調(diào)品牌基調(diào)和美觀的重要性甜熔。不可否認(rèn)可用性和易用性是基礎(chǔ)圆恤,但美觀性是最能將產(chǎn)品的情緒傳達(dá)給用戶(hù)的。本章分享了7種修飾外觀的模式:深色背景腔稀、少一點(diǎn)顏色多一些價(jià)值盆昙、角落處理、邊界回應(yīng)字體焊虏、發(fā)絲淡喜、粗細(xì)字體對(duì)比、皮膚和主題诵闭。
基于對(duì)《界面設(shè)計(jì)模式》這本書(shū)的理解炼团,我相信在日常的工作和學(xué)習(xí)中可以沿襲這本書(shū)的思路,不斷擴(kuò)充和迭代更多的設(shè)計(jì)模式疏尿。