設計每週清單

專注於網際網路設計領域內容,分為熱點資訊、軟體工具、設計經驗、案例研究、網站推薦、深度思考等欄目。

關注「伴星流形」公眾號(ID:designforward),及時獲取設計優質內容推送。

熱點資訊

2017谷歌I/O大會全面轉向AI First:在這次Google I/O 2017正式宣佈谷歌戰略從 Mobile First(移動先行)全面轉向 AI First (人工智慧先行)。對於網際網路設計行業是否會帶有一定的影響呢?例如 Google Assistant 中類似Siri一樣的對話式 UI 互動,chen。

Sketch 44 版本更新:改進了Artboard的選擇切換,並且支援Artboard內容大小自適應調整; 帶來了自適應佈局功能,可以減少對AutoLayout等自動佈局外掛的依賴;支援管理丟失的字型,替換為所選字型;改善了圓角處理方式,過窄過寬的角也能完美適應。

Google公開了Auto Draw的所有繪圖資料樣本 超過1500萬用戶在 之前Quick, Draw! 中貢獻了這5000萬份繪圖資料樣本,用於訓練 Auto Draw(根據繪製的圖形,自動修正提供繪製好的圖形的工具)。

軟體工具

SVGito:專門針對於Sketch匯出的SVG檔案,可以壓縮檔案大小的同時保持設計樣式不改變。

互動原型工具清單:列出目前60+互動原型工具,大多都是可以快速製作原型、動效、匯出到開發等。但推薦影響力比較大的幾個:Adobe XD、Principle、ProtoPie、Axure、Flinto、Framer、InVision、UXPin、Kite Compositor、墨刀、Origami Studio、Craft、Launchpad、Webflow。

Craft外掛:Sketch外掛,這周更新版本後支援直接在 Sketch 上製作原型。並且可以同步設計稿到InVision用於線上展示。

Brand。ai:設計元件管理系統,可以輕鬆從庫中拖動元件於Sketch中設計,同時支援匯出到開發並自動同步樣式。配合 UX Power Tools 使用效果更佳。

設計經驗

移動端橫向列表最佳實踐:一些關於橫向List需要注意的點:前後遮顯關係的視覺暗示,使用“檢視所有”按鈕,響應式設計適應pad端瀏覽,在pad端只顯示有限內容,滑動時會自動吸附到端點。

AI向量icon繪製技巧:介紹了一些不錯的畫icon小技巧。例如畫愛心,一般人會想到勾外輪廓,實際上只需要三個錨點就可以了。而且這種方法還有個優勢,可以直接調成貝塞爾曲線,即可改變愛心的弧度。另外可以檢視作者收錄的更多繪製技巧gif。

設計檔案(Sketch)命名規範:第二部分細緻說明了Sketch檔案的命名以及它的圖層的整理。

又一篇VR設計師指南:系統的列出了設計方法、設計工具、互動基礎。

Sketch動態ICON:設計一套ICON,和顏色模版,可以動態地修改ICON並使用不同的顏色。

案例研究

Spotify 互動分析和Redesign:對Spotify應用進行分析,然後進行了自發性的Redesign,是個不錯的案例研究。

設計靈感

聊天式UI:illusion。ai——提供對話式UI互動的工具。對比於常規網站的靜態的內容呈現,這裡採用了對話式氣泡UI進行互動,動態展示使用者需要的內容,有點類似遊戲類h5的選項對話。讓冰冷的網站更加親切擬人化,應該可以適用於某些場景。

滑動多選互動:很多App都支援輕掃刪除操作,是否可以有一個滑動多選的操作呢?連結中展示了在list上側滑的同時上下滑動,選擇更多內容一起執行操作的互動。

網站推薦

Your Majesty:對一些Redesign後的公司品牌作介紹,如:Samsung SmartThings 、adidas 、BMW 等。

UIPixels:免費Photoshop&Sketch原始檔下載:Mockup / UI Kit / ICON

深度思考

肖勇:設計教育不應停留在授“魚”和“漁”:08奧運會獎牌“金鑲玉”的主創設計師,央美設計學院教授,肖勇的訪談。

——-

以上設計每週清單(05。15-05。21)由 shengbanx 整理,轉載註明來源。

已建立小密圈「DesignerNews中國群」,追求優質設計內容的你,歡迎加入?