新技能get√
靜悄悄地,
蘋果居然毫無征兆地在官網發布了全新一代的iPad(第十代)。
文案有點意思,可圈可點可畫心,說的都是畫畫的事。
而外觀設計,就毫無懸念,把第九代的圓邊框,變成了2年前的iPhone12開始改的直邊。
第九代(2021)
第十代(2022)
也用上了2年前的cpu,把祖傳A13,換成了祖傳A14.(要知道iPhone14pro已經用A16啦!)但是,它依然是同價位買得到最好的平闆電腦,這個才是氣人的地方,沒有對手,自己就開始龜速前進了。
壁紙和宣傳視頻是最大亮點,非常好看,上GIF圖大家感受下。
整個視覺的核心是由紅黃藍三個色塊構成,CMY三原色,真的怎麼看都好看。而質感上是最近很流行的毛玻璃效果。
是不是相當酷炫?
這種毛玻璃的質感将色彩變化表現得淋漓盡緻。
無獨有偶,
蘋果和老夥伴微軟也對毛玻璃效果針愛有加,前兩年office的宣傳視頻一出來,驚豔了不少人。
其實不止是蘋果和微軟,這幾年在設計界可以說是刮起了一陣玻璃質感的小旋風。無論是産品視頻、UI界面,還是海報、LOGO設計,都可以看到玻璃質感的應用。
來看一些案例。
圖标設計
相較于扁平風格的圖标,玻璃質感圖标看起來更加細膩、精緻;比純拟物圖标也更加清爽,統一。
除了界面設計中的圖标,在電商詳情頁面中,也可以看到玻璃質感的賣點圖标。
海報設計
玻璃質感的海報設計,看起來色彩明快,質感通透,能給人眼前一亮的感覺。
界面設計
這類界面風格大多将信息模塊化處理,然後采用貼片的視覺風格,再通過色彩與投影的處理,來突出玻璃質感。
LOGO設計
通常的做法是,将數字或者字母簡化成幾何圖形,然後在相應的幾何圖形上做出玻璃質感。可以讓LOGO看起來很靈動,有呼吸感。
從上面的應用案例可以看出來,玻璃質感絕對不僅僅是一種效果,而是進化成了一種設計風格。上面有些案例是用C4D等三維軟件來實現的,在表現玻璃的質感和光影方面,三維軟件當然有着無可匹敵的優勢。
不過,對于一些光影細節沒那麼複雜的玻璃質感,完全可以通過PS來實現!下面我就通過實操案例來教大家怎麼做。
OK,
廢話少說,直接實操案例走起來。
案例一
我們先來看看新iPad壁紙上的那種圓圈圈色塊怎麼做。
第1步,
用矢量圖形工具在畫面上拉兩個圓形。把色彩設置為經典的紅黃藍三原色。
第2步,
給圓形增加厚度。
做法很簡單,就是将圓形複制一層,往下移動幾個像素,再将顔色加深一點,最後在邊緣處用細線添加一道高光。
第3步,
将兩圓相交的部分挖出來,放到最頂上。
第4步,
用濾鏡>模糊畫廊>鏡頭模糊,把相交的部分模糊掉,這樣就有了逼真的半透明磨砂的效果了。
效果是這樣的:
第5步,
接着我們再加入人物和其它信息,把它做成一張海報。
第6步,
摳好圖。
第7步,
排版好文案信息,再添加一點紋理細節。
OK,一張非常有青春活力的海報完工!
走着,下一個案例。
案例二
案例二我們來看看規則幾何圖形的玻璃質感怎麼做。
第一步
先随便打幾個字,選擇偏現代簡潔、粗壯一些的字體。
第2步,
添加背景色塊,讓文字和色塊傾斜一下,呈透視的角度。
第3步,
我們想讓整體呈現出UI控件的風格,所以将色塊做成浏覽器窗口的效果。
第4步,
接着最上面的層級上添加一個色塊。将色塊複制兩層,并且錯開一定的位置,底下那層填充深色,這樣就可以形成厚度的效果。
第5步,
對玻璃塊的細節進行調整。
将上面那層的透明度降低,這樣就形成了玻璃半透明效果。接着對玻璃的轉角和邊框高光等細節進行處理。
第6步,
添加文案。
第7步,
将與玻璃塊疊加部分的内容模糊掉,這樣毛玻璃的效果會更加明顯一些。接着添加3D小人素材等細節來豐富畫面層次感。
OK,
一張UI控件風格的海報完工。
這類海報為了形成豐富的層次感,通常會有很多元素的疊加,要注意元素之間的主次避讓關系,不要造成主次混亂。
好了,
下一個案例走起。
案例三
案例二做的是規則的幾何形玻璃,其實從技術的角度沒什麼新意,關鍵是細節處理,有PS基礎的同學做起來沒有任何壓力。
下面我們升級一下難度,來看看不規則的有機形圖形如何做成玻璃形态的。
第1步
先畫個圓。
第2步,
給圓添加圖層樣式,主要有兩步。
1、添加漸變,我用的是藍色到紫色的漸變:
2、接着添加浮雕效果,參數大家可以自己看着調,注意光澤等高線那裡,選一個相對複雜一點的等高線,這樣可以讓你的邊框有更複雜的立體效果。
進到等高線面闆,選一個等高線。
好了,
操作完上面的選項,就可以得到下面的效果。
第3步,
在圓形的圖層上,新建一個蒙版,縮小一些,然後用黑色填充,将中心部位掏空。
第4步,
接下來我們再選中畫筆工具,将透明底降低,并且設置前景色為白色,對蒙版進行操作,将圓的中心部分擦出來。
這裡需要注意兩點:
一是畫筆的透明度要低,10-20%左右。
二是,畫筆一定要對蒙版進行操作,而不是塗圓本身。
我錄了個屏,大家看下:
第5步
塗完之後,就可以看到下面的效果。
給背景添拉一個漸變,
再給圓添加投影,這樣它的體積感就更明顯了。
第6步,
到這裡,玻璃質感已經很不錯了。但我們想要的是不規則形狀,需要對它進行調整。
ctrl t,點右鍵,調出“變形”菜單,對圓進行變形處理。
第7步,
一通操作下來,就得到了一個非常漂亮的玻璃質感的有機圖形。
弄兩個泡泡組合一下,
就能得到一張漂亮的壁紙。
用來包裝UI界面,随便去behance上截一張設計圖放上去,最終效果非常不錯。
換個顔色試試?
随便打幾個字,
就是一張逼格很高的海報!
怎麼樣,
學廢了嗎?
今天的内容就到這。
走了~
,更多精彩资讯请关注tft每日頭條,我们将持续为您更新最新资讯!