隨著CSS的廣泛應(yīng)用，透明元素在網(wǎng)頁設(shè)計中大量采用。

通過添加透明效果，可以增添頁面的對照感和可讀性，同時對整體的效果妨礙又不大，可謂一舉兩得。

一般來說，采用透明效果顯示區(qū)塊、展現(xiàn)數(shù)據(jù)，透明效果出現(xiàn)在很多輔佐元素當中，這樣前景元素就顯得非常突出。
讓我們來看看透明效果，這種優(yōu)雅而又華麗的效果。

Wavefront

整體構(gòu)成比較不拘一格，音樂節(jié)一般的氛圍。霓虹色彩，半透明區(qū)塊，讓色彩更加動感，很好的支持了主題。

Advies

頁面中含有很多透明條紋，中間的大區(qū)塊既不影響背景圖像的效果，也能很好的展現(xiàn)信息。

揭開iOS7扁平化的外衣，深入探索蘋果的新式設(shè)計語言，一起來猜想一下新的設(shè)計風格是如何在iWatch iTv iCar上實現(xiàn)。

當談到Jony Ive，我們就不得不談到他在iOS7上的大改造，普遍看法是，這種改變僅僅是外觀上的改變，換湯不換藥。

iOS7的神秘面紗于2013年6月揭開，設(shè)計靈感來自德國已故傳奇設(shè)計師Otl Aicher。
Jony Ive在iOS上決定采用扁平化風格，這就意味著以下幾點風格的轉(zhuǎn)變：

1、用色愈發(fā)大膽、鮮艷；
2、界面會擁有更多的留白空間，讓元素更好的呼吸；
3、字體運用會更加優(yōu)雅靈活；
4、即將使用大量的幾何形狀。

這就是Jony Ive摒棄擬物設(shè)計的原因。iOS7的推出，也可以看成是Jony Ive對擬物設(shè)計的宣戰(zhàn)。

iOS7的扁平化設(shè)計非常”萬金油”，不但適應(yīng)了今天的iPhone以及iPad設(shè)備，也能夠應(yīng)用于未來的iWatch,iTV,iCar等設(shè)備。

D.A：我們都知道不管網(wǎng)頁還是移動應(yīng)用，響應(yīng)速度都是最重要的體驗指標之一，并且移動應(yīng)用的網(wǎng)絡(luò)環(huán)境不穩(wěn)定，速度的體驗顯得尤為重要。其實速度優(yōu)化不僅是程序員的事，設(shè)計，也能夠讓App變得更快。

1.后臺執(zhí)行

這是一條很通用，也容易理解的方法。用戶不會愿意盯著進度條傻傻地等待，除了”取消”沒有其他選擇。在系統(tǒng)處理一些網(wǎng)絡(luò)任務(wù)的時候，完全可以允許用戶做一些其他的事情。

各大平臺的發(fā)微博，都采用了后臺執(zhí)行。云閱讀的離線下載也采用后臺執(zhí)行。

而微博的看長圖(或視頻)，是個反例。網(wǎng)絡(luò)不給力時，要么等待1分鐘讓圖加載完，要不就只好放棄看圖。為什么不能讓圖加載的同時，用戶可以看其他微博呢？

2.在載入前顯示內(nèi)容

客戶端與web的一個不同點，客戶端的顯示內(nèi)容包括本地數(shù)據(jù)和網(wǎng)絡(luò)數(shù)據(jù)兩部分。在設(shè)計界面時，將更多的信息放在本地，在網(wǎng)絡(luò)數(shù)據(jù)未載入時即顯示本地數(shù)據(jù)，讓用戶產(chǎn)生一種”已經(jīng)載入一半了”的錯覺，即使最終的耗時一樣，心理感受也會更快。當然把數(shù)據(jù)過多地寫在本地，會犧牲一些靈活性，需要根據(jù)具體情況考慮。

越來越多的傳統(tǒng)企業(yè)擁抱移動互聯(lián)網(wǎng)，以補充完善原有渠道的目標推出自有企業(yè)的品牌app，比如傳統(tǒng)雜志社設(shè)計一款電子雜志app、傳統(tǒng)實體店商家推出電子商城app。這些傳統(tǒng)的做法已經(jīng)司空見慣，讓我們看看品牌大牛們有哪些不務(wù)正業(yè)的新玩法。

本文不談趨勢、不談技術(shù)，也不涉及廣告營銷思路。通過分析研究以下八大品牌app案例的設(shè)計表現(xiàn)手法，總結(jié)出一些品牌app創(chuàng)新設(shè)計要點，希望與大家進行交流探討。

【案例一】UNIQLO——清新型格的數(shù)字化生活工具

