請用此 Handle URI 來引用此文件：
http://tdr.lib.ntu.edu.tw/jspui/handle/123456789/74882完整後設資料紀錄
| DC 欄位 | 值 | 語言 |
|---|---|---|
| dc.contributor.advisor | 曹承礎(Seng-Cho T. Chou) | |
| dc.contributor.author | Kang-Ling Liao | en |
| dc.contributor.author | 廖康伶 | zh_TW |
| dc.date.accessioned | 2021-06-17T09:09:29Z | - |
| dc.date.available | 2021-04-07 | |
| dc.date.copyright | 2021-04-07 | |
| dc.date.issued | 2021 | |
| dc.date.submitted | 2021-03-16 | |
| dc.identifier.citation | Zameel Kainlkkara, “Why people need to stop obsessing over UI design” Medium, April 8, 2019. https://medium.com/zartek/why-people-need-to-stop-obsessing-over-ui-design-9fe4d235ff84, accessed November 2020. Saurav Basu, “A Pilot to the Difference between UI and UX” Imagin XP, September 24, 2020. https://imaginxp.com/a-pilot-to-the-difference-between-ui-and-ux/, accessed February 2021. “User Experience Design” Flexbox Digital. https://www.flexboxdigital.com.au/ui-ux-design-agency-melbourne/, accessed December 2020. R/Programming Memes, “Why UX research is important”. February 2020, https://www.reddit.com/r/programmingmemes/comments/b3okgi/users_will_always_find_a_way_to_break_things/, accessed December 2020. Tony Ho Tran, “The UX design process in 6 stages” Inside Design, September 30, 2019. https://www.invisionapp.com/inside-design/6-stages-ux-process/, accessed November 2020. Ditte Hvas Mortensen, “Stage 1 in the Design Thinking Process: Empathies with Your Users” Interaction Design Foundation, August, 2020. https://www.interaction-design.org/literature/article/stage-1-in-the-design-thinking-process-empathise-with-your-users, accessed February 2021. Elliott Golden, “8 quotes from the design of everyday things” medium, February 17, 2016. https://medium.com/@elliottgolden/8-quotes-from-the-design-of-everyday-things-22176d2cd104, accessed November 2020. Donald A. Norman, “The Design of Everyday”, 1988. ISBN: 978-0-465-06710-7 Jaxon White, “Visual Design 101” medium, November 10, 2017. https://medium.com/@action/visual-design-principles-101-c2660fbca862, accessed November 2020. Trista Liu, “How to use color in UI design wisely to create a perfect UI interface?” Mock Plus, September 17, 2017. https://www.mockplus.com/blog/post/how-to-use-color-in-ui-design/, accessed November 2020. Ted Hunt, “A Pro Designer Shares the Psychology of Font Choices [Infographic].” The Daily Egg, July 5, 2013. https://www.crazyegg.com/blog/psychology-of-fonts-infographic/, accessed November 2020. Alexander Skogberg, “How paper wireframing will make you a better designer.” Prototype.io, April 27, 2018. https://blog.prototypr.io/how-paper-wireframing-will-make-you-a-better-designer-5a57db8dca13/, accessed November 2020. Molly Driscoll, “Ludwig Mies van der Rohe: Father of ‘less is more’ architecture.” The Christian Science Monitor, March 27, 2012. https://architizer.com/blog/inspiration/collections/ode-to-mies/https://www.csmonitor.com/Technology/Tech-Culture/2012/0327/Ludwig-Mies-van-der-Rohe-Father-of-less-is-more-architecture, accessed November 2020. Maria De La Riva, “Why Consistency Is So Incredibly Important in UI Design.” Career Foundry, September 20, 2018. https://careerfoundry.com/en/blog/ui-design/the-importance-of-consistency-in-ui-design/, accessed November 2020. Kapil Moon, “Rules for clean user interface design.” medium, January 27, 2019. https://medium.com/@moonkapil/rules-for-clean-user-interface-design-42586ece3319/, accessed November 2020. Maryam Taheri, “10 Basic Elements of Design.” 99 designs, February 10, 2020. https://creativemarket.com/blog/10-basic-elements-of-design/, accessed November 2020. Andrei Dorin, “How to Create a Style Guide from Scratch. Tips and Tricks.” Muzli-Design Inspiration, July 31, 2017. https://medium.muz.li/how-to-create-a-style-guide-from-scratch-tips-and-tricks-e00f25b423bf/, accessed August 2020 Viktorija Bachvarova, “The power of empty space in UI design.” UX Planet, December 05, 2018. https://uxplanet.org/https-medium-com-viktorija-bachvarova-the-power-of-empty-space-in-uidesign-14f14f8b203/, accessed November 2020. Alina Arhipova, “Typography in UI: Guide for beginners.” Tubik Studio, 2020. https://blog.tubikstudio.com/typography-in-ui-guide-for-beginners/, accessed February 2021. Meg Reid, “The 5 rules of design composition and layout.” 99 designs, 2018. https://99designs.com/blog/tips/design-composition-and-layout/, accessed November 2020. Kunal, “Margin vs Padding.” Fronted Shortcut, March 6, 2018. https://medium.com/frontendshortcut/margin-vs-padding-c1fc8ea8bfaf/, accessed November 2020. Aurora Harley, “Icon Usability” Nielsen Norman Group, July 27, 2014. https://www.nngroup.com/articles/icon-usability/, accessed November 2020. Varghese Mathai, “Icon Styles Designs” medium, June 29, 2019. https://varghesemathai.medium.com/icon-styles-designs-4a4937da7684/, accessed November 2020. Jeff Cardello, “14 layout design trends.” Webflow Blog, October 11, 2019. https://webflow.com/blog/layout-design/, accessed January 2021. Samantha Ingram, “The Thumb Zone: Designing for Mobile Users.” Smashing Magazine, September 19, 2016. https://www.smashingmagazine.com/2016/09/the-thumb-zone-designing-for-mobile-users/, accessed November 2020. David Pasztor, “How to Start Screen Design and 8 Principles You Should Consider.” UX Studio, October 1, 2019. https://uxstudioteam.com/ux-blog/screen-design//, accessed November 2020. Zac Dickerson, “Size matters! Accessibility and Touch Targets.” medium, April 05, 2018. https://medium.com/@zacdicko/size-matters-accessibility-and-touch-targets-56e942adc0cc/, accessed November 2020. Dorjan Vulaj, “8 Important Rules for Perfect Button Design.” Digital Synopsis, MAY 06, 2019. https://digitalsynopsis.com/design/ui-button-design-rules/, accessed January 2021. Tubik Studio, “Call for Attention. UI Design Tips on CTA Buttons.” UX Planet, February 23, 2018. https://uxplanet.org/call-for-attention-ui-design-tips-on-cta-buttons-5239413aded2/, accessed January 2021. Lukas Mathis, “Checkbox, Radio Buttons, Dropdowns: When to use what?” Appway, November 24, 2017. https://community.appway.com/screen/kb/article/checkboxes-radio-buttons-dropdowns-when-to-use-what-1482810890174/, accessed November 2020. Adam Wathan Steve Schoger, “7 Practical Tips for Cheating at Design.” medium, February 21, 2018. https://medium.com/refactoring-ui/7-practical-tips-for-cheating-at-design-40c736799886/, accessed January 2021. Judit Pal, “Pop up Best Practices + Top 5 Popup Mistakes You Should Avoid.” Opti Monk, July 01, 2020. https://www.optimonk.com/popup-mistakes/, accessed January 2021. Rebeca Costa, “Navigation design: Almost everything you need to know.” Just in Mind, March 12, 2020. https://www.justinmind.com/blog/navigation-design-almost-everything-you-need-to-know/, accessed January 2021. Alex Zlatkus, “Design Guide: Breadcrumbs.” Prototypr.io, September 17, 2019. https://blog.prototypr.io/design-guide-breadcrumbs-a980eb28bfaa/, accessed January 2021. Arnav Nigam, “When to Use What – Module Tabs vs Accordion vs Single Page.” UX Planet, December 08, 2020. https://uxplanet.org/when-to-use-what-module-tabs-vs-accordion-vs-single-page-f8a6ccc150ea/, accessed January 2021. Vitaly Friedman, “Designing the Perfect Accordion.” Smashing Magazine, June 21, 2017 https://www.smashingmagazine.com/2017/06/designing-perfect-accordion-checklist/, accessed January 2021. Snow Hu, “15 Best Stepper UI Design Examples Tips for Designers.” Mock plus, December 03, 2020. https://www.mockplus.com/blog/post/stepper-ui-design/, accessed January 2021. Nick Babich, “The Anatomy of Input Field.” UX Planet, May 29, 2019. https://uxplanet.org/the-anatomy-of-input-field-c3ef863e01d7/, accessed October 2020. Anthony, “Why Segmented Buttons Are Better Filters Than Dropdowns.” UX Movement, November 25, 2014. https://uxmovement.com/buttons/why-segmented-buttons-are-better-filters-than-dropdowns/, accessed January 2021. Taras Bakusevych, “Selection controls – UI component series.” UX Collection, June 24, 2020. https://uxdesign.cc/selection-controls-ui-component-series-3badc0bdb546/, accessed January 2021. Erik D. Kennedy, “4 Rules for Intuitive UX.” Learn UI Design, October 09, 2019. https://learnui.design/blog/4-rules-intuitive-ux.html/, accessed January 2021. Nick Babich, “Progress Trackers in UX Design.” UX Planet, April 26, 2016. https://uxplanet.org/progress-trackers-in-ux-design-4319cef1c600/, accessed January 2021. Nick Babich, “4 Creative Concepts of Slider Control.” UX Planet, October 08, 2018. https://uxplanet.org/4-creative-concepts-of-slider-control-1f8839b05943/, accessed January 2021. Colorlib author, “20 Bootstrap File Uploads That Are Aesthetic and Functional.” Colorlib, September 19, 2019 https://colorlib.com/wp/bootstrap-file-uploads/, accessed January 2021. Shane Ketterman, “Empty States – The Most Overlooked Aspect of UX.” Total.com Designers, https://www.toptal.com/designers/ux/empty-state-ux-design/, accessed January 2021. “UX Design Patterns #6: Search, Sort and Filter Sorted.” Redd Experience Design, March 17, 2020 https://medium.com/@reddexperience/ux-design-patterns-6-search-sort-and-filter-sorted-913a3ce1e160/, accessed January 2021. “Inline edit.” ATLASSIAN Design System, https://atlassian.design/patterns/inline-edit/, accessed January 2021. Wen Wang “Bulk Editing Design for Web Applications.” Medium, October 10, 2016 https://medium.theuxblog.com/bulk-editing-design-for-web-applications-576f22735201/, accessed November 2020. Anastasia D. and Alexander M., “Applying a card-Based Design to User Interfaces: Best Practices.” Ruby Garage, March 14, 2019 https://rubygarage.org/blog/card-based-design-best-practices/, accessed January 2021. Nick Babich, “Designing Card-Based User Interfaces.” Smashing Magazine, October 11, 2016 https://www.smashingmagazine.com/2016/10/designing-card-based-user-interfaces/, accessed January 2021. Computer Hope “Tooltip.” Computer Hope November 16, 2019 https://www.computerhope.com/jargon/t/tooltip.htm/, accessed January 2021. Katryna Balboni, “Tooltips: How to use this small but mighty UI pattern correctly.” Appcues, https://www.appcues.com/blog/tooltips/, accessed January 2021. Sven, “Pagination – Examples and Good Practices.” Smashing Magazine, November 16, 2007 hthttps://www.smashingmagazine.com/2007/11/pagination-gallery-examples-and-good-practices/, accessed December 2020. | |
| dc.identifier.uri | http://tdr.lib.ntu.edu.tw/jspui/handle/123456789/74882 | - |
| dc.description.abstract | 數位技術不斷的發展已成為我們生活中不可或缺的一部分。 數位技術可以用在許多應用，逐漸改變人類的行為習慣。我們使用不同的小工具和設備（例如：電腦和手機）來連接數位和實際生活。這些技術發展和新的設計方向已導致需要開發友好的產品界面。 本文研究搜尋要如何通過參考列表來設計更好的用戶界面和用戶體驗。透過參考列表，UIUX設計人員可以檢查如何正確使用UIUX理論和功能。友好使用（容易使用）的UIUX產品和服務可以滿足用戶需求並促進業務增長。 | zh_TW |
| dc.description.abstract | The continuous development of digital technology has become an integral part of our lives. Digital technology can be used in many applications and slowly changing human behavior habits. We use different gadgets and devices like mobile phones and computers to connect to digital reality. These technological developments and new design directions have led to the need of developing interfaces to produce user-friendly products. This thesis researches how to design a better user interface and user experience by reviewing the reference list. Through the reference list, UIUX designers can check how to use UIUX theory and functions correctly. User-friendly (Ease of use) UIUX products and services can meet user needs and enable business growth. | en |
| dc.description.provenance | Made available in DSpace on 2021-06-17T09:09:29Z (GMT). No. of bitstreams: 1 U0001-1403202120412700.pdf: 8600885 bytes, checksum: 5ebce7b1042ed862e3d294824541dbba (MD5) Previous issue date: 2021 | en |
| dc.description.tableofcontents | ACKNOWLEDGEMENT I ABSTRACT II LIST OF FIGURES VI LIST OF TABLES VIII 1. INTRODUCTION 1 1.1. PROBLEM STATEMENT OF UI/UX 1 1.2. WHAT IS THE DIFFERENCE BETWEEN UI/UX? 2 1.3. UIUX DESIGN PROCESS 3 1.3.1. UX strategy 3 1.3.2. Research and analysis 3 1.3.3. UI design and development 3 1.3.4. Testing 3 1.3.5. Delivery 3 2. USER EXPERIENCE DESIGN AND USER INTERFACE DESIGN 4 2.1. BASIC KNOWLEDGE OF USER EXPERIENCE DESIGN 4 2.1.1. What to focus? (How Users Feel?) 4 2.1.2. Tool or software to use 5 2.1.3. UX Design Process 6 2.1.4. UNDERSTAND 7 2.1.5. RESEARCH 8 2.1.6. ANALYZE 9 2.1.7. DESIGN 9 2.1.8. LAUNCH 9 2.1.9. EVALUATE (ANALYZE AGAIN) 10 2.2. A SUCCESSFUL UX DESIGNER 10 2.2.1. INTERACTIVE DESIGN 10 2.2.2. INTERFACE DESIGN 10 2.2.3. USER PSYCHOLOGY 11 2.2.4. PROBLEM SOLVING 11 2.2.5. COLLABORATION 12 2.3. USER INTERFACE DESIGN 12 2.3.1. BASIC KNOWLEDGE OF UI 12 2.3.2. TOOL OR SOFTWARE TO USE 14 2.3.3. UI DESIGN PROCESS 14 2.3.3.1. RESEARCH 14 2.3.3.2. SKETCHING 16 2.3.3.3. DIGITIZE 17 2.3.3.4. PRESENTING WITH PROTOTYPE 18 2.4. KEYS TO SUCCESSFUL USER INTERFACE DESIGN 19 2.4.1. LESS IS MORE 19 2.4.2. CONSISTENCY 20 2.4.3. INTERFACE 21 2.4.4. COLOR AND TEXTURE 22 3. UI/UX DESIGNER’S REFERENCE LIST 23 3.1. STYLE GUIDE 24 3.2. COLOR AND SPACE 28 3.3. TYPOGRAPHY 29 3.4. LAYOUT 30 3.5. GRID, MARGIN, PADDING 31 3.6. ICON, LABEL, SPACE 32 3.7. OVERLAPPING 33 3.8. THUMB ZONE 34 3.9. TAPPABLE AREA 35 3.10. BUTTON STYLES 36 3.10.1. BUTTON ANATOMY 36 3.10.2. BUTTON PLACEMENT ORDER 36 3.10.3. BUTTON COLOR 37 3.10.4. BUTTON STATES 37 3.10.5. BUTTON HIERARCHY 38 3.10.6. CALL TO ACTION (CTA) 39 3.11. CHECKBOX / RADIO BUTTON / DROPDOWN 40 3.12. ACCENT BORDERS POP-UP 41 3.13. NAVIGATION BREADCRUMBS 42 3.14. TAB MODULE TAB 44 3.15. ACCORDION 45 3.16. INPUT STEPPERS 46 3.17. TEXT FIELD 47 3.18. SEGMENTED CONTROL TOGGLE SWITCH 49 3.19. DATE PICKER DATE RANGE PICKER 50 3.20. PROGRESS INDICATOR SLIDER 51 3.21. UPLOAD DOWNLOAD 52 3.22. EMPTY STATE PAGE 54 3.23. SEARCH FILTER SORT 55 3.24. SCROLL BAR ACTION BAR 56 3.25. INLINE EDITING BULK ACTION 57 3.26. CARD 58 3.27. TOOLTIP 59 3.28. PAGINATION 60 4. CASE STUDY – APPLY BETTER UIUX CHECKLIST CONCEPT 61 4.1. TEX ORIGINAL DESIGN AND REDESIGN 61 4.2. BUTTON HIERARCHY AND CALL TO ACTION BUTTON 62 4.3. NAVIGATION AND BREADCRUMB 63 4.4. DROPDOWN, TAB, SEARCH BUTTON 64 4.5. INPUT STEPPERS AND LABEL 65 4.6. DATE AND TIME PICKER 66 4.7. RADIO BUTTON AND TEXT FIELD 67 4.8. POP-UP AND ASCENDER BAR 68 5. CONCLUSION 69 REFERENCE 70 | |
| dc.language.iso | en | |
| dc.title | UIUX 設計參考清單 | zh_TW |
| dc.title | A reference list for making a better UI UX design | en |
| dc.type | Thesis | |
| dc.date.schoolyear | 109-2 | |
| dc.description.degree | 碩士 | |
| dc.contributor.oralexamcommittee | 陳建錦(Chien-Chin Chen),盧信銘(Hsin-Min Lu) | |
| dc.subject.keyword | 使用者介面設計,使用者經驗設計,介面設計,視覺設計,數位設計,設計流程,設計清單, | zh_TW |
| dc.subject.keyword | Interface Design,User Interface Design,User Experience Design,Visual Design,Digital Design,Design Process,Design Reference List, | en |
| dc.relation.page | 73 | |
| dc.identifier.doi | 10.6342/NTU202100786 | |
| dc.rights.note | 有償授權 | |
| dc.date.accepted | 2021-03-16 | |
| dc.contributor.author-college | 管理學院 | zh_TW |
| dc.contributor.author-dept | 企業管理碩士專班 | zh_TW |
| 顯示於系所單位： | 管理學院企業管理專班(Global MBA) | |
文件中的檔案：
| 檔案 | 大小 | 格式 | |
|---|---|---|---|
| U0001-1403202120412700.pdf 目前未授權公開取用 | 8.4 MB | Adobe PDF |
系統中的文件，除了特別指名其著作權條款之外，均受到著作權保護，並且保留所有的權利。