Introducing 

Prezi AI.

Your new presentation assistant.

Refine, enhance, and tailor your content, source relevant images, and edit visuals quicker than ever before.

Loading…
Transcript

本簡報資料參考

INSIDE-介面設計師轉職之路

UI/UX Designer Road Map

Paul_Chiu

2019/03/08

Step1

Idea

1

STEP

Idea

設計規範

  • 使用者習慣的介面或操作

  • 保持Product統一性(避免混淆)

  • 提升團隊工作效率(模組化元件)

設計規範

UX思維

  • 使用者體驗(User Experience)

  • User使用研究分析、統計數據

  • 找出好用且適合的、滿足市場需求

  • UX相關文章:UX四神湯

UX思維

Sample

  • 腦補功能

  • 標示

  • 對應性

  • 回饋機制

sample

設計思維

  • 設計思考(Design Thinking)

  • 以人為本的解決問題方法論

  • Design & Thinking 設計與思考
  • https://www.youtube.com/watch?v=x_fQlUtoUqU

設計思考

線框稿

  • 線框稿(Wireframe)

  • 精簡、注重畫面間的流程及操作

  • 通常僅用簡單線條、框線草圖顯示

  • 用來與專案成員溝通

線框稿

系統原型分類

資料來源:https://blog.akanelee.me/posts/276909-beginners-of-prototype/

Step2

STEP

2

Rules

Rules

美感

  • 物件呈現方式

  • 物件間距、陰影、大小、圓角

  • 擬真、扁平化設計

美感

配色

  • 網站主要色調

  • 企業代表色

  • 直覺性配色

  • 效果色(Hover、Click)

配色

Mockup

  • 不能被操作-尚未串接後端資料

  • 與完成階段樣貌相同

Mockup

Step3

STEP

Do it

3

Do it

版本控制

  • 命名方式

  • File存放方式

版本控制

開發知識

  • 了解夢想與實際

  • 減少與工程師的認知落差

  • 提升開發效率,工程師笑mi mi

開發知識

標註

  • 規格細節明顯易了解

  • 更清楚表達需求

  • 避免認知落差

標註

prototype

  • 接近完成品

  • 可被操作
  • https://marvelapp.com/5dhed6b/screen/46180893

Prototype

Step4

STEP

Goal

4

Goal

社群參與

  • 同儕學習

  • 知識分享

社群參與

接案練功

  • side project

  • 一舉數得

接案練功

Learn more about creating dynamic, engaging presentations with Prezi