一年前翻譯了本文的一部分,最近終於翻譯完成。雖然此設計思想的提出已經好幾年了,但是還是覺得應該在國內推廣一下,讓大家知道「內容策略」,「移動優先」,「響應式設計」,「原子設計」等設計思想和技術的根源。這些概念最早其實是由
luke wroblewski
,brad frost
等人在同乙個設計思想框架下提出的。筆者經「
面向未來的友好設計
(future friendly web design
)」設計理念聯合創始人
jason grigsby
授權,將此設計思想框架首次翻譯為中文版本。
今天,聯網的移動裝置數量正在疾速增長,人們的上網習慣也在不斷改變,移動網際網路的浪潮方興未艾,作為設計師和開發者,需要了解以下幾個現狀:
裝置的碎片化問題凸顯。未來將誕生越來越多差異化的可訪問web的裝置,人們將通過各種奇葩網路環境來使用它們;
因移動裝置間的設計還原能力差異巨大,我們既往千辛萬苦沉澱的規範、工作流程、基礎框架將無法滿足裝置間差異化的設計需要;
解決方案總是優於規範而先出來的,在找到跨裝置、跨平台的通用解決方案之前,我們只能著手為若干目標裝置尋求單獨的針對性解決辦法;
跨平台的通用標準的建立是漫長而曲折的。在尋求解決辦法的過程中難免磕磕絆絆,乙個標準化的解決方案需要在不斷試錯的過程中逐步誕生。
道路是曲折的,前方是光明的。今後網路和裝置環境的發展會為我們帶來什麼,我們無法確知。但是無論如何,我們應該做到:
相信未來,擁抱未知;
在設計工作中學習和應用一些適應未來的設計思想,即面向未來的友好設計思想;
用上述思想去幫助和影響他人。
我們的設計應該對未來更加友好一些。我們應該通過對未來的**,選擇適合的技術,為人們創造出既滿足今天需要,又能夠適應未來變化的產品或價值。以下是一些有關產品、設計和技術的理論思考,如果你對這些理論有新的見解,或者另有蹊徑,請不吝分享出來。
我們不要去追求在所有裝置上展現全部的內容,我們需要判斷哪些內容是使用者想要看到的,然後通過合理的方法重新組織起來去適應使用者的裝置。要知道,使用者依賴自己的一雙慧眼去篩選自己需要的內容是需要大量做功的。我們可以通過一系列設計和技術方案使使用者在各種裝置上都能夠輕鬆愉快地獲取內容和服務。這種差異化的內容組織或設計方案,可以借鑑下面三種思想:
內容優先
移動優先
內容以使用者為中心
根據裝置的特點,在不同的裝置上使用獨特而靈活的方式來訪問資料;
同一服務在多裝置上的資料要遵守一定的規範;
注重資料長期的完整性;
內容中引用的參考文獻必須有意義且可以長久訪問;
cope原則:一處建立,多處發布
通過命令列來收集你所喜歡的bag(bagcheck)
資料的使用者體驗
經過合理組織的內容是設計的核心。既然我們只能讓內容去適應林林總總的裝置,我們就有必要盡可能地了解裝置間的差異、約束和限制。然後根據每種裝置的特點去針對性地進行設計。未來是多變的,適應方式也是多樣的。唯有大膽探索,合理**,才能找到合適的解決方案。
無論是高階的智慧型機,還是受較大限制的老舊裝置,裝置間內容互通的設計方案同樣也是面向未來的友好設計的一部分。
為未來準備好的內容
可適應的web內容
形式先於內容
面對著各種不同型別的裝置,設計工作無疑是個艱鉅的挑戰。履行web的標準化無疑是簡化設計工作的最好辦法,與之同時,根據每種不同裝置的識別資訊,進行個性化的調整,是完成設計工作必要的補充。
將當前需要適應的裝置進行分類,並將分類方法應用到今後可能出現的新裝置上。
裝置檢測
yiibu裝置資訊工具介紹
裝置差異和響應式設計
在我們的數碼生活中,每種裝置具有每種裝置的優勢。所以我們會選擇適合的裝置做適合的工作。當我們高效利用自己手中的若干裝置為自己的生活服務時,這些裝置就組成了乙個環繞我們的web生態系統。在這個生態系統中,裝置之間的關係並不是割裂的。而且只有在這個生態系統中,每個裝置才能最大化地發揮它的作用。而我們需要考慮的,就是如何利用這個生態系統來提高我們工作的能力和效率。
多屏生活
後移動裝置
考慮到感測器的設計
歡迎加入「面向未來的友好設計」。現在你是我們的乙份子了。你可以在你的工作中運用,或者向他人推廣這種設計思想。比方說你可以做如下的一些事情:
「面向未來的友好設計」描述的是一種設計原則,而不是一種特別的技術實現方案。具體的技術隨著時間推移,可能會發展繁榮抑或過時衰亡。同樣也沒有任何一種方法、技術,或者流程可以像萬金油一樣解決一切問題。「面向未來的友好設計」是一種設計哲學,這種思想應該是融會在技術之中的。
當你在設計工作中和同伴討論相關原則的時候,多使用「面向未來的友好設計」這個名稱,向同伴們推廣這個概念以及概念背後的原則。在微博中新增#ffly標籤,以及使用「面向未來的友好設計」的專用logo (.eps 或 .ai)。
向你的夥伴、下屬、老闆介紹「面向未來的友好設計」概念,分享我們的**。新概念的推廣肯定是有阻力的。嘗試將我們的設計概念和商業目標、使用者體驗、關係鏈提公升等硬指標聯絡在一起去解釋,也許就可以爭取到大多數人的認同。
檢查一下現在的專案目標,並且選擇符合「面向未來的友好設計」的技術方案去實現它。「面向未來的友好設計 - 思想」 中有你所需的學習資源。很多作者也在不斷豐富著我們的理論和技術文章,我們誠摯邀請你來檢查我們的工作,同時期待著你的分享:
andrea trasatti
brian leroux
bryan rieger
brad frost
jason grigsby
jeremy keith
josh clark
luke wroblewski
lyza d. gardner
scott jehl
scott jenson
stephanie rieger
tim kadlec
luke wroblewski
scott jenson
brad frost
jeremy keith
lyza d. gardner
scott jehl
stephanie rieger
jason grigsby
bryan rieger
josh clark
tim kadlec
brian leroux
andrea trasatti
響應式web設計創始人 ethan marcotte
移動優先的先行者 luke wroblewski
「面向未來的友好設計」概念的主要倡導者 brad frost
erin kissane: "內容策略的元素 the elements of content strategy"
ethan marcotte: "響應式設計 responsive web design"
luke wroblewski: "移動優先 mobile first"
karen mcgrane: "移動裝置上的內容策略 content strategy for mobile"
john allsopp: 網頁設計之道 a dao of web design(2000.4.7)
luke wroblewski: 移動優先 mobile first(2009.11.3)
ethan marcotte: 響應式設計 responsive web design(2010.5.25)
luke wroblewski: ress: 響應式設計+伺服器端的支援 ress: responsive design + server side components(2011.9.12)
mark boulton: 關於響應式設計的工作流程 responsive summit: workflow(2012.2.24)
thomas byttebier: 響應式web設計 responsive web design(2011.11.29)
pon kattera: 響應式設計時代的設計流程 design process in the responsive age(2012.6.21)
另外還有本人講述響應式設計的歷史和發展的ppt:「響應式設計:rebuild as design」,其中附錄的一些資源可以作為參考
「future friendly web design」設計思想原文:
思考面向未來的架構設計
今天接到乙個哥們兒的 說,很鬱悶,想和我聊聊。我問,有啥鬱悶的事情啊,說來聽聽。他說,最近很鬱悶,我本來今年的計畫是成為乙個架構師,但是,無論如何努力,都不知道為什麼,感覺希望很渺茫.這哥們兒其實是乙個很努力的傢伙,曾經是我team裡技術最好的程式設計師,對乙個技術不鑽明白不罷休的那種程式設計師。我...
面向未來的人才教育
以下主要內容來自王煜全的前哨專欄。根據社會趨勢,美國提倡的steam教育,s t e a m五個英文本母分別代表science 科學 technology 技術 engineering 工程 art 藝術 mathematics 數學 它們代表五種思維模式。舉個形象的例子,假設目前城市中存在物流效率...
面向未來的計算 IBM 鞠海
think with ibm international business machine think是ibm的靈魂 主題 技術趨勢,底層的基本要素的變化 消費網際網路,前端是應用,後端是神經網路等 18年大量的投資轉向人工智慧底層 晶元 做企業服務 不面向終端消費者 企業服務根本 解決企業的計算問...