UNIQLO是一個擁有出色創(chuàng)新基因的日本服裝品牌，UNIQLO品牌所倡導(dǎo)的Life Wear（服適人生）哲學(xué)——“Clothes for a better life, for everyone, every day”不是單純將“衣食住行”的“衣”作為一種時尚，而是創(chuàng)造豐富人們?nèi)粘Ｉ畹囊路谶@個概念發(fā)表的各種數(shù)字化生活工具被歸類為“UNIQLO LIFE TOOLS”，下面就來介紹一下這些apps——UNIQLO WAKE UP、UNIQLO CALENDAR和UNIQLO RECIPE。

UNIQLO WAKE UP

作為一個工具型應(yīng)用，UNIQLO WAKE UP的歡迎語 “在隨著天氣而變化的音樂聲中開始新的一天，分享您的起床信息” 道出了它與其他鬧鐘app的不同。它集天氣、音樂、社交功能為一體，把起床和天氣聯(lián)系起來，配以的美妙女聲播報，原創(chuàng)背景音樂則是由世界知名音樂人Cornelius和菅野洋子合作完成。

小伙伴們可去官網(wǎng)感受下：http://www.uniqlo.com/wakeup/cn/pc/index.html?high=true

打開app默認的是天氣/時鐘界面，清新明亮的大色塊平鋪十分迷人，不同天氣會自動切換不同背景色和音樂。

在設(shè)計網(wǎng)頁和程序界面的時候，為了確保每一個像素的顏色、紋理和位置都準確地呈現(xiàn)，大多數(shù)設(shè)計師都會被搞得疲憊不堪。一不小心，一些很常用的操作像移動、旋轉(zhuǎn)和粘貼就會讓你的辛勤勞動付之東流。但是，如果能對你的工作流程做些小小的改動，就能在項目中始終保持作品的高質(zhì)量。

像素完美之旋轉(zhuǎn)

如果你不夠小心，那么在Photoshop中旋轉(zhuǎn)圖層就會使像素遭到明顯的破壞，出現(xiàn)模糊。

使用自由變換工具（或其他工具）把圖層旋轉(zhuǎn)90度或270度后，像素最終的顯示效果將取決于圖層的尺寸。如果圖層的寬和高都是偶數(shù)，你就可以幸免于難。如果圖層的寬和高都是奇數(shù)，也不會有問題。但是如果圖層的寬是奇數(shù)，高是偶數(shù)或者寬是偶數(shù)，高是奇數(shù)，那么你將會看到如下情景：

本例中原始圖層的尺寸為20×9像素：偶數(shù)×奇數(shù)。盡管位圖和矢量圖層在旋轉(zhuǎn)后的效果不一樣，但兩者都變得不可用了。這是由于圖層旋轉(zhuǎn)的中心點沒有落在某個像素邊界上導(dǎo)致的。

一種解決方法

當圖層的寬高為奇數(shù)×偶數(shù)或偶數(shù)×奇數(shù)時，旋轉(zhuǎn)后就會出現(xiàn)問題。因此，我們需要某種方法來保證圖層的寬高是偶數(shù)×偶數(shù)或奇數(shù)×奇數(shù)。也許你所想到的解決方法就是給要旋轉(zhuǎn)的圖層增加一個正方形的位圖蒙版或者添加更多的像素。除此之外，你還可以通過在另外一個圖層上繪制一個正方形后跟原始圖層同時旋轉(zhuǎn)來解決這個問題。

總而言之，只要圖層的寬高是偶數(shù)×偶數(shù)或者奇數(shù)×奇數(shù)就可以了。

一種更簡單的方法

在使用自由變換工具時，把旋轉(zhuǎn)的中心點挪到左上角（或其他任意一個頂角）就能確保它會落在某個像素的邊界上，這樣便能保證每次旋轉(zhuǎn)后的結(jié)果都是完美的。為此，你需要在選擇自由變換工具后在參考點設(shè)置按鈕上單擊下任意頂角再進行旋轉(zhuǎn)。這是目前為止最簡單有效的方法。

@寫說說 ：作者系大學(xué)學(xué)生，給我們分享他的設(shè)計文章。大家如果對原作者的作品感興趣，可到作者的Behance看下。我們直接切入主題~

Dream這個詞匯是畫布的主體中心，它將控制整個畫布的布局空間，我們的其他元素將從這個字體的內(nèi)部出現(xiàn)，比如生長的樹木，字體背后的山，以及山后高高的月亮。

做夢經(jīng)常把我們帶到一個不一樣的場景里，我們比喻她為”仙境”好了。實際上這個”仙境”也是由日常的真實元素構(gòu)成的，在今天的這片”仙境”里，我們利用現(xiàn)實世界里的自然元素，結(jié)合AI的3D效果，讓這些元素都夢幻般漂浮在空中。

==================開始之前注意以下幾點： =================

1、通常人們在夜間做夢，所以我們把主色調(diào)調(diào)成青色和石灰綠。
2、同時，排版的時候來個完整的氛圍，給人感覺像是在講一個故事。
3、在操作時關(guān)于字體、樹木、樹枝、樹葉、山峰、月亮、畫布請逐一添加編組以便修改。

