算法驅動的設計:人工智能如何改變設計?
未來不是雇用越來越多的設計師,更多常規工作都交給計算機。玩轉字體的將是計算機!
我關注算法驅動設計這個理念好幾年了,這種設計方法的工具能幫我們構建UI,儲備組件和內容,定制個性化用戶體驗。但相關方面的資源一直不多,而且沒有系統性。
然而,到了2016年,它的工具的技術基礎得到發展,設計社區也開始對算法,神經網絡和人工智能(AI)產生興趣?,F在我們重新思考設計師在新時代的這個角色也變得合乎時宜。
用Prisma and Glitché處理過的相冊封面
機器人會取代設計師?
目前業內算法驅動的設計最令人矚目的成就來自The Grid網站。這個網站能自動選擇模板和內容呈現樣式,修飾和整理照片。此外,系統給用戶提供A / B測試(對比測試),讓用戶選擇最合適的版本。產品目前仍處于測試階段,我們現在只能通過其出版物和廣告來了解它。
The Grid
算法完全替代設計師的這個想法聽起來像是對未來的預測,但其實整個想法是錯誤的。產品設計師的工作不可替代:產品設計師能將最初的產品理念轉化為一個精心設計的用戶界面,這種用戶界面有一定的互動原則,良好的信息架構和視覺風格,因此他們能幫助公司實現其業務目標并強化其品牌。
設計師在設計過程中還需要做很多大大小小的決定 ; 很多決策是不能用清晰的流程進行描述。另外,一個項目的需求并不是100%清晰和一致,因此設計師必須幫助產品經理解決這些問題 ,才能拿出更好的產品。這不是僅僅選擇一個合適的模板和填充內容就能做到的。
然而,如果是創造性的合作的話,比如設計師與算法并行一起解決產品問題時,那么未來我們可以看到很多優秀的作品和實力。算法可以改進我們在網站和APP上的一些常規工作,這也是它的有趣之處。
設計師與算法的創意協作
現在設計師已經能嫻熟地使用許多工具和技能,因此才出現了“ 產品設計師 ”這個新的術語。產品設計師是一個產品團隊的最活躍的成員,他們了解用戶研究的運作,他們可以做交互設計和信息架構,他們可以創建視覺風格,他們可以用運動設計讓靜態界面充滿動感,并對代碼進行簡單的更改。因此這一類人對任何產品團隊來說都是不可替代的。
然而,平衡這么多技能通常很難 – 產品工作的各個方面你不可能親力親為。當然,最近新出的一些設計工具縮短了從開始到交付所需的時間,進一步擴展了我們的能力。然而,這些工具仍有局限性。整個環節中仍有過多的常規工作和新的問題,它們仍在不斷消耗這些工具幫我們節省下來的時間。我們還需要將我們的工作流程進一步地自動化和精簡化。主要從以后三個環節入手:
- ?構建UI
- 儲備組件和內容
- 定制個性化UX
我會給出一些例子,針對這三個工作環節提出新的工作方法。
構建UI?
像Medium,Readymag和Squarespace這類排版工具已經簡化了作者的工作,無數的高質量模板給作者提供了漂亮的設計,作者不需再花錢請設計師設計。未來這些模板會做得更智能,設計的難度變得更低。
Medium
Readymag
Squarespace
比如,The Grid網站雖然還在測試階段,Wix網站已經取得成功,它的設計開始具備算法驅動特點。這家公司對外公布了Advanced Design Intelligence功能,這個功能類似于The Grid的半自動化設計方式,非專業人士從此也能創建網站了。Wix提供許多高質量現代網站的示例來教授算法。此外,它提出風格方面的建議與客戶行業相符合。非專業人員很難挑選出合適的模板,像Wix和The Grid這樣的網站就成為他們的設計專家。
Wix的Advanced Design Intelligence功能
當然,像The Grid網站在創建過程中完全沒有設計師的參與,得到的設計結果是老套和平庸的(即使它提高行業的整體質量)。但是,如果在這個過程設中設計師能與計算機進行“搭檔設計”,那么我們可以輕松解決許多常規的工作。比如,設計師可以在Dribbble或Pinterest上創建一個情緒板,然后算法可以快速地將這些收集的風格運用到原型中,生成一個合適的模板。在這個協作過程中,計算機將成為設計師的學徒,設計師則是這些學徒的藝術總監。
當然,這種設計方式創造不出一個革命性的產品,但我們可以有更多的時間創造一個。此外,許多日常工作實際上是功利主義的,不需要去變革。如果一個公司非常成熟,有自己的一個設計系統,那么算法可以使這個公司更強大。
例如,設計者和開發者可以一起定義包括內容,環境和用戶數據的邏輯,平臺將使用這些原理和不同的版本來生成設計。這樣我們就可以對特定使用場景的細節進行微調,而無需手動繪制和編碼幾十個屏幕配適。Florian Schulz向我們展示了如何使用插值的想法創建組件的不同屏幕配適。
我從2012年左右對算法驅動設計產生興趣,當時我在Mail.Ru Group的設計團隊接到一個自動化的雜志排版的需求?,F有內容的板式結構已經過時,但手動更新成本太高。我們需要幫他們解決的是即使主編不是設計師時,他們依然能得到不錯的現代板式設計。
一個特殊的腳本會自動解析一篇文章,腳本再根據文章的內容(文章的段落數和每段的單詞數,照片數量及其格式,插入的引號和表格等),選擇出文章最適合的板式來呈現。腳本還會混合不同板式,最終得到的設計富于變化。這樣可以編輯幫助節省調整過時板式結構的時間,設計人員也只需要添加新的演示模型。Flipboard在幾年前也推出了一個非常相似的模型。
Flipboard排版系統
Vox Media 用類似的想法創建了一個主頁生成器。它的算法可以找到網上所有有效的布局方式,對組件庫里的不同元素進行組合。再根據某些特性對每種布局方式進行檢查和評分。最后,主頁生成器會選擇出“最佳”布局方式 :基本上是得分最高的布局方式。這比手動去尋找這些元素更有效,推薦引擎Relap.io也使用同種方法。
Vox的主頁生成器
Relap.io
儲備組件和內容
設計師最無聊的工作之一是創建不同版本中普適的圖形切片。這個工作需要花很多的時間,而且令人沮喪,設計師可以把這個時間花在更有價值的產品工作中。
算法可以分擔一些簡單的工作,比如說顏色匹配。Yandex.Launcher用算法根據APP圖標自動生成APP的配色。其他變量都可以自動生成,如根據背景色改變文字顏色,突出照片中人物的眼睛來傳達某種情感,貫徹參數排版。
Yandex.Launcher
算法可以創建整個板式組合。Yandex.Market使用促銷圖像生成器來制作電子商務產品列表。營銷人員只需要用一個標題和一個圖像填寫一個簡單的表格,生成器據此提出了無數的不同版本,所有這些都符合設計指南。Netflix的做法更勝一籌 ,它用腳本裁剪海報中電影角色,再制作出一個風格化和本地化的電影標題,然后對一部分用戶進行自動測試。Engadget已經培養了一個機器人學徒來寫小工具的新聞報道。
Netflix電影廣告
engadget
真正的黑魔法是在神經網絡領域。Prisma app將照片風格化處理,使照片看起來像著名藝術家的作品。Artisto也用類似的方式處理視頻(甚至流式視頻)。
Prisma
Artisto
然而,所有這一切仍處于早期階段。當然,你可以在你的手機上下載一個APP,并在幾秒鐘內得到一個結果,而不需要在GitHub資源庫中苦苦尋求。但是如果沒有教授給神經網絡,你依然不能生成你自己的參考風格,并且得不到一個理想的結果。然而,當神經網絡足夠強大時,插畫師就過時了嗎?我想神經網絡還無法撼動那些具有堅實和獨特的風格的藝術家的地位。但如果你的文章或網站需要得體的插圖,不要求有特殊的處理方法時,神經網絡就可以處理了。
對于真正獨特的藝術風格,神經網絡可以幫助我們快速生成一個風格化草圖。在動畫片《料理鼠王》中,皮克斯的藝術家嘗試將幾種不同的風格運用到電影的場景和角色中,如果未來用神經網絡來繪制這些草圖呢?我們也可以創建故事板和運用漫畫來描述場景(照片可以很容易地轉換為草圖)。當然神經網絡還可以運用到很多地方。
最后,神經網絡還可以用到動態標識中。動畫在品牌化中變得非常受歡迎,例如,Wolff Olins為Brazilian telecom提供了一個動態?Oi?標識,這個標識能對聲音做出不同的反應。如果沒有一些創造性的協作與算法,你是創造不出這些好玩的東西。
Brazilian telecom Oi
定制個性化用戶體驗
如果想獲得清晰和完善的需求,可以為精準的受眾群體甚至特定用戶制定個性化產品,如Facebook的新聞推薦,Google的搜索結果,Netflix和Spotify的推薦,以及許多其他產品。定制用戶體驗除了能減輕用戶過濾信息的負擔之外,當產品開始關心用戶的需求時,用戶與品牌的關系變得更加密切。
然而,關鍵問題是設計師在這些解決方案中所起的作用。我們很少會具備創建這樣的算法的能力 —— 工程師和大數據分析師才能做到。CX Partners的Giles Colborne從Spotify的Discover Weekly這一功能看到其中的運作:這個產品中唯一的由傳統UX設計的元素是播放列表,而個性化的工作則是由一個推薦系統完成,這個系統用好的音樂填充這個設計模板。
Spotify的Discover Weekly功能
Colborne向設計師提供如何在這個新時代實現其價值的建議,以及如何使用各種數據源來構建和教授算法。了解如何使用大數據并將其集成為可操作的洞察力非常重要。比如,Airbnb學會如何回答這個問題:未來某一天的預訂房價會是多少?,這樣老板就可以制定有競爭力的價格。Netflix的推薦引擎也可以舉出無數的例子。
Airbnb
一個相對較新的術語:“ 預期設計 ”,從宏觀角度說明UX個性化和用戶期望。我們的手機上有類似功能:Google會使用位置歷史數據自動提供回家的路線,Siri提出了類似的想法。然而,關鍵因素是信任。為了執行預期的經歷,用戶必須允許大公司在后臺收集個人使用數據。
我已經提到了Netflix、Vox Media和The Grid的設計的不同版本的自動測試。算法還可以通過另外一種方式個性化UX。Liam Spradlin描述了突變設計的有趣概念,它是一個很好的自適應界面模型,可以根據特定的用戶采用不同變量。
設計師的裝備
我已經舉了幾個算法驅動設計的現實例子。那么,現代設計師需要用到什么工具呢?如果我們回顧上世紀中葉,計算機被看成是擴展人類能力的一種方式。Roelof Pieters和Samim Winiger詳細分析了計算歷史和增強人類能力的想法。他們提到設計工具發展的三個階段:
- 第一代系統,能夠模擬具有數字處理手段的工具。
- 第二代是輔助創新系統,人和機器通過密切的行為反饋循環來協調創新過程。
- 第三代是輔助創新系統3.0,它通過更加精準的對話、增強創新能力、并加速從新手到專家的技能獲取來協調創新過程。
Creative AI
算法驅動的設計應該是產品設計師的裝備:增加決策通過的數量和深度。設計師和計算機應該如何合作?
未來數字產品設計師的工作流程看起來可能像這樣:
- 探索問題空間,并選擇業務和用戶需要解決的最有價值的問題(分析工作)。
- 探索解決方案空間,并選擇最佳解決方案來解決問題(分析工作)。
- 開發、發布和推廣解決這個問題的產品(綜合工作)。
- 評估產品如何為真實用戶服務,并優化產品(分析和綜合工作)。
- 將解決方案與公司的其他產品和解決方案相聯系和統一(綜合工作)。
這些工作分成兩種類型:隱式表達信息和正在進行的解決方案的分析,及其需求和解決方案的綜合。我們分別需要哪些工具和工作方法?
分析工作
如果用戶的隱式表達信息可以用定向研究,這種分析很難自動化。但探索現有產品的用戶使用模式是可以做到的。我們可以提取行為模式和受眾群體,然后再優化UX。廣告定位已經開始采用,算法可以使用隱式和顯式行為模式(在特定產品或廣告網絡內)對用戶進行集群。
為了訓練算法為這些用戶集群優化界面和內容,設計者應該研究機器學習。喬恩·布魯納提供了一個很好的例子:遺傳算法從對期望結果的基本描述開始。比如,優化航空公司的時間表可以節省燃料和便利乘客。它增加了各種約束:航空公司擁有的飛機數量,它運行的機場,以及每個飛機上的座位數量。它加載了自變量:現有的時間表上的數千航班的數據,或者可能隨機生成的虛擬信息。通過數千,數百萬或數十億的迭代,時間表逐漸得到改善,變得更高效方便。算法還理解了時間表的每個元素( 如37號航班從O’Hare的起飛時間)如何影響燃油效率和乘客便利的他變量。
在這種情況下,人類策劃一個算法,可以添加或刪除限制和變量。結果可以通過對真實用戶的實驗來測試和改進。利用持續的反饋循環,該算法也改進了UX。雖然這項工作的復雜性證實了分析師在執行這部分工作,設計師應該知道機器學習的基本原則。O’Reilly就這一話題最近出版了一本書。
綜合工作
兩年前,一個叫Autodesk Dreamcatcher的工業設計師工具很流行。它是基于生成設計的理念,生成設計已經用于性能、工業設計、時尚和建筑很多年。許多人知道Zaha Hadid Architects建筑設計公司; 它把這個方法為“ 參數設計 ”。
Logojoy這個產品能替代自由職業設計師進行簡單標志設計。你選擇喜歡的風格,選擇一種顏色,Logojoy能生成很多不同的方案。你也可以優化一個特定的標志,查看該標志與企業風格搭配的情況,并訂購一個包括名片和信封的品牌套餐。這個工具完美詮釋了算法驅動的設計的運用。創始人Dawson Whitfield 描述了它背后的機器學習原理。
Logojoy
然而,機器學習還沒有運用到數字產品設計,因為它解決不了實用性問題。當然,建筑師和工業設計師的工作本身有足夠的限制和特殊性,但用戶界面不是靜態的 —— 它們的使用模式、內容和特性隨時間而變化,而且變化較頻繁。然而,如果我們考慮整個生成過程 —— 設計者定義規則,算法用規則創建最終對象 —— 我們可以獲得很多靈感。數字產品設計師的工作流程可能像這樣:
- 算法用預定義的規則和模式生成設計的不同版本。
- 基于設計質量和項目要求篩選結果。
- 設計師和管理者選擇最有趣和得體的版本,進一步優化最終結果。
- 設計系統針對一個或多個版本進行A/B測試,而人從中選出最有效的方案。
目前還不知道如何在數字產品設計中過濾掉大量的概念,因為數字產品設計的使用場景非常多樣化。如果算法可以過濾生成的對象,我們的工作將變得更有成效和創造性。然而,作為產品設計師,我們每天都使用到生成設計,不管是在頭腦風暴會議中,我們需要提出了幾十個想法,還是當我們在屏幕模型和原型上迭代時。為什么我們不能將這部分工作交給算法呢?
JON GOLD LINK的實驗
The Grid公司的Jon Gold 開發了一個實驗性的工具Rene。Jon Gold 教授一臺電腦做有意義的排版決定。Jon Gold 認為這與人類設計師學習排版沒有差異,所以他把這個學習過程分為幾步:
- 分析字形以了解字體中的相似性。
- 制定組合字體的基本準則。
- 確定字體組合的最佳示例以了解趨勢。
- 創建算法學習優秀的設計師的案例。
他的想法類似于Roelof和Samim說的:工具應該是設計師的創造性合作伙伴,而不僅僅是機械的執行者。
Jon Gold的生成設計:似真的組合
Jon Gold的實驗工具Rene是建立在這些原則之上的。他還談到了編程的命令式和聲明式方法,并指出現代設計工具應該選擇后者 —— 關注我們想要計算的,而不是如何計算。Jon Gold使用生動的公式來展示這如何適用于設計,并已經做了幾個低級演示。你可以自己試用一下這個工具。這是一個早期的概念,但也可以讓你眼前一亮。
雖然Jon Gold開玩笑地稱之為“暴力設計”和“乘法設計”,但他強調了專業控制的重要性。值得注意的是,他今年早些時候離開了The Grid團隊。
工具已經存在?
令人遺憾的是,目前沒有像Autodesk Dreamcatcher一樣可以進行分析和綜合的用于網站和移動設備的產品設計工具。然而,The Grid和Wix可以或多或少被認為是質量水平過關的直接解決方案。Adobe不斷添加可以被視為智能化的功能:最新版本的Photoshop具有內容感知功能,當你使用裁剪工具旋轉圖像或擴展畫布超出圖像的原始大小時,它能智能填充空白。
Adobe和多倫多大學還開展了另一項實驗。它的DesignScape工具自動為你精簡設計布局。它也可以提出一個全新的設計方案。
你應該去關注Adobe公司的發展,因為該公司在MAX 2016會議上發布了一個名為Sensei的智能平臺。Sensei使用Adobe在AI和機器學習方面的深厚專業知識,它將為Adobe在消費者和企業產品中增加算法驅動設計功能奠定基礎。在其發布會中,公司提及諸如語義圖像分割的概念(顯示圖像中的每個區域,中間包含類型標記 —— 例如建筑物或天空),字體識別(即,識別創意字體并推薦類似字體,甚至包括手寫體),以及智能細分受眾群體。
Adobe?Sensei
然而,正如創造“人工智能”這個術語的計算機科學家約翰·麥卡錫(John McCarthy)說到:“只要我們成功了,我們就不再管它叫人工智能了”。曾經是最前沿科技的AI現在被認為是電腦的標準行為。這兒列出幾個實驗階段的想法和工具,未來可能就成為數字產品設計師日常工具包的一部分:
1. ? StyLit :從草圖創建一個3D模型。
2. ? 自動完成手繪動畫:微軟公司自動完成插圖和動畫的實驗階段工具。
但這些僅是未來的冰山一角。現在只是個別公司為簡化工作構建自定義解決方案。最好的方法之一是將這些算法集成到公司的設計系統中。目標都是類似的:自動化大量工作來支持產品線; 實現和維持統一的設計; 簡化上線流程; 更容易支持當前產品。
現代設計系統始于前端樣式指南,但這只是第一步(將設計集成到開發人員使用的代碼中),開發人員仍然手工創建頁面。下一步是使用預定義規則進行半自動頁面創建和測試。
結論
這是美好的開端,但我們應該記住算法的局限性 – 它們建立在人類定義的規則之上,即使規則現在通過機器學習來提高。設計師的強大在于他們可以制定和打破規則; 所以,在一年后,我們可能將“美麗”定義為完全不同的東西。我們的行業有高技能和低技能的設計師,算法將逐步取代后者。然而,那些可以在需要時去遵守或打破規則的人將會發現神奇的新工具和新的可能。
此外,數字產品越來越復雜:我們需要支持更多的平臺,為更多用戶群體調整使用場景,并提出更多的假設。正如Frog的Harry West所說,以人為中心的設計已經從對象的設計(工業設計)擴展到經驗的設計(包括交互設計,視覺設計和空間設計)。下一步將是系統行為的設計:決定自動或智能系統的行為的算法設計。未來不是雇用越來越多的設計師,更多常規工作都交給計算機。玩轉字體的將是計算機!
譯者:oftodesign
原文作者:Yury Vetrov(Mail.Ru Group的產品經理)
原文地址:https://www.smashingmagazine.com/2017/01/algorithm-driven-design-how-artificial-intelligence-changing-design/
本文由 @oftodesign 翻譯發布于人人都是產品經理。未經許可,禁止轉載。
厲害