簡易檢索 / 詳目顯示

研究生: 周曠宇
Chou, Kuang-Yu
論文名稱: 穿戴式裝置之圖形使用者介面架構設計
The Design of a Graphical User Interface Framework for Wearable Devices
指導教授: 張天豪
Chang, Tein-Hao
共同指導教授: 黃敬群
Huang, Ching-Chun
學位類別: 碩士
Master
系所名稱: 電機資訊學院 - 電機工程學系
Department of Electrical Engineering
論文出版年: 2016
畢業學年度: 104
語文別: 中文
論文頁數: 50
中文關鍵詞: 圖形使用者介面穿戴式裝置向量圖形SVG 解析
外文關鍵詞: GUI, Wearable devices, Vector graphics, SVG Parsing
相關次數: 點閱:187下載:18
分享至:
查詢本校圖書館目錄 查詢臺灣博碩士論文知識加值系統 勘誤回報
  • 近年來物聯網、智慧型穿戴等嵌入式裝置已逐漸融入我們的生活,這些電子產品與使用者直接產生互動的即是圖形使用者介面 (GUI) 。除去對硬體資源需求較高的GUI架構,現有適用於穿戴式裝置開發的架構往往要求開發人員具備底層語言開發能力並熟悉其應用程式介面,因而限制了開發人員的族群,並且加大了開發難度。一般的開發流程是由設計師設計GUI,再交由程式開發人員將設計師的設計轉化為程式代碼。由於原始設計與程式實作時使用的描述方式完全不同,程式開發人員只能不斷測試直至在硬體上呈現出預期的GUI畫面,這一過程將導致開發週期的延長。然而在穿戴式裝置的開發初期需要快速完成原型系統,進行概念的驗證,現有GUI的開發模式較難滿足這樣快速開發的需求。
    因此,本研究從穿戴式裝置的開發流程切入,基於現有GUI的開發模式,提出一個易用、可快速開發且通用的GUI架構。該架構以標記語言描述的向量元件為基礎,也正是原始設計所使用的描述方式,可直接將向量圖片解析並畫出。這一特質將大大提升GUI的開發效率,滿足穿戴式裝置原型系統的快速開發需求。同時本架構擁有豐富的向量圖形庫API,為後續階段完善GUI或習慣典型開發模式的開發人員提供更多選擇。此外本研究還提供了輔助開發工具,可在電腦上直接預覽GUI,進一步提高開發效率。

    In recent years, embedded devices such as the Internet of Things, smart wearable devices have been gradually integrated into our lives, and graphical user interface (GUI) is the way that users can interact with these electronic products directly. Except for the GUI frameworks which have higher demand for hardware resources, other frameworks which are applicable to develop wearables require developers can program with low-level language and be familiar with the API, thus it limits the group size of developers and increases the difficulty of development. General development process starts at designing GUI by designers, then software developers translate the design into program code. Since the original design and program implementation use completely different described manners, software developers can only test program on the hardware until the expected GUI picture exhibited on screen, this process will lead to a prolongation of the development cycle. However, in the early stages of developing wearables need rapid prototyping for proofing of concept, and existing GUI development process is difficult to meet the needs of such rapid development.
    Therefore, this study bases on the existing GUI development process, proposing an easy-to-use, efficient and versatile GUI framework with rapid prototyping ability. The framework uses vector graphics as basic element, which is also the original design used, so framework can directly parse vector images and draw them without too much programming. This trait will greatly enhance the development efficiency and meet the need of rapid prototyping of wearables. At the same time, this framework has the API to access library of vector graphics, providing more choices for the software developers who are used to develop in the typical model. In addition, this study also provides software tool to support development, by using this tool GUI can be previewed on computer and development efficiency is further improved.

    第一章 緒論 1 1.1 研究背景 1 1.2 研究動機與目標 2 1.3 研究方法 3 1.4 章節規劃 5 第二章 相關研究 6 2.1 穿戴式裝置 (Wearable Device) 6 2.2 可延伸標記式語言 (Extensible Markup Language, XML) 6 2.3 向量圖形 (Vector Graphics) 7 2.3.1 貝茲曲線 (Bézier curve) 7 2.3.2 可縮放向量圖形 (Scalable Vector Graphics) 8 2.4 消光和複合 (Matting and Compositing) 9 2.5 人機互動 (Human-Computer Interaction, HCI) 10 2.5.1 Window, Icon, Menu, Pointer (WIMP) 10 2.5.2 Post-WIMP 11 第三章 研究方法 12 3.1 表現層設計 (Presentation Layer Design) 15 3.1.1 SVG子集定義 15 3.1.2 XML DOM樹節點的資料結構定義 20 3.1.3 表現層介面設計 21 3.2 渲染層設計 (Rendering Layer Design) 22 3.2.1 向量圖形庫概述 22 3.2.1.1 視窗管理 (Window Management) 23 3.2.1.2 像素操作 (Pixel Manipulation) 23 3.2.1.3 幾何物件 (Geometric Objects) 27 3.2.1.4 進程模型 (Process Model) 28 3.2.2 渲染層介面設計 29 3.3 輸出層設計 (Output Layer Design) 31 3.3.1 記憶體管理 32 3.3.2 雙緩衝設計 35 3.3.3 輸出層介面設計 36 第四章 研究結果 38 4.1 GUI架構實作 38 4.2 GUI實作及演示 38 4.2.1 靜態畫圖演示 38 4.2.2 動態畫圖演示 39 4.2.3 互動性演示 41 4.3 GUI架構效能測量 42 4.3.1 程式碼組成分析 42 4.3.2 記憶體使用測量 43 4.3.3 畫面更新率測量 (Measurement of Frame Rate) 45 第五章 結論與展望 47 5.1 結論 47 5.2 未來展望 47 參考文獻 49

    1.IDC. IDC Forecasts Worldwide Shipments of Wearables to Surpass 200 Million in 2019, Driven by Strong Smartwatch Growth and the Emergence of Smarter Watches 2016; Available from: https://www.idc.com/getdoc.jsp?containerId=prUS41100116.
    2.Reimer, J., A History of the GUI. Ars Technica, 2005. 5.
    3.Segger. SEGGER - The Embedded Experts - RTOS and Middleware - emWin. 2016; Available from: https://www.segger.com/emwin.html.
    4.Dalheimer, M., Programming with QT: Writing portable GUI applications on Unix and Win32. 2002: " O'Reilly Media, Inc.".
    5.Myers, B., S.E. Hudson, and R. Pausch, Past, present, and future of user interface software tools. ACM Transactions on Computer-Human Interaction (TOCHI), 2000. 7(1): p. 3-28.
    6.Oshana, R., Software Engineering for Embedded Systems: Methods, Practical Techniques, and Applications. 2013: Newnes.
    7.STMicroelectronics. STM32領跑物聯創新. 2014; Available from: http://www.stmcu.com.cn:8088/upload/HisYearInfo/2014/STM32%E9%A2%86%E8%B7%91%E7%89%A9%E8%81%94%E5%88%9B%E6%96%B0.pdf.
    8.STMicroelectronics. STM32F4 Series. 2016 2016 [cited 2016; Available from: http://www.st.com/content/st_com/en/products/microcontrollers/stm32-32-bit-arm-cortex-mcus/stm32f4-series.html?querycriteria=productId=SS1577.
    9.UltraFlex. UltraGUI 7' Touchscreen LCD Controller Module. 2012; Available from: http://www1.ultraflex.net/wp-content/uploads/2012/03/UFX-772-404.pdf.
    10.WearableDevices.com. What is Wearable Technology? 2014 March 26, 2014 [cited 2016; Available from: http://www.wearabledevices.com/what-is-a-wearable-device/.
    11.趨勢科技全球技術支援與研發中心, T.L. 《 IoT 物聯網安全趨勢》穿戴式裝置來了,您準備好了嗎?. 2014 [cited 2016; Available from: http://blog.trendmicro.com.tw/?p=9569.
    12.Consortium, W.W.W., Extensible markup language (XML) 1.1. 2006.
    13.Tutorialspoint. XML Processors. 2016 [cited 2016; Available from: http://www.tutorialspoint.com/xml/xml_processors.htm.
    14.Kaufman, A., Rendering, visualization and rasterization hardware. 1993: Springer Science & Business Media.
    15.Chapman, N.P. and J. Chapman, Digital multimedia. 2000: John Wiley & Sons, Inc.
    16.Farin, G., A history of curves and surfaces. Handbook of Computer Aided Geometric Design, 2002: p. 1.
    17.Ferraiolo, J., F. Jun, and D. Jackson, Scalable vector graphics (SVG) 1.1 specification. World Wide Web Consortium (W3C). URL http://www. w3. org/TR/SVG11, 2003.
    18.Porter, T. and T. Duff. Compositing digital images. in ACM Siggraph Computer Graphics. 1984. ACM.
    19.Zongker, D.E., et al. Environment matting and compositing. in Proceedings of the 26th annual conference on Computer graphics and interactive techniques. 1999. ACM Press/Addison-Wesley Publishing Co.
    20.Preece, J., et al., Human-computer interaction. 1994: Addison-Wesley Longman Ltd.
    21.Beaudouin-Lafon, M. Designing interaction, not interfaces. in Proceedings of the working conference on Advanced visual interfaces. 2004. ACM.
    22.Van Dam, A., Post-WIMP user interfaces. Communications of the ACM, 1997. 40(2): p. 63-67.
    23.Consortium, W.W.W., Scalable Vector Graphics (SVG) 1.1 Specification. W3C Candidate Recommendation, 2000. 2.
    24.Mobile, S., Profiles: SVG Tiny and SVG Basic. W3C Recommendation, 2003.
    25.Packard, K. Twin: A Window System for ‘Sub-pda’Devices. in Linux Symposium. 2005.
    26.Bleistein, N., J.K. Cohen, and F.G. Hagin, Two and one-half dimensional Born inversion with an arbitrary reference. Geophysics, 1987. 52(1): p. 26-36.
    27.Pedersen, S.S. Porter/Duff Compositing and Blend Modes. 2013; Available from: http://ssp.impulsetrain.com/porterduff.html.
    28.Worth, C. and K. Packard. Xr: Cross-device rendering for vector graphics. in Proceedings of the Ottawa Linux Symposium. 2003.

    下載圖示 校內:立即公開
    校外:立即公開
    QR CODE