為了達到簡潔、有品質感、內容突出這三點要求,我們可以接上文從配色、布局、圖標、文字和動效等方面進行設計。
1. 配色
配色上還是多數以藍色系或深色系為主,這應該已經是人們的一種固有印象了。當然暖色系也是有一些的,但數量占比相對較少,這一點需要結合自身產品的品牌色來決定。同時,運營方面的設計需要與之相匹配,方便日后的延展設計。
2. 布局
在界面設計趨于同質化的現在,落地的布局設計與「科技感」這個詞關聯性有限。需要注意的點應該就是元素之間的間距與整體的留白。內容排布過滿會顯得臃腫,且不易突出重點信息。to B 端的產品需要根據需求進行特殊優化。
(后臺相關產品容易產生「科技感」的原因是自帶的深色背景和數據可視化等因素影響。)
3. 圖標
圖標應該是除了 banner 外最能在頁面設計當中凸顯「科技感」的要素了。查看了一些相關的設計,發現此類圖標有幾個共同的特點:
用色肯定
簡潔留白
樣式豐富
4. 文字
接上文,受移動設備尺寸的限制,更加需要精煉文字。理想情況是用最簡短的話術突出核心賣點。切不可使用過多的文字,會使界面變得雜亂。
5. 動效
我們之前提到的有「科技感」的設計應當是簡潔、有品質感的,而好的動效可以增加這些特性。所以,個人認為優秀的動效應當是干脆、流暢、克制的。
干脆,可以給用戶及時的反饋;流暢,增強使用的體驗;克制,避免過度的炫技,造成用戶的審美疲勞。UI 動效不是影視特效,好的體驗應當是自然流暢的。
總結
以上,是我個人對「科技感」這個詞的相關設計如何落地的一些想法。整理下來,其中的關鍵點是:提取分析關鍵詞、搜索相關競品參考、挖掘其共性、構思差異化。
日常工作當中,我們也可以針對具體需求,按照此流程進行梳理,并制定成自己的方法進行延展。
歡迎關注作者的微信公眾號:「Fly Lab」