{tapworthy} ch6 - 引人注目導讀
Post on 26-May-2015
243 Views
Preview:
DESCRIPTION
TRANSCRIPT
引人注目獨一無二的 APP 視覺設計
Duncan , 吳長鋼2013/2/2
引人注目
引人注目的蝴蝶「姬」
http://www.timliao.com/bbs/viewthread.php?tid=61697
你的應用程式要有什麼風格O 決定應用程式的個性O 說故事O 帶入情境
決定個性 (iOS)O 配合 APP
功能主題發揮
決定個性 (iOS)O 配合 APP
功能主題發揮
決定個性 (iOS)O MOS 可愛日系風格
決定個性 (Android)
範例 APP: 素描大師
HoJava 可愛台系風格
CF.
在地化
http://www.chinamos.com.cn/About/overseas
說故事O 成功帶入情境( myJLin )
說故事O 無法帶入情境( Wa 台灣之光)
從 iPhone 標準界面元素著手O 地毯應該要配合窗簾一致性O 工具列若上色 , 導覽列 , 工具列和搜尋列應
該要使用相同顏色(瘋美食 ,ChilisTw )
不要太過鮮艷O 工具列顏色要高雅低調,花俏明亮顏色干擾使用者的視線遠離主要內
容(不要讓界面控制選項搶了內容的風采,重點在於相配)
Pic+Pic 悅禾
CF.
走入光線O Apple 慣用
O 漸層填色O 標準工具列圓角O 光源效果
Running
聰明的修改是迷人的,太過聰明卻令人困惑
O 跨平台 ?
O 首頁和清單按鈕容易誤觸
聰明的修改是迷人的,太過聰明卻令人困惑
O 登入開關
聰明的修改是迷人的,太過聰明卻令人困惑
O 頁籤 ? 網站思維O 顏色不搭O + 未用原生內建
聰明的修改是迷人的,太過聰明卻令人困惑
對比是你的朋友
O 文字最好使用黑色或白色O 重要的介面元素採用高對比顏色
我們觀看色彩時,會受到周圍色彩影響而產生變化,就是色彩的對比現象。
明暗對比
兩種不同明度的色彩並列時,會使明色更亮,而暗色更暗。將同明度的灰色置於白底和黑底上,會感覺黑底上的灰色較亮;而白底上的灰色明度較暗。
對比是你的朋友
O 文字最好使用黑色或白色O 重要的介面元素採用高對比顏色
將一色相與他色同時配置,會使來的色彩產生偏色現象,叫做色相對比。將橙色貼在紅色和黃色的背景上,紅色背景上橙色會偏黃;而黃色背景上的橙色則會偏紅。
少用其他字型O 使用標準的 iPhone Helvetica ,克制改用其他字型衝動,
導覽列尤其如此,除品牌標誌外。O 使用其他字型只會讓程式更大包
悅禾
保持高級O 人們信任奢侈品:很貴 , 有價值O 使用奢華材質(運用在介面設計上)
O 皮革筆記本O 發亮配件O 懷舊的錶
O 為你的 App增加材質和光澤O 木頭或軟木的溫暖O 玻璃的光滑O 紙或織品的有機感O 金屬的冰冷精密
愛料理 尋找朋友
支付寶
擬真
尋找 iPhoneRunning
擬真
iTunes U 人貓交流器
擬真 (cf.)
喝水寶 狗狗們兒童教學
設計自己的工具圖示
O 不要很炫 , 不要陰影 , 不要稀奇古怪的特效O簡單的剪影:清楚明白明確指出按鈕背後
的動作
視覺隱喻 (Visual metaphors)
風行網
結論
O 有價值的設計須先決定 APP 的個性O自製顏色和圖像須配合高級材質賦予吸引
觸控的生命力O圖示清楚明白
top related