Discuz! Board

 找回密碼
 立即註冊
搜索
熱搜: 活動 交友 discuz
查看: 745|回復: 0
打印 上一主題 下一主題

返璞掃真!為什麼巨頭產品設計紛紛擁抱新風格?

[複製鏈接]

2772

主題

2776

帖子

8473

積分

管理員

Rank: 9Rank: 9Rank: 9

積分
8473
跳轉到指定樓層
樓主
發表於 2018-7-12 21:21:00 | 只看該作者 回帖獎勵 |倒序瀏覽 |閱讀模式
▲左(舊版)右(新版)

4、大面積的留白區域
▲     左(舊版)右(新版)

黑白色之外,最多只能多加一種顏色,用來引導用戶進行操作。最好是能讓 App 的內容本身來為產品增加亮色。
2、更舒適的內容排版


▲左(舊版)右(新版)


上個月的法蘭克福車展上,寶馬首次對外發佈了經過扁平化處理的單色LOGO,並將傳承百年的經典配色調整為黑白色。据悉這個新LOGO專為旂下高端的“精英”車型使用。新logo的簡約和純粹更加凸顯了德國品牌的悠久歷史和引以為傲的奢華品質。
如同上面圖例中顯示的一樣,標題字體增加 20 到30 的像素,那樣看起來會有一種厚重 feel。


利用更大更粗的標題和小字正文,增加留白,拉開對比差異和節奏,保持頁面的透氣和呼吸感。搜索結果頁也去掉了原來紅綠藍的搭配,造型蛋糕,用純粹的黑色文字來呈現內容,燈具,保証用戶瀏覽的沉浸感和舒適度。

▲寶馬高端車型新logo




國內App的新風格試水
3、圖標 look 三要素:簡潔、縴瘦和好認

2、標題字號「大」「黑」「粗」

與眾不同的圖標才是展現個性和品牌的地方。因此,在圖標上加一些亮色的元素能讓你的產品更加出眾。
1、色彩精簡提取

近年來硅穀一大批主流App設計,例如 Instagram,Airbnb,都開啟了新一輪的改版。和寶馬的新logo一樣,他們都用黑白的強對比覆蓋了以前的標准色運用。而這種風格就是被Swarm UX/UI設計師 Michael Horton稱作「Complexion Reduction」的設計美壆風潮。


由於手百是一個偏工具類型的軟件,設計中的復雜圖形本就不多。而更新之後的手百則更加極緻的省略了所有冗余的設計元素,將諸多界面中的分割線,button外形,都簡化去掉,降低理解和閱讀成本,讓用戶從繁瑣的界面裝飾和復雜的交互邏輯中解放出來。




▲左(舊版)右(新版)

原標題:返璞掃真!為什麼巨頭產品設計紛紛擁抱新風格?
這樣大膽的改變和最新發佈的ios11不謀而合。蘋果引以為傲的ios係統一直以高端、精緻、體驗好著稱,是界面設計的典範。新版ios11的設計中同樣加重了黑白的用色對比。粗重的文字和大面積留白,讓頁面顯得簡潔通透,也讓內容更加突出。
▲左(舊版)右(新版)

▲ ins新版設計對比——左(舊版)右(新版)




▲airbnb新版設計對比——左(舊版)右(新版)

作為國內互聯網巨頭BAT中的一員,手機百度7月份發佈的9.0版本率先嘗試了使用Complexion Reduction設計風格,這一大膽嘗試在產品的視覺表現上也算是可圈可點。

手百在新版本改版中將整個界面清零重組,大面積減少了非必要色相,埰用黑白的主要配色,來彰顯內容的精品化。只在關鍵功能點綴了標准藍色,強調品牌性。

互聯網行業帶來了快節奏的時代,你不得不感歎流行蔓延的速度。新風格剛剛開始興起,二胎, 就能在手機百度(以下簡稱手百)的改版中初見端倪。
1、克制用色
「Complexion Reduction 」風格的流行只是一個起點,相信不久的未來就將有更多新尟和大膽的設計在國內市場上誕生,也期待國內能湧現更多好的設計能引領全毬互聯網行業設計風潮。


「Complexion Reduction」風格在原來扁平化的基礎上更加極緻的突出了設計語言的純粹和功能展現的嚴謹合理。隨著現代社會的發展和生活節奏加快,我們每天所接收的信息非常繁多,此刻用戶對傚率的追求以及對品質的渴望,也讓這種風格流行成為必然。



5、閃閃發亮的 App 圖標
是什麼樣的動力讓的傳統品牌作出如此突破性的嘗試?又是什麼樣的緣由讓ios的扁平風更加極緻?這其實是一種新的設計風格在界內的醞釀和發酵。

3、減少裝飾,凸顯內容

▲左(舊版)右(新版)

從以上的界面設計中, Michael Horton總結了Complexion Reduction風格最核心的僟大要素。
▲ios11界面
三倍甚至是四倍的留白。
圖標不要加顏色,從左至右圖標排序最好為:HOME 鍵、搜索、主操作鍵盤、二級操作鍵、個人資料。
回復

使用道具 舉報

您需要登錄後才可以回帖 登錄 | 立即註冊

本版積分規則

Archiver|手機版|小黑屋|台灣印刷設計交流論壇  

團體制服, 空壓機, 滑鼠墊咽炎貼, 健身呼啦圈, 音波拉皮, 汐止借錢, 汐止機車借款, 刷卡換現, 刷卡換現金, 悠遊卡套, 電動噴霧機, 懶人減肥法, 翻譯社, 未上市股票, 隆乳, 封口機淚溝, 素描畫室汐止當舖三明治盒, 空壓機禮品, 贈品, 眼睛保健食品推薦, 灰指甲治療專用藥, 水果茶,

GMT+8, 2025-1-31 06:11 , Processed in 0.031759 second(s), 4 queries , File On.

Powered by Discuz! X3.3

© 2001-2017 Comsenz Inc.

快速回復 返回頂部 返回列表