4、本文涉及到的素材和最終的psd源文件，猛戳此處下載Dream Design with 3D Typography.rar。下載完后字體該安裝的請先安裝好。

5、本文中用到的AI和ps都是英文版，創(chuàng)建3D字體部分比較簡單，說說也是直接用中文版的AI做的，相信你也可以~如果您的ps是cc且為中文版，或許改成英文版在本文的學(xué)習(xí)中會更容易操作一點：

打開你的ps cc安裝文件夾，定范到Locales\zh_CN\Support Files，比如我的是G:\pscc\Adobe Photoshop CC (64 Bit)\Locales\zh_CN\Support Files,這里你會看到一個tw10428.dat的文件，把它重命名（比如直接改成tw10428.dat重命名），不要刪掉。重啟ps就是英文版本的了。要換回中文版就把這貨的后綴改回來就是了：）

附：神馬？你忘記自己軟件裝在哪里不知道怎么找路徑了？那在開始菜單欄總有她的身影吧！或者桌面上有她的快捷方式吧？鼠標點擊”開始”找到這軟件（或者直接在桌面的ps快捷方式上右擊），在ps cc軟件上右擊選擇”打開文件位置”，毫不猶豫的再嗖嗖嗖幾下你就找到了路徑。

=================== 一切就緒，馬上出發(fā)↓ =====================

一、創(chuàng)建3D字體

打開AI，創(chuàng)建新畫布，鍵入一個大寫的”D”字，使用素材里面的字體storybook。字體顏色設(shè)為#4C3F38。

在網(wǎng)頁設(shè)計中，橫向和豎向的直線非常常見，利用整齊的線條可以打造出有序的視覺路徑以及信息層級。
當然，有些時候，可以不按理出牌，設(shè)計一些傾斜的線條，讓你的網(wǎng)站不拘一格，更加與眾不同。

打破傳統(tǒng)布局，創(chuàng)造動態(tài)的自由視感，讓構(gòu)成更加復(fù)雜——無論是利用簡約的幾何圖形，或是精致的傾斜圖像。
讓你的設(shè)計更具吸引力，不妨試試斜線。

Paseo Itaigara

形狀感很強，整體設(shè)計的很成功，顯得并不雜亂。菱形無處不在，拼嵌式的菱形，裝飾性的菱形，按鈕的菱形，很好的主題一致性。

Impero

交互式網(wǎng)站，積極的氛圍、極簡的色彩。設(shè)計師利用兩組對角線（粗細交織）打造了視覺路徑。

Alpina

強烈推薦！利用視覺滾錯，加上美輪美奐的照片。來感受這趟視覺盛典吧。流暢優(yōu)美的照片美景。斜線分割的很巧妙（試想用直線風格，效果不會這么到位）

相信每個Android新手都會遇到這個問題，希望這篇帖子能讓你不再糾結(jié)。

本文譯自國外高質(zhì)量問答社區(qū)Quora，原文作者Karen X. Cheng，原是微軟Excel的項目經(jīng)理，后通過自學(xué)轉(zhuǎn)型成為設(shè)計師。她講述的自學(xué)過程詳實細致且條理有序，讀完會發(fā)現(xiàn)與想象中的大不一樣，對于想自學(xué)設(shè)計但迷茫不知道從何入手的童鞋來說，可以遵循她的步驟去學(xué)習(xí)，除了規(guī)劃得當，還能對設(shè)計有一個全局的了解 : ）

PS用途廣泛，方法多樣。可以用不同的方法來實現(xiàn)同一種效果，有時，大家會被思維局限住，采用”最笨”的辦法完成工作。

本文，便是面對這一問題，羅列出PS使用中的10條壞習(xí)慣，相信只要克服這10個壞習(xí)慣，你的工作會更有效率。

1. 在單一圖層內(nèi)工作

盡管有很多教程講述單圖層打造xxx效果，大家不妨學(xué)習(xí)一下作為練習(xí)，掌握一下思路即可。
但是在工作中，這種習(xí)慣可真不好。

單一圖層制圖，缺乏靈活性，無法針對性的做出修改。
最安全的做法是：一種效果，一個新圖層，這樣以后修改起來會非常方便。

無論如何，在工作中都盡可能的使用多個圖層，編輯更起來有效率，組織也更分明。
當然也有牛人，完全在一個圖層實現(xiàn)很復(fù)雜的。譬如這篇《PS教程！教你用一個圖層制作相機圖標》。

2. 直接刪除內(nèi)容，而不使用蒙版

這個非常常見。刪除和擦除圖層內(nèi)容幾乎是不可逆的，是一種破壞性的編輯方式。其實不如利用PS的像素蒙版、矢量蒙版、剪貼蒙版來”屏蔽”內(nèi)容。

蒙版僅僅會臨時隱藏選中的圖層部分，而不是性的刪除。

記住咯，盡量使用蒙版，盡量少用刪除。

3. 點來點去（不會用快捷鍵）

4. 圖像轉(zhuǎn)換時，不利用智能對象