App 快速雛形發展介紹 Part1
5 likes877 views
该文档介绍了使用Fluid UI进行应用快速原型开发的特点与初体验，包括在网页及手机上的应用演练和分享方式。用户可以在设计阶段构建草稿，不需预装软件，支持多平台设计。文中还详细讲述了Fluid UI的使用流程和分享功能，以便于协同工作与设计预览。
App 快速雛形發展介紹 Part1
- 1. App 快速雛形發展介紹 (Part 1) 利用Fluid UI進行快速畫面架構 陳信宏 eosinchen@gmail.com
- 2. Agenda Fluid UI 的特點 Fluid UI 初體驗 Fluid UI 於 Web 及手機上的演練 Fluid UI 的分享方式
- 3. Fluid UI 的特點 在設計階段，即可直接建構畫面草稿圖 採用Web操作方式，只要靈感一來，只要有電腦即可 繼續設計(未來用平板也是可以的) 用於設計的電腦，不用預裝任何軟體 可分別建立Android、iOS、Windows Phone的畫面 可和同事共同分享內容(基本的協同工作) 可於手機上安裝 Fluid Player，即可預覽畫面
- 4. Fluid UI 初體驗 http://www.fluidui.com/
- 5. Fluid UI 初體驗 按下主畫面中的”TRY IT”開始使用 按下 Sign In 來註 冊或登入 未登入時，也是 可以試玩
- 6. Fluid UI 初體驗 註冊與登入後 選擇已經建立的 專案，或是新增 一個專案
- 7. Fluid UI 初體驗 開始設計 畫面工作區，把 左方的元件移到 這兒 在此選不同 OS， 來選擇不同的元 件樣式
- 8. Fluid UI 初體驗 利用 Android 模板來做初步的練習 先練習一個畫面 高雄公車一指通 的主畫面
- 9. Fluid UI 初體驗 建立第二個畫面 利用按鈕元件 + Link 功能，建立 第二個畫面
- 10. Fluid UI 初體驗 第二個畫面建立完成 其他畫面也是依 此方法建立
- 11. Fluid UI 於 Web 及手機演練 利用 Play 開始演練 按下此，開始 Play
- 12. Fluid UI 於 Web 及手機演練 利用 Play 開始演練 手機掃描此 QR Code 就可以在手機上演練 PS:要先裝 Fluid Player (下頁)
- 13. Fluid UI 於 Web 及手機演練 Fluid Play 安裝方式 登入後，點選這一項 “Grab the app”
- 14. Fluid UI 於 Web 及手機演練 Fluid Play 安裝方式 拿起手機，拍這個 QR Code 然後選擇安裝
- 15. Fluid UI 的設定與分享 Fluid UI 的分享 回到專案管理畫面 選擇右下角的設定
- 16. Fluid UI 的設定與分享 Fluid UI 的分享 按下分享按鈕
- 17. Fluid UI 的設定與分享 Fluid UI 的分享 很多分享的方式 用 mail 或 社群都可以
- 18. 討論與練習