SlideShare a Scribd company logo
Ui gathering(視覺設計)
由動而靜的新體驗 - Motion User Interface

• 講者:魏銘信(Ivan Wei) 華碩電腦, Senior UE Designer
  – 如何由動態思考切入介面設計
     • 動態思考介面設計的Process
     • Motion Design的隱喻
  – 靜在視覺細節,你察覺了多少?
     • 如何琢磨視覺的細節?
     • 電子產品GUI設計的Tip
  – 激發動態思考的方法?
UI設計的流程

Ideation      Evaluation     Implementation   Verification


Information    Feasibility        UI-Spec
                                                 Review
   Survey         Tset            Define


Brain Storm                     GUI Design        Refine



 Proposal                       Prototyping      Deliver
Icon的功能
Icon的功能

幫助User記憶而不是   品牌識別 (Brand Identity)
執著於意義的詮釋
視覺的亮點靠對比堆砌出層次
立體感的些微差異
• 細節就在每1px裡!
避免混色
• 耐看才值得被細細體會
 – 搶眼不一定是好事, 耐不耐看才是王道!!
圖放到Device上的顏色效果不如預期
利用Pettern相疊減少漸層斷差
螢幕密度對視覺編排的影響
隱喻的適切性
Ui gathering(視覺設計)
Ui gathering(視覺設計)
如何經營icon的細節
色系與視角統一
利用框架Template統一
如何創造Family look
整體視覺大小的比例要一致
• 除了顏色、透視角度、質感,整體視覺大
  小的比例上更為關鍵!
視覺化大師們的對話-1 pixel 1 pixel 的改變世界

• 講者:詹智堯(Allen Chan) Trend Micro, Senior UI Designer
設計的目的是什麼?
We lead & inspire
• Set the direction
• Create excitement
• Create emotions
Explore more…
•   色彩變化
•   透明度掌握
•   品牌置入
•   考慮不同材質
•   更高科技感和智慧感
•   按鈕是否清楚
好的設計是什麼?
•   1. Technically feasible
•   2. Have business value
•   3. Sustainable/lasting
•   4. Echoing to the audience
•   5. Tells a story
    – Characters = Functions
    – Storyline = Flows
    – Audience = Users
好觀念分享
•   Draw from everyday life
•   Step closer, feel everything
•   Look where LEAST expected
•   Make it part of YOU
•   Believe in yourself

More Related Content

PPTX
專案設計流程 x Prott 蹦出新滋味
PPTX
界面线索性设计
PDF
Voice Assistant / Chatbot Development 101
PPTX
爱途迹
PDF
20191014-林金祥-UIUX
PPTX
設計的法則_如何增加設計的使用性
PPTX
App介面設計要點
PDF
UiGathering Talk - Motion User Interface / by Ivan Wei
專案設計流程 x Prott 蹦出新滋味
界面线索性设计
Voice Assistant / Chatbot Development 101
爱途迹
20191014-林金祥-UIUX
設計的法則_如何增加設計的使用性
App介面設計要點
UiGathering Talk - Motion User Interface / by Ivan Wei

Viewers also liked (20)

PDF
Habits - Transforming Behavior: How to create rituals at work
PPTX
Government Should Prohibit the Children from Going to Cram Schools before jun...
PPTX
SuperEco: Our Concept Design for Reducing Food Mileage to Help the Earth
PPT
解读信息设计
PDF
HCI 2014 (10 of 10): Natural User Interfaces. Ubiquitous Computing
PPT
Ch2 first steps_in_drawing
PDF
國科會期中發表 交大陪伴型機器人
PDF
創新的10個原點
PPTX
案例分析:利用认知科学提升车载人机交互的可用性 Usecase Study: Car Infotaiment system design, researc...
PDF
突破創新盲點,揭開成功連結系統的關鍵《創新的10個原點》
PDF
Yang design service design lab social innovation powered by service design
PDF
mBot介紹
PDF
mBot Add-on pack
PPTX
Brand Guidelines
PDF
機器人齊步走 Ver6 m_bot_mblock
PDF
2016.05.30 shopioneer概念設計報告
PDF
Brand Manual / Branding & Service Design 2016
PDF
科技於失智照護的運用案例
PDF
2016.05.30 菜單討拍拍 需求分析 台科大
PDF
雲端產品的用戶體驗檢測重要性與作法
Habits - Transforming Behavior: How to create rituals at work
Government Should Prohibit the Children from Going to Cram Schools before jun...
SuperEco: Our Concept Design for Reducing Food Mileage to Help the Earth
解读信息设计
HCI 2014 (10 of 10): Natural User Interfaces. Ubiquitous Computing
Ch2 first steps_in_drawing
國科會期中發表 交大陪伴型機器人
創新的10個原點
案例分析:利用认知科学提升车载人机交互的可用性 Usecase Study: Car Infotaiment system design, researc...
突破創新盲點,揭開成功連結系統的關鍵《創新的10個原點》
Yang design service design lab social innovation powered by service design
mBot介紹
mBot Add-on pack
Brand Guidelines
機器人齊步走 Ver6 m_bot_mblock
2016.05.30 shopioneer概念設計報告
Brand Manual / Branding & Service Design 2016
科技於失智照護的運用案例
2016.05.30 菜單討拍拍 需求分析 台科大
雲端產品的用戶體驗檢測重要性與作法
Ad

Similar to Ui gathering(視覺設計) (20)

PPTX
展望2013使用經驗設計發展
PDF
20130112用原型驅動設計@webconf
PDF
2012 May UiGathering: Design and Communication in Co-creation (by Ian Jang)
PDF
How to cooporeate with IT partners from a designer's viewpoint
PDF
Week2.how to cooporeate with it
PPTX
開放原始碼 Ch3.2 mobile - oss - oss行動領域-2 (ver1.0)
PPT
Designing For Interaction with Web Interface
PDF
20120524 App開發流程與小工具分享@UI Cafe
PPTX
Design Method_20210610
PPTX
Design Method & Skill_20211224
PDF
2011 designtomorrow brochure
PDF
應用設計思考1210 2
PDF
使用者體驗創新UXID
PDF
成大心理系-Prototyping方法
PPTX
design method and skill course 2024_09_04
PPTX
2011.12.06 i phoneux視覺設計
PDF
Digital product design process
PPT
CIID UXID 使用者體驗創新設計
PPTX
開放原始碼 Ch2.3 app - oss - ui framewoks (ver 1.0)
PDF
從雛形到設計-了解您的使用者在想什麼
展望2013使用經驗設計發展
20130112用原型驅動設計@webconf
2012 May UiGathering: Design and Communication in Co-creation (by Ian Jang)
How to cooporeate with IT partners from a designer's viewpoint
Week2.how to cooporeate with it
開放原始碼 Ch3.2 mobile - oss - oss行動領域-2 (ver1.0)
Designing For Interaction with Web Interface
20120524 App開發流程與小工具分享@UI Cafe
Design Method_20210610
Design Method & Skill_20211224
2011 designtomorrow brochure
應用設計思考1210 2
使用者體驗創新UXID
成大心理系-Prototyping方法
design method and skill course 2024_09_04
2011.12.06 i phoneux視覺設計
Digital product design process
CIID UXID 使用者體驗創新設計
開放原始碼 Ch2.3 app - oss - ui framewoks (ver 1.0)
從雛形到設計-了解您的使用者在想什麼
Ad

Ui gathering(視覺設